小码农 – 高德地图API使用

小码农小码农

小码农

wordpress,laravel和前端知识学习

高德地图API使用

最近为公司制作网站的时候,需要使用地图展示功能。突然想到需要去注册百度开发者账号,发现百度开发者账号注册不了(个人原因),因此决定转战高德地图。注册高德地图开发者账号之后,创建应用就可以使用了,这里不多赘述。主要记录展示常用API调用。

1. 准备工作

s

  1. 申请JS API的开发者key
  2. 引入高德地图JavaScript API文件:
    <script type="text/javascript" src="webapi.amap.com/map?v=1.3&key=申请的key值"></script>
  3. 在html文件中创建地图容器(id可自定义)
    <div id="myMap"><div>
  4. 设定地图容器大小(大小合适即可)
    #myMap{width:500px;height:300px}

2. 创建地图

  1. 创建地图对象
    var map = new AMap.Map('myMap');
  2. 设定地图中心点和级别
    var map = new AMap.Map('myMap',{
         zoom:10,
         center:[113.649843,34.785331]
    })

    或者

    var map =new AMap.Map('myMap');
    map.setZoom(10);
    map.setCenter([113.649843,34.785331]);

未完待续······

很好 0 差极了 0