5.18

地图设置点标记

var markerLayer = new TMap.MultiMarker({
    map: map,  //指定地图容器
    //样式定义
    styles: {
        //创建一个styleId为"myStyle"的样式(styles的子属性名即为styleId)
        "myStyle": new TMap.MarkerStyle({ 
            "width": 25,  // 点标记样式宽度(像素)
            "height": 35, // 点标记样式高度(像素)
            "src": '../img/marker.png',  //图片路径
            //焦点在图片中的像素位置,一般大头针类似形式的图片以针尖位置做为焦点,圆形点以圆心位置为焦点
            "anchor": { x: 16, y: 32 }  
        }) 
    },
    //点标记数据数组
    geometries: [{
        "id": "1",   //点标记唯一标识,后续如果有删除、修改位置等操作,都需要此id
        "styleId": 'myStyle',  //指定样式id
        "position": new TMap.LatLng(39.954104, 116.357503),  //点标记坐标位置
        "properties": {//自定义属性
            "title": "marker1"
        }
    }, {//第二个点标记
        "id": "2",
        "styleId": 'marker',
        "position": new TMap.LatLng(39.994104, 116.287503),
        "properties": {
            "title": "marker2"
        }
    }
    ]
});

添加点标记:add(geometries: PointGeometry[])

修改点标记:updateGeometries

删除点标记:remove

设置点聚合:

var markerCluster = new TMap.MarkerCluster({
    id: 'cluster', //图层id
    map: map,       //设置点聚合显示在哪个map对象中(创建map的段落省略)
    enableDefaultStyle: true,   //使用默认样式
    minimumClusterSize: 2,  //最小聚合点数:2个
    geometries: [
        {position: new TMap.LatLng(39.982829,116.306934)},
        {position: new TMap.LatLng(39.989011,116.323586)},
        {position: new TMap.LatLng(39.978751,116.313286)},
        {position: new TMap.LatLng(39.980593,116.304359)},
        //....将您所有要打到图中的坐标点传入进来
    ],
    zoomOnClick: true,  //点击聚合数字放大展开
    gridSize: 60,       //聚合算法的可聚合距离,即距离小于该值的点会聚合至一起,默认为60,以像素为单位
    averageCenter: false, //每个聚和簇的中心是否应该是聚类中所有标记的平均值
    maxZoom: 16 //采用聚合策略的最大缩放级别,若地图缩放级别大于该值,则不进行聚合,标点将全部被展开
});

 

posted @ 2021-05-18 18:04  {hunter}ZY  阅读(75)  评论(0编辑  收藏  举报