如何在 Leaflet 中将 GeoJSON 点添加为矢量图块?

How to add GeoJSON points as a vector tile in Leaflet?

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

我有一个包含很多点的 GeoJSON (here)。我可以将它添加为 Leaflet 中的一层,所以我确信它是一个具有真实值的有效文件。

我试过了geojson-vt and leaflet vector grid

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

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

我在诊断这个问题时遇到了很多麻烦,因为 none 我发现的示例已经显示了它们的数据,而且 none 还引用了定义 z、x 和 y,这些不是 GeoJSON 对象的必需值。我错过了什么?

我了解到Leaflet矢量网格在GeoJSON点上有错误。我设法更改了一些源代码以解决初始错误,但现在出现了 1,000 多个错误,例如:
Error: <path> attribute d: Expected number, "MNaN,47.5aundefin…".

来自代码:
L.vectorGrid.slicer(geoJson).addTo(map)

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

我已经看了几分钟,我得出的结论是 Leaflet.VectorGrid 中存在影响切片点的错误。 I've opened a bug report with relevant information.

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

首先我下载了​​ Leaflet.VectorGrid.js 源代码并更改了指示的行 here (note that that corresponds to lines 1483 to 1495 from the source code available on the VectorGrid github site)。

然后,经过排查,我发现如果我在调用L.vectorGrid.slicer时添加了一个radius选项,GeoJSON点被添加到地图中。这是有效的代码:

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