前一段研究了一些百度地图,正好在闲暇时间总结一下,欢迎大家提意见。这是一个系列,叫玩转百度地图。具体会出几篇还不一定,我会慢慢的整理百度地图的功
能,并一篇篇的记录下来。这是第一篇,不做过多的讲解,只是起一个引导,首先教大家如何在页面上显示一个百度地图。首先上一个实例,然后再一一讲解每句话
的含义。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>
百度地图的Hello, World</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=46ce9d0614bf7aefe0ba562f8cf87194&v=1.1&services=true">
</script>
</head>
<body>
<div style="width:520px;height:340px;border:1px solid gray" id="container">
</div>
</body>
</html>
<script type="text/javascript">
var map = new BMap.Map("container"); // 创建Map实例
var point = new BMap.Point(113.6,34.7); // 创建点坐标
map.centerAndZoom(point,15); // 初始化地图,设置中心点坐标和地图级别。
</script>
下面讲解一下这些代码:
1.<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.1&services=true">
是连接百度地图的js文件,我这里用的key是百度地图测试key。
2.<div style="width:520px;height:340px;border:1px solid gray" id="container">用来设置百度地图的显示大小,相信大家都能看的懂。
3.var map = new BMap.Map("container"); // 创建Map实例
var point = new BMap.Point(113.6,34.7); // 创建点坐标
map.centerAndZoom(point,15); // 初始化地图,设置中心点坐标和地图级别。
point是一个经纬度点,Point(经度, 纬度)。
最后一句用来设置地图的缩放比例和地图的中心点。大家可以尝试调一下缩放比例,现在是15,越大缩放就越大。
好了,这一篇就讲这么多,下一篇准备讲在地图上怎样加一个缩放杆,这样就更加便于缩放了,希望大家继续关注!
分享到:
相关推荐
玩转BLENDER 3D动画角色创作 玩转BLENDER 3D动画角色创作 玩转BLENDER 3D动画角色创作 玩转BLENDER 3D动画角色创作
互联网卷B同学玩转物联网开发入门课 互联网卷B同学玩转物联网开发入门课 互联网卷B同学玩转物联网开发入门课 互联网卷B同学玩转物联网开发入门课 互联网卷B同学玩转物联网开发入门课 互联网卷B同学玩转...
每天5分钟玩转Kubernetes.rar
树莓派开始,玩转Linux,树莓派开始,玩转linux pdf,LINUX源码
离线地图、出行服务全新上线,生活频道、周边攻略一网打尽,玩转三地全搞定,从此中国无盲点。 生活服务: 详情页全新改版,更简洁的页面结构,更流畅的加载速度。 新增购物中心,方便的购物指南、详尽的楼层导购...
每天5分钟玩转OpenStack.pdf 每天5分钟玩转OpenStack.pdf
玩转人才地图.pptx
韩顺平玩转javascript,韩顺平玩转javascript
《玩转Blender》原书配套彩图 原书在这里http://download.csdn.net/download/woainilalala007/10125954
韩顺平玩转oracle视频教程笔记
玩转430之玩转UART
玩转Blender 3D动画角色创作完整版,世面上不多的pdf文档
每天5分钟玩转Kubernetes
来吧,带你玩转EXCEL VBA光盘内容!绝对有用的工具书,适合VBA入门者
每天5分钟玩转OpenStack.PDF
每天5分钟玩转Docker容器技术.pdf 每天5分钟玩转Docker容器技术.pdf
小小小
玩转电脑技巧全书玩转电脑技巧全书 玩转电脑技巧全书玩转电脑技巧全书
21个项目玩转深度学习基于tensorflow实践详解,仅参考,请支持原作者正版图书,请从正规渠道购买,谢谢原作者!