|
|
|
@ -75,7 +75,7 @@ function Markers(props) { |
|
|
|
if (map && !massLayer) { |
|
|
|
let _massLayer = new AMap.MassMarks([], { |
|
|
|
zIndex: 5, // 海量点图层叠加的顺序 |
|
|
|
cursor: "pointer", |
|
|
|
// cursor: "pointer", |
|
|
|
style: style, // 该层内标注是否避让 |
|
|
|
// allowCollision: true, |
|
|
|
}); // 创建海量点图层 |
|
|
|
@ -126,99 +126,10 @@ function Markers(props) { |
|
|
|
const addMarker = (markerArr, _massLayer) => { |
|
|
|
_massLayer.setData(markerArr); |
|
|
|
_massLayer.on("click", function (e) { |
|
|
|
console.log(e.data.option); |
|
|
|
clickCb(e.data.option); |
|
|
|
// Mapmove.setPosition(e.data.lnglat); |
|
|
|
}); |
|
|
|
setMassLayer(_massLayer); |
|
|
|
_massLayer.setMap(map); |
|
|
|
|
|
|
|
// for (let [key, value] of Object.entries(markerArr)) { |
|
|
|
// if (!value.hasOwnProperty("massMarkers")) { |
|
|
|
// value.massMarkers = []; |
|
|
|
// value.nodes.forEach((elem) => { |
|
|
|
// console.log(elem); |
|
|
|
// // let marker = new AMap.LabelMarker({ |
|
|
|
// // position: [elem.lnglat[1], elem.lnglat[0]], |
|
|
|
// // // zIndex: 1006, |
|
|
|
// // icon: icon(elem.type), |
|
|
|
// // // text: text(elem[tooltipKey]), |
|
|
|
// // // content: markerContent(elem.type), |
|
|
|
// // // offset: new AMap.Pixel(-13, -30), |
|
|
|
// // }); |
|
|
|
|
|
|
|
// // marker.data = elem; |
|
|
|
// // value.massMarkers.push(marker); |
|
|
|
// // // marker.bindTooltip(`<span>${elem[tooltipKey]}</span>`, { |
|
|
|
// // // offset: [20, -5], |
|
|
|
// // // direction: "right", |
|
|
|
// // // }); |
|
|
|
// // marker.on("mouseover", function (e) { |
|
|
|
// // console.log(e.data); |
|
|
|
// // var position = e.data.data && e.data.data.position; |
|
|
|
// // if (position) { |
|
|
|
// // Mapmove.setLabel( |
|
|
|
// // '<div class="amap-info-window">' + |
|
|
|
// // position + |
|
|
|
// // '<div class="amap-info-sharp"></div>' + |
|
|
|
// // "</div>" |
|
|
|
// // ); |
|
|
|
// // Mapmove.setPosition(position); |
|
|
|
// // map.add(Mapmove); |
|
|
|
// // } |
|
|
|
// // }); |
|
|
|
// // marker.on("mouseout", function () { |
|
|
|
// // map.remove(Mapmove); |
|
|
|
// // }); |
|
|
|
// }); |
|
|
|
// _massLayer.add(value.massMarkers); |
|
|
|
// } else { |
|
|
|
// _massLayer.add(value.massMarkers); |
|
|
|
// } |
|
|
|
// } |
|
|
|
// _massLayer.setData(markerArr); |
|
|
|
// massMarks.setMap(map); |
|
|
|
// if (clickCb) { |
|
|
|
// _massLayer.on("click", (e) => { |
|
|
|
// console.log(e); |
|
|
|
// // if (data.length == "1") { |
|
|
|
// // let elem = data[0].data.data.data; |
|
|
|
// // clickCb(elem); |
|
|
|
// // } else { |
|
|
|
// // map.openPopup(renderMarkerList(data), e.latlng, { |
|
|
|
// // className: "markers-list-box", |
|
|
|
// // }); |
|
|
|
// // let dom = document.querySelectorAll(".marker-list-item"); |
|
|
|
// // dom.forEach((elem) => { |
|
|
|
// // elem.addEventListener("click", function (e) { |
|
|
|
// // map.closePopup(); |
|
|
|
// // let type = e.target.dataset.type, |
|
|
|
// // id = e.target.dataset.id; |
|
|
|
// // let marker = massObjRef.current["type_" + type].nodes.filter( |
|
|
|
// // (i) => i.locationId == id |
|
|
|
// // )[0]; |
|
|
|
// // let elem = marker.data; |
|
|
|
// // clickCb(elem); |
|
|
|
// // }); |
|
|
|
// // }); |
|
|
|
// // } |
|
|
|
// }); |
|
|
|
// } |
|
|
|
}; |
|
|
|
|
|
|
|
const renderMarkerList = (data) => { |
|
|
|
let template = `<div class="marker-list-content"> |
|
|
|
<div class="marker-list-header">请选择点位</div> |
|
|
|
<div class="marker-list"> |
|
|
|
`; |
|
|
|
data.forEach((elem) => { |
|
|
|
let _data = elem.data.data; |
|
|
|
if (_data.name && _data.locationId) { |
|
|
|
template += `<div class="marker-list-item" data-type="${_data.type}" data-id="${_data.locationId}" title="${_data.name}">${_data.name}</div>`; |
|
|
|
} |
|
|
|
}); |
|
|
|
template += `</div></div>`; |
|
|
|
return template; |
|
|
|
}; |
|
|
|
|
|
|
|
return null; |
|
|
|
|
