首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >维护MultiLineString上的拓扑

维护MultiLineString上的拓扑
EN

Stack Overflow用户
提问于 2021-06-26 11:26:18
回答 1查看 152关注 0票数 0

我试着用TopoJSON来获取带有传单-Geoman插件的线条的拓扑运动。有一个名为方法 topojson.mesh

返回表示给定拓扑中指定对象的网格的GeoJSON MultiLineString几何对象。这对于有效地呈现复杂对象中的笔画非常有用,因为由多个特征共享的边缘只会被抚摸一次。如果未指定对象,则返回整个拓扑的网格。

感谢帖子中的答复,我已经能够使用topojson.mesh返回MultiLineString。由于传单-Geoman支持MultiLineString,我想到的想法可能是返回的网格,可以编辑传单-Geoman,同时保持拓扑性质。

但是,当我试图完成它时,返回的MultiLineString会被分成两部分,当我试图使用geoman插件编辑它时。我的问题是,如果这真的是一个从topojson.mesh返回的网格,为什么要分隔行?这是由风水插件引起的吗?如果是这样的话,我怎么做呢?是否可以通过在维护拓扑的同时拖动节点来改变节点的位置?

我会附上下面的代码

代码语言:javascript
复制
<!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

代码语言:javascript
复制
 {
  "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
            ]
          ]
        ]
      }
    }
  ]
}
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-07-02 09:21:46

对于那些正在寻找这类问题的答案的人,我发现了一种使用OpenLayers v6.5.0的方法。它们是绘制和修改特征的一个例子,它可以维护线条和多边形的拓扑结构。

希望这对某人有帮助:)

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/68141878

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档