From 48868340ea04d999b5014c271c157194e78447e0 Mon Sep 17 00:00:00 2001 From: 64af954aa92c2a4195233d17 <64af954aa92c2a4195233d17@devide> Date: Thu, 13 Jul 2023 15:04:29 +0800 Subject: [PATCH] Auto Commit --- index.html | 1 + src/components/amap.vue | 46 ++++++++++++++++++++++++++++++++++------- 2 files changed, 39 insertions(+), 8 deletions(-) diff --git a/index.html b/index.html index 030a6ff..2d0575a 100644 --- a/index.html +++ b/index.html @@ -8,6 +8,7 @@
+ diff --git a/src/components/amap.vue b/src/components/amap.vue index 1d0a52a..ad47453 100644 --- a/src/components/amap.vue +++ b/src/components/amap.vue @@ -18,16 +18,46 @@ function initMap() { zoom: 4, //初始化地图级别 center: [104.06, 35.67], //初始化地图中心点位置 }); - generatePoints().forEach((item) => { - const marker = new AMap.Marker({ - position: new AMap.LngLat(item.position[0], item.position[1]), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] - title: '北京' - }); + // generatePoints().forEach((item) => { + // const marker = new AMap.Marker({ + // position: new AMap.LngLat(item.position[0], item.position[1]), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] + // title: '北京' + // }); - // 将创建的点标记添加到已有的地图实例： - map.add(marker); - }) + // // 将创建的点标记添加到已有的地图实例： + // map.add(marker); + // }) + var style = [{ + url: 'https://a.amap.com/jsapi_demos/static/images/mass0.png', + anchor: new AMap.Pixel(6, 6), + size: new AMap.Size(11, 11) + }, { + url: 'https://a.amap.com/jsapi_demos/static/images/mass1.png', + anchor: new AMap.Pixel(4, 4), + size: new AMap.Size(7, 7) + }, { + url: 'https://a.amap.com/jsapi_demos/static/images/mass2.png', + anchor: new AMap.Pixel(3, 3), + size: new AMap.Size(5, 5) + } + ]; + + var mass = new AMap.MassMarks(citys, { + opacity: 0.8, + zIndex: 111, + cursor: 'pointer', + style: style + }); + + var marker = new AMap.Marker({ content: ' ', map: map }); + + mass.on('mouseover', function (e) { + + marker.setPosition(e.data.lnglat); + marker.setLabel({ content: e.data.name }) + }); + mass.setMap(map); }).catch(e => { console.log(e); }) -- GitLab