高德定位学习 Day2

这是学习使用高德地图api的第二天，可能我的学习过程不是完善的，毕竟我也是在挑选自己觉得会有使用性的api进行学习，完全学习所有api我觉得暂时是不需要的；

一：设置地图中心点，

 // 传入经纬度，设置地图中心点 //宣武门坐标
    var position = new AMap.LngLat(116.374314, 39.899765);  // 标准写法
    // 简写 var position = [116, 39]; 
    map.setCenter(position);
    // 获取地图中心点
    var currentCenter = map.getCenter();

 效果图：

 

 

 

二：设置地图级别

    // 设置地图级别，级别为数字。
    // PC上，参数zoom可设范围：[3,18]；
    // 移动端：参数zoom可设范围：[3,19]
    map.setZoom(14);
    // 获取地图级别
    var currentZoom = map.getZoom(); 
    console.log('====currentZoom',currentZoom)

效果图：

三：同时设置缩放级别和中心点经纬度

// 同时传入缩放级别和中心点经纬度
    map.setZoomAndCenter(15, [116.374314, 39.899765]);

效果图：

四：同时显示所有点

    var map = new AMap.Map("container", {
        resizeEnable: true,
        zoom: 12,
        center: [116.397428, 39.90923]
    })
    //东北
    var m = new AMap.Marker({
        position: [121.851547, 52.762852],
        map: map
    });
    //海南
    var m2 = new AMap.Marker({
        position: [109.439743, 18.529034],
        map: map
    })
    //希望自适应展示的部分的点
    var markers = [], positions = [[116.405467, 39.907761], [116.415467, 39.907761], [116.415467, 39.917761], [116.425467, 39.907761], [116.385467, 39.907761]];
    for (var i = 0, marker; i < positions.length; i++) {
        marker = new AMap.Marker({
            map: map,
            icon: 'http://webapi.amap.com/theme/v1.3/markers/n/mark_b' + (i + 1) + '.png',
            position: positions[i]
        });
        markers.push(marker);
    }
    map.setFitView();//如果直接这样写，默认是把东北和海南的点都展示出来，

效果图：

五：只显示部分点

   // map.setFitView();//如果直接这样写，默认是把东北和海南的点都展示出来，
    // //但是希望只自适应的展示markers里的5个点
    map.setFitView(markers);

效果图：

六：把想自适应的部分的点装在一个透明的覆盖物图层里

var polygon = new AMap.Polygon({
        path: positions,  //以5个点的坐标创建一个隐藏的多边形
        map: map,
        strokeOpacity: 1,//不透明
        fillOpacity: 0,//透明
        bubble: true//事件穿透到地图
    });
    var overlaysList = map.getAllOverlays('polygon');//获取多边形图层
    //2.使用setFitView方法
    // map.setFitView(overlaysList);//自适应显示

效果图1：

效果图2：

七：设置显示点标信息

使用icon和content都可以，但是如果content存在时，icon无效；

draggable可以设置，便于移动标点，获取标点信息，进行数据存储；