我试着用TopoJSON来获取带有传单-Geoman插件的线条的拓扑运动。有一个名为方法 topojson.mesh的
返回表示给定拓扑中指定对象的网格的GeoJSON MultiLineString几何对象。这对于有效地呈现复杂对象中的笔画非常有用,因为由多个特征共享的边缘只会被抚摸一次。如果未指定对象,则返回整个拓扑的网格。
感谢这帖子中的答复,我已经能够使用topojson.mesh返回MultiLineString。由于传单-Geoman支持MultiLineString,我想到的想法可能是返回的网格,可以编辑传单-Geoman,同时保持拓扑性质。
但是,当我试图完成它时,返回的MultiLineString会被分成两部分,当我试图使用geoman插件编辑它时。我的问题是,如果这真的是一个从topojson.mesh返回的网格,为什么要分隔行?这是由风水插件引起的吗?如果是这样的话,我怎么做呢?是否可以通过在维护拓扑的同时拖动节点来改变节点的位置?
我会附上下面的代码
<!DOCTYPE html>
<html>
<head>
<title>Topology Test</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="src/css/leaflet.css" />
<link type="text/css" rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
<link rel="stylesheet" href="https://unpkg.com/@geoman-io/leaflet-geoman-free@latest/dist/leaflet-geoman.css" />
<style>
#mapdiv {
height: 899px;
background-color: #acd6e2;
}
</style>
</head>
<body>
<div id="mapdiv"></div>
<script src="https://unpkg.com/topojson@3"></script>
<script src="src/js/leaflet-src.js"></script>
<script src="https://unpkg.com/@geoman-io/leaflet-geoman-free@latest/dist/leaflet-geoman.min.js"></script>
<script>
var mymap = L.map('mapdiv', {
layers: [
new L.TileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
'attribution': 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors'
})
],
});
mymap.pm.addControls({
position: 'topleft',
drawCircle: false,
});
fetch("data/data.geojson")
.then(res => res.json())
.then(json => {
//var layer = L.geoJSON(json).addTo(map);
var topo = topojson.topology([json]);
console.log(json, topo, topojson.mesh(topo));
var layerLines = L.geoJson(topojson.mesh(topo), {
fill: false,
}).addTo(mymap);
mymap.fitBounds(layerLines.getBounds());
});
</script>
</body>
</html>data.geojson
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-113,
37
],
[
-113,
40
],
[
-109,
40
],
[
-109,
37
],
[
-113,
37
]
]
]
}
},
{
"type": "Feature",
"properties": {},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-109,
37
],
[
-109,
39
],
[
-104,
39
],
[
-104,
37
],
[
-109,
37
]
]
]
}
},
{
"type": "Feature",
"properties": {},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-109,
34
],
[
-109,
37
],
[
-102,
37
],
[
-102,
34
],
[
-109,
34
]
]
]
}
},
{
"type": "Feature",
"properties": {},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-104,
37
],
[
-104,
40
],
[
-100,
40
],
[
-100,
37
],
[
-104,
37
]
]
]
}
}
]
}发布于 2021-07-02 09:21:46
对于那些正在寻找这类问题的答案的人,我发现了一种使用OpenLayers v6.5.0的方法。它们是绘制和修改特征的一个例子,它可以维护线条和多边形的拓扑结构。
希望这对某人有帮助:)
https://stackoverflow.com/questions/68141878
复制相似问题