百度图标设计软件下载(百度在线logo设计)
<p>百度地图开放平台功能强大,使用简单,为地图的自定义提供了非常方便的途径!
</p><p>
本文以绘制一张全国机器辐射图为例记录其基本使用方法,效果如下图:
</p><p class="ql-align-center">
<br/>
</p><p class="pgc-img-caption">
</p><p class="ql-align-center">
<br/>
</p><p>
图中包括了带图标和文本的标注,连线以及图例。
</p><p>
<strong>
1.关于坐标
</strong>
</p><p>
说到地图,不得不说坐标。
</p><p>
我以为,GPS获取经纬度之后,把经纬度丢给地图就可以了。但
<strong>
那真的是自以为
</strong>
。
</p><p>
<strong>
1.1 坐标系
</strong>
</p><p>
来看看实际情况,以下是百度开发文档里的描述:
</p><p>
目前国内主要有以下三种坐标系:
</p><p>
<strong>
WGS84
</strong>
:为一种大地坐标系,也是目前广泛使用的GPS全球卫星定位系统使用的坐标系。
</p><p>
<strong>
GCJ02
</strong>
:又称火星坐标系,是由中国国家测绘局制订的地理信息系统的坐标系统。由WGS84坐标系经加密后的坐标系。
</p><p>
<strong>
BD09
</strong>
:为百度坐标系,在GCJ02坐标系基础上再次加密。其中bd09ll表示百度经纬度坐标,bd09mc表示百度墨卡托米制坐标。
</p><p>
非中国地区地图,服务坐标统一使用WGS84坐标。
</p><p>
百度对外接口的坐标系为BD09坐标系,并不是GPS采集的真实经纬度,在使用百度地图JavaScript API服务前,需先将非百度坐标通过坐标转换接口转换成百度坐标。
</p><p>
<strong>
通过 GPS 获取的为 WGS84,在百度地图上使用前要转换为 BD09
</strong>
,百度提供了相应的 api 进行坐标转换,文档地址:http://lbsyun.baidu.com/index.php?title=webapi/guide/changeposition
</p><p>
具体还可参考下这篇文章:https://www.cnblogs.com/yesicoo/p/4668642.html
</p><p>
<strong>
1.2 坐标拾取器
</strong>
</p><p>
如果坐标是静态的,或测试用,可以直接通过百度地图提供的“坐标拾取器”工具来获取经纬度。
</p><p>
工具地址:http://api.map.baidu.com/lbsapi/getpoint/index.html
</p><p>
点哪就获取哪的坐标,此坐标不用再转换,复制过来即可以使用。
</p><p>
<strong>
2. 开始应用
</strong>
</p><p>
<strong>
2.1 准备图标
</strong>
</p><p>
有好些站点可以下载图标,如:https://easyicon.net,可以获取一些图标文件。至于商用的要求则要看看站点说明。
</p><p>
如下图,这里准备总部与机器的图标下载保存为 head.png、machine.png。
</p><p class="pgc-img-caption">
</p><p class="ql-align-center">
<br/>
</p><p>
<strong>
2.2 开启百度地图
</strong>
</p><p>
地图API的使用需要先申请一个 ak,为了体验方便,这里已经申请了一个可以直接使用的 key,在页面中可直接加入以下引用。
</p><p>
使用以下语句,定义全局的地图对象
</p><p>
<strong>
2.2 标注:图标与文本
</strong>
</p><p>
标注使用 BMap.Marker,可以为其指定 Icon与Label。为了方便后续使用,本例定义以下函数,指定位置、图标(本例中可用已经下载的图标 head,machine)以及文本即可。
</p><p>
<strong>
2.3 连线
</strong>
</p><p>
连线实际使用的是绘制多边形的功能,只是当只指定了两个点时,就是一根线。同样,这里定义一个函数以方便直接调用。
</p><p>
<strong>
2.4 图例
</strong>
</p><p>
图例需要以地图定义的控件方式来添加,在控件的 initialize 事件中完成 DOM 元素的生成即可,为了体现过程本身,以下函数把 DOM 的html文本作为参数,由外部灵活定义。
</p><p>
<strong>
2.5 综合
</strong>
</p><p>
有了以上函数,综合起来就流程清晰了。以下坐标,均通过坐标拾取器获取。
</p><p>
<strong>
3. 结语
</strong>
</p><p>
本文完整代码可从此处下载:
</p><p>
https://github.com/triplestudio/helloworld/blob/master/baidu_map_demo.html
</p><p>
在此基础上,可以根据需要进一步扩展功能,具体参考百度地图开放平台开发文档:
</p><p>
http://lbsyun.baidu.com/
</p> 牛啊兄弟 支持一下 沙发!沙发! 看帖回帖是美德!:lol 学习了,谢谢分享、、、 不错,支持下楼主 前排支持下 好好 学习了 确实不错 学习了,不错,讲得太有道理了 找到好贴不容易,兄弟们,顶起!