12 week blog
调用一个地图（百度地图）API（定位） 到网站：
1.调用API的js :
<script type="text/javascript" src="https://api.map.baidu.com/api?type=subway&v=1.0&ak=2Xn5TnHUisrYpE8oy5OCAun8YkiGrbcy"></script>
2.设置地图容器的样式：
<style type="text/css">
#container{height:100%}
html,body,div{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
</style>
3.在在<body></body>中放置地图容器
<div id="container"></div>
4.在</body></html>中放置自己的js
<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>
