前端学习3—地图控件使用

时间:2024-05-18 12:07:06

地图控件也是Web界面中经常用到的元素之一。

看了一些Html5的书,发现那些书只能用来参考,如果从头至尾把各标签记下来不仅花费时间,也不能快速进行实践。

快速的办法就是站在前人的肩膀上,用好各种工具。

比如地图控件,高德地图和百度地图都有相应的开发网站,我选择的是高德地图开发网站。

1. 搜索“高德地图开发”,选择“Web端->JavaScript API”,访问https://lbs.amap.com/api/javascript-api/example/map-lifecycle/map-show

前端学习3—地图控件使用

2. 直接拷贝代码至.html文件即可。

3. 查询自己需要的经纬度,修改至代码中“ center: [116.397428, 39.90923] //初始化地图中心点”,地图就会展示你想要显示的地点。

思考——程序调试

即使是单纯的拷贝前人的代码,也会遇到页面显示不对的情况。这种情况下,

a. 先检查下代码的标签开头与结束是匹配,如<div></div>、元素的ID是否重复等。

b. F12调出开发者模式,选择“Console”,查看报错。

    如果不太理解程序的报错信息,可以将其复制到百度上查看相关解决信息。一般都可解决。

前端学习3—地图控件使用