/** 往 polygon 中添加一个洞 */
function addHole(polygon: T.Polygon) {
const handler = new T.PolygonTool(map)
handler.open()
handler.addEventListener('draw', ({ currentPolygon }) => {
const oldLnglats = polygon.getLngLats()
map.removeOverLay(currentPolygon)
polygon.setLngLats([...oldLnglats, ...currentPolygon.getLngLats()])
})
}
/** 编辑带洞多边形,实则将其拆分为多个多边形,这里记录其对应关系,完成编辑后重新组合 */
const editableHolePolygon = new Map<T.Polygon, T.Polygon[]>()
/** 开启 polygon 编辑,支持带洞多边形编辑 */
function enableEdit(polygon: T.Polygon) {
const lnglats = polygon.getLngLats()
if (lnglats.length > 1) {
let polygons = editableHolePolygon.get(polygon)
if (polygons) {
polygons.forEach((_polygon, index) => {
_polygon.enableEdit()
if (index > 0) {
_polygon.setFillOpacity(0)
}
})
}
else {
map.removeOverLay(polygon)
// 带洞多边形
polygons = lnglats.map((points, index) => {
const _polygon = new T.Polygon(points)
map.addOverLay(_polygon)
_polygon.enableEdit()
if (index > 0) {
_polygon.setFillOpacity(0)
}
return _polygon
})
editableHolePolygon.set(polygon, polygons)
}
}
else {
// 普通多边形
polygon.enableEdit()
}
}
/** 取消 polygon 编辑,支持带洞多边形 */
function disableEdit(polygon: T.Polygon) {
const polygons = editableHolePolygon.get(polygon)
if (polygons) {
const points = polygons.map((_polygon) => {
_polygon.disableEdit()
map.removeOverLay(_polygon)
return _polygon.getLngLats()[0]
})
polygon.setLngLats(points)
map.addOverLay(polygon)
editableHolePolygon.delete(polygon)
}
else {
polygon.disableEdit()
}
}