传单:pointToLayer 的异步替代方案?

问题描述

现在，我有这样的事情:

Right now, I have something like:

this.Layer = Leaflet.geoJSON(geoJson, {
    pointToLayer: function (feature, latlng) {
        return Leaflet.marker(latlng, {
            icon: arrowIcon,
            rotationAngle: (<MyFeatureType>feature.properties).DirectionTo,
            title: (<MyFeatureType>feature.properties).Speed.toString()
            });
        }
   }

这有效.对于 GeoJSON 中的每个 Point 功能，我的函数都会被调用，然后我可以创建一个自定义标记.

This works. For each Point feature in the GeoJSON, my function gets called, and I get to create a custom marker.

然而，我想改变它，例如 pointToLayer 函数是异步的；类似:

However, I'd like to change it such as that the pointToLayer function is async; something like:

this.Layer = Leaflet.geoJSON(geoJson, {
    pointToLayer: async function (feature, latlng) {
        var data = await retrieveSomeMetadataForFeature(feature);

        return Leaflet.marker(latlng, {
            icon: data.Icon,
            rotationAngle: (<MyFeatureType>feature.properties).DirectionTo,
            title: (<MyFeatureType>feature.properties).Speed.toString()
            });
        }
   }

不幸的是，Leaflet 似乎不支持将 Promise 作为返回类型处理.

Unfortunately, Leaflet doesn't seem to support handling a Promise as a return type.

也不是，似乎我可以简单地返回 null 并手动添加标记，例如:

Nor, it seems, can I simply return null and add the marker manually, e.g.:

this.Layer = Leaflet.geoJSON(geoJson, {
    pointToLayer: async function (feature, latlng) {
        var data = await retrieveSomeMetadataForFeature(feature);

        var marker = Leaflet.marker(latlng, {
            icon: data.Icon,
            rotationAngle: (<MyFeatureType>feature.properties).DirectionTo,
            title: (<MyFeatureType>feature.properties).Speed.toString()
            });
        }

        // manually add marker to layer here

        return null; // simply tell Leaflet that this has been handled
   }

当标记出现时，Leaflet 不会第二次调用 pointToLayer.

While the marker appears, Leaflet never calls into pointToLayer a second time.

问题:

• 有没有办法调用 pointToLayer 并将结果异步返回给 Leaflet?(据推测，所做的只是将标记添加到正确的图层组?)
• 如果做不到这一点，我能否告诉 Leaflet 根本不要创建标记，并且已经处理了各种事件"?
• 或者，是否有替代 pointToLayer 的替代方法来覆盖标记创建?

• is there a way to call pointToLayer and return the result asynchronously to Leaflet? (Presumably, all that would accomplish is add the marker to the correct layer group?)
• failing that, can I somehow tell Leaflet not to create the marker at all, and that the "event" of sorts has been handled?
• or, is there an alternative to pointToLayer that overrides marker creation?

推荐答案

为每个点特征返回一个空的 LayerGroup，然后用任何 Marker 填充该 LayerGroup 你需要，例如

Return an empty LayerGroup per point feature, then later fill said LayerGroup with whatever Marker you need, e.g.

L.geoJSON(geoJson, {
    pointToLayer: function (feature, latlng) {
        var emptyGroup = L.layerGroup();

        retrieveSomeMetadataForFeature(feature).then(function(metadata){
            L.marker(icon: metadata.icon).addTo(emptyGroup);
        });

        return emptyGroup;
   }
});

这样，pointToLayer 回调将始终返回 L.Layer 的实例，正如 L.GeoJSON 所期望的那样.L.GeoJSON 实例将包含多个 L.LayerGroup 实例，每个实例包含一个 L.Marker 实例，但开销不应足够大，值得关注.

This way, the pointToLayer callback will always return an instance of L.Layer, as L.GeoJSON is expecting. The L.GeoJSON instance will contain several instances of L.LayerGroup, each containing an instance of L.Marker, but the overhead shouldn't be big enough to be a concern.

这篇关于传单:pointToLayer 的异步替代方案?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！