
这个实现起来很简单,注册一下开发者,然后创建应用,通过JS引入HTML中就行,下面我简单介绍一下过程:
1.注册高德地图开发者,这个按着网站提示一步一步完成就行,如下,简单:
2.注册成功后,登录高德地图,进入“个人中心”->“我的应用”,点击最上角的“创建应用”,如下,填入必须的信息就行:
3.应用创建成功后,就需要添加key,这个直接点击应用右边的“+”就行,如下,设置key名称,选择Web端(JSAPI),如下:
添加成功后,如下,这里需要记住key值,后面的代码中要用到这个值:
4.key添加成功后,就可以直接在HTML中引入使用了,测试代码如下,很简单,就是添加一下JS代码,引入高德地图:
保存这个html文件,然后直接双击运行,浏览器中就可加载出地图:
至此,就完成了将高德地图添加到HTML网页中。总的来说,整个很简单,就是引入JS,然后直接在网页中显示就行,其实,高德地图官网对于开发者已经提供了非常丰富的资料和文档,介绍的也很详细,每一步都有代码和结果,还可以在线编辑运行,查看效果,最好的资料就是查看官网资料,地址/api/javascript-api/guide/abc/prepare,当然,网上也有相关资料和教程,感兴趣的可以搜一下,希望以上分享的内容能对你有所帮助吧。
这个其实很简单,不难,需要先注册一下开发者,然后创建应用、添加Key值,最后再通过JS将地图引入到HTML网页中就行,下面我简单介绍一下实现过程,主要内容如下:
1.首先,注册高德地图开发者,这个直接到“高德开放平台”注册就行,如下,输入相关注册信息,很快就能成功:
2.注册成功后,登录账号,这里我们需要先创建应用,依次点击“个人中心”->“应用管理”->“我的应用”,切换到应用管理界面,点击右上角的“创建新应用”按钮,就会d出如下窗口,这里我们输入应用名称和类别就行:
创建成功后,新创建的应用就会出现在应用管理界面中,接着我们点击应用右边的“+”号,为应用添加key值,如下,这里输入Key名称,选择“Web端(JSAPI)”就行:
添加成功后的key值如下,后面的代码中需要用到这个key值:
3.接着就是引入地图了,这个很简单,需要先创建一个div容器,然后通过JSAPI引入地图到这个容器中就行,测试代码如下,很简单:
保存这个网页文件,用浏览器打开,效果如下,已经成功引入高德地图:
4.这里我们也可以引入地铁地图,其实和上面引入普通地图的步骤差不多,也需要先创建div容器,最后再通过JSAPI引入就行,测试代码如下:
保存文件,用浏览器打开效果如下,已经成功引入地铁地图:
至此,我们就完成了在前端网页中引入高德地图。总的来说,整个过程很简单,就是创建应用,添加Key值,然后再通过JSAPI引入地图到网页div容器中,只要你有一定的前端基础知识,熟悉一下相关示例和代码,很快就能掌握的,官方也提供了非常详细的开发文档,非常适合开发者学习,可以参考一下,网上也有相关资料和教程,感兴趣的话,可以搜一下,希望以上分享的内容能对你有所帮助吧,也欢迎大家评论。
这个不难,主要是注册开发者,创建应用,然后通过JSAPI在html网页中引入3D地图,下面我简单介绍一下实现过程,主要内容如下:
1.首先,注册高德地图开发者,这个直接在官网上注册,输入必要信息就行,如下:
2.注册完成后,进入个人中心,依次点击“应用管理”->“我的应用”->“创建新应用”,如下,这里输入应用名称,选择类型就行:
接着就需要为应用添加key值,点击右上角的+号,就会d出添加窗口,这里我们选择“Web端(JSAPI)”,如下:
添加key值成功后,就会在应用列表中看到刚才添加的key值,如下,后面的代码中需要用到这个key值:
3.最后就是编写代码,在html页面中引入3D地图了,如下,代码很简单,主要是创建div容器,然后通过JS引入地图到这个容器中,这里需要JSAPI版本在1.4.0以上,指定地图模式为3D,key值替换成自己应用的key值:
用浏览器打开这个html页面,效果如下,已经成功引入3D地图:
至此,我们就完成了在html页面中引入高德3D地图。总的来说,整个过程不难,代码量也不是很多,只要你熟悉一下流程和相关示例,很快就能掌握的,官网提供了非常丰富的开发文档,非常适合初学者学习,感兴趣的可以搜一下,网上相关资料也很多,可以借鉴一下,希望以上分享的内容能对你有所帮助吧,也欢迎大家评论、留言。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)