web 12
调用一个地图（百度地图）API（定位） 到网站：
1.调用API的js :
<script type="text/javascript" src="https://api.map.baidu.com/api?type=subway&v=1.0&ak=2Xn5TnHUisrYpE8oy5OCAun8YkiGrbcy"></script>
2.设置地图容器的样式：
<script type="text/javascript">
/**
* 从所有城市列表中获取北京信息
* 结果格式
* {
* keyword: 'beijing',
* name: '北京',
* citycode: '131'
* }
*/
/* globals BMapSub */
var subwayCityName = '北京';
var list = BMapSub.SubwayCitiesList;
var subwaycity = null;
for (var i = 0; i < list.length; i++) {
if (list[i].name === subwayCityName) {
subwaycity = list[i];
break;
}
}
// 获取北京地铁数据-初始化地铁图
var subway = new BMapSub.Subway('container', subwaycity.citycode);
subway.setZoom(0.5);
</script>
代码如下：
最终代码如下：
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
5 <title>地铁图展示</title>
6 <script type="text/javascript" src="https://api.map.baidu.com/api?type=subway&v=1.0&ak=2Xn5TnHUisrYpE8oy5OCAun8YkiGrbcy"></script>
7 <style type="text/css">
8 #container{height:100%}
9 html,body,div{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
42 </style>
43 </head>
44 <body>
60 <div id="container"></div>
61 <script type="text/javascript">
62 /**
63 * 从所有城市列表中获取北京信息
64 * 结果格式
65 * {
66 * keyword: 'beijing',
67 * name: '北京',
68 * citycode: '131'
69 * }
70 */
71 /* globals BMapSub */
72 var subwayCityName = '北京';
73 var list = BMapSub.SubwayCitiesList;
74 var subwaycity = null;
75 for (var i = 0; i < list.length; i++) {
76 if (list[i].name === subwayCityName) {
77 subwaycity = list[i];
78 break;
79 }
80 }
81 // 获取北京地铁数据-初始化地铁图
82 var subway = new BMapSub.Subway('container', subwaycity.citycode);
83 subway.setZoom(0.5);
84 </script>
85 </body>
86 </html>
web 12的更多相关文章
- 《Using Python to Access Web Data》Week4 Programs that Surf the Web 课堂笔记
Coursera课程<Using Python to Access Web Data> 密歇根大学 Week4 Programs that Surf the Web 12.3 Unicod ...
- 分享20款移动开发中很有用的 jQuery 插件
今天,很显然每个网站都需要有一个移动优化的界面以提高移动用户的使用体验.在开发任何移动项目时,要尽可能保持每一种资源尺寸都尽可能的小,以给最终用户提供一个好的体验是非常重要的.在这篇文章中我们已经编制 ...
- WCF入门教程二[WCF应用的通信过程]
一.概述 WCF能够建立一个跨平台的安全.可信赖.事务性的解决方案,是一个WebService,.Net Remoting,Enterprise Service,WSE,MSMQ的并集,有一副很经典的 ...
- C#获取本机IP以及无线网ip
1 private void GetIP() 2 { 3 string hostName = Dns.GetHostName();//本机名 4 //System.Net.IPAddress ...
- Heartbeat+DRBD+NFS 构建高可用的文件系统
1.实验拓扑图 2.修改主机名 1 2 3 vim /etc/sysconfig/network vim /etc/hosts drbd1.free.com drbd2.free.com 3. ...
- python 各模块
01 关于本书 02 代码约定 03 关于例子 04 如何联系我们 1 核心模块 11 介绍 111 内建函数和异常 112 操作系统接口模块 113 类型支持模块 114 正则表达式 115 语言支 ...
- WCF入门教程系列二
一.概述 WCF能够建立一个跨平台的安全.可信赖.事务性的解决方案,是一个WebService,.Net Remoting,Enterprise Service,WSE,MSMQ的并集,有一副很经典的 ...
- C#获取本机IP方法,获取本机局域网IP地址方法
1. private void GetIP() { string hostName = Dns.GetHostName();//本机名 //System.Net.IPAddress[] address ...
- WCF通信过程
无废话WCF入门教程二[WCF应用的通信过程] 一.概述 WCF能够建立一个跨平台的安全.可信赖.事务性的解决方案,是一个WebService,.Net Remoting,Enterprise Ser ...
随机推荐
- REM方案总结
flexible.js方案 1.设置根元素字体大小为屏幕宽度的十分之一. 2.即根元素字体大小与屏幕宽度的比例为:1/10. jQuery.weui的rem设计方案 1.以屏幕宽度375px为基础,根 ...
- spring cloud--zuul网关和zuul请求过滤
这里仍然以Windows和jdk为运行环境,按照下面的步骤打包-运行-访问就能看到效果.启动项目jar包: java -jar F:\jars-zuul\register-0.0.1-SNAPSHOT ...
- CF1153C Serval and Parenthesis Sequence
题目地址:CF1153C Serval and Parenthesis Sequence 思路:贪心 如果有解,那么 \(s_0 = (\) && \(s_{n-1} = )\) &a ...
- [Kubernetes]浅谈容器网络
Veth Pair 这部分内容主要介绍一个设备: Veth Pair . 作为一个容器,它可以声明直接使用宿主机的网络栈,即:不开启 Network Namespace .在这种情况下,这个容器启动后 ...
- mac 终端里进入mysql和退出
先在偏好设置里启动mysql服务 获取超级权限 在终端输入代码 sudo su 输入完后获取超级权限 终端显示 sh-3.2# 输入本机密码(Apple ID密码) 接着通过绝对路径登陆 代码 /us ...
- Numpy 多维数组简介
 NumPy是一个功能强大的Python库,主要用于对多维数组执行计算.NumPy这个词来源于两个单词-- Numerical和Python.NumPy提供了大量的库函数和操作,可以帮助程序员轻松地 ...
- Revit二次钢筋
- MariaDB存储过程笔记
FECTH INTO 字段名不能与 CURSOR FOR 中select字段名一致,否则FETCH出的值均为空. DECLARE 字段名不能与 CURSOR FOR 中select语句内where条件 ...
- JUC--volatiley&CAS
public class VolatileTest { public static void main(String[] args) { ThreadDemo td = new ThreadDemo( ...
- 图文详解之ZSH美化你的终端CLI
在这个博客中,我将介绍安装ITerm2,ZSH shell,“我的ZSH”,主题,ITerm2配色方案,“我的ZSH”插件,并启用“连线”支持,以帮助创建一个美丽而强大的终端. 如果你想让你的常规Ba ...