H5项目需要嵌入地图,显示客户地址。考虑到高德开放平台API还是蛮全的,所以选择它了。
方法/步骤
1、要想使用高德地图,首先要申请”Web服务API”密钥(key),这个要先认证身份。我们先找到“高德地图开放平台”官网,右上角点击“注册”,按提示一步步操作,注册成为开发者。
2、注册完成之后,右上角“控制台”进入,创建一个新应用。点击左边“我的应用“,点击右边内容区右上角“创建新应用”,弹出编辑界面。填入新的应用名称。
3、在新建的应用上,点击“添加”,在弹出的对话框中,输入key名称,选择绑定的服务为“嘛术铹砾web服务”,然后提交。成功之后就可以看到申请的key。有了这个key我们就可以在项目中调用高德API。
4、现在我们开始编写页面代码。首选引入对于的js和css文件。里面key就是上面申请的key。再创建一个地图的容器。
5、接下来生成地图。zoom:17,//初始缩放士候眨塄大小。center:['${lon}','${lat}']//初始坐番舸榆毛标,这里lon和lat是经度和纬度,是后台代码传过的。很多参数设置可以参考官方文档。接着为地图增加点标记,默认是一个蓝色的小气球标记。还可以为标记创建提示框,“content”可以定义自己的提示信息。
6、其他的设置可以按自己的需求添加对于的api。现在启动项目,进入页面查看。效果如图。
7、最后总结下,高德地图简单上手还是很容易,官方的api资料很多,很多api需要自己实践摸索。