如何在 Leaflet 中添加 GeoJSON 点作为矢量切片？

Question

我已经阅读了 Stack Overflow 上我能找到的每个问题以及我在网络上可以找到的用于将 GeoJSON 矢量切片添加到传单地图的每个示例。不幸的是，我仍然无法理解它，更不用说让它在我的数据上工作了。

\n\n

我有一个包含很多点的 GeoJSON（此处）。我可以将它添加为 Leaflet 中的一个图层，因此我确信它是具有真实值的有效文件。

\n\n

我尝试过geojson-vt和传单矢量网格。

\n\n

geojson-vt 不断返回错误：
\n Uncaught ReferenceError: z is not defined at <anonymous>:1:30
\n使用以下代码：

\n\n

geoJson = {data}\nvar tileOptions = {\n    maxZoom: 18, \n    tolerance: 5, \n    extent: 4096,\n    buffer: 64, \n    debug: 0, \n    indexMaxZoom: 0, \n    indexMaxPoints: 100000, \n};\nvar tileIndex = geojsonvt(geoJson, tileOptions);\nvar tile = tileIndex.getTile(z, x, y);\n

\n\n

我在诊断这个问题时遇到了很多麻烦，因为我找到的示例都没有显示其数据，而且也没有引用定义 z、x 和 y，并且这些不是 GeoJSON 所需的值目的。我缺少什么？

\n\n

从我的另一个问题中我了解到 Leaflet 矢量网格的 GeoJSON 点有错误。我设法更改了一些源代码来解决最初的错误，但现在出现了 1,000 多个错误，例如：
\nError: <path> attribute d: Expected number, "MNaN,47.5aundefin\xe2\x80\xa6".

\n\n

从代码：
\nL.vectorGrid.slicer(geoJson).addTo(map)

\n\n

如何将 GeoJSON 点作为矢量切片图层添加到传单地图中？有没有人有一些简单的例子和​​数据作为参考？任何帮助或其他调查指示将不胜感激。

\n

Answer 1

我能够解决我遇到的问题Leaflet.VectorGrid.Slicer。

首先，我下载了源代码并更改了此处Leaflet.VectorGrid.js指示的行（请注意，这对应于VectorGrid github 站点上提供的源代码中的第 1483 到 1495 行）。

然后，在排除故障后，我发现如果我radius在调用时添加一个选项L.vectorGrid.slicer，GeoJSON 点就会添加到地图中。这是有效的代码：

var layer = L.vectorGrid.slicer(geoJson, { 
    vectorTileLayerStyles: {
        sliced: {
            radius: 1,
        }
    }
}).addTo(map);