Leaflet JS-在特定缩放级别将esri形状更改为标记 [英] Leaflet JS - changing esri shape into marker on certain zoom level

查看:199
本文介绍了Leaflet JS-在特定缩放级别将esri形状更改为标记的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在将 leaflet.shapefile 插件与

I'm using leaflet.shapefile plugin with Leaflet JS, and I'm trying to change the esri shape/polygon into normal marker icons depending on a certain zoom level

该插件允许我将zip文件上传到我们的网络服务器上,然后由插件进行处理,并作为一个图层添加到Leaflet JS中

The plugin allows me to upload a zipfile onto our webserver, which then is processed by the plugin and added as a layer into Leaflet JS

var properties = new L.Shapefile('data/Test.zip', { style: propertyStyle, onEachFeature: propertyOnEachFeature })

我要实现的目标:当用户放大多边形时可以看到,但是当用户缩放到10级以上时,它应该显示标记,因为esri形状/多边形很小并且几乎不可见

What I would like to achieve: when the user zoomed in the polygon shape is visible, however when the user zooms above zoomlevel 10, it should display a marker instead, as the esri shape/polygons are very small and nearly not visible.

放大和缩小部分很容易完成:

The zooming in and out part was easily done with:

map.on('zoomend', function() {
    if (map.getZoom() <10){
        if (map.hasLayer(properties)) {
            map.removeLayer(properties);
        } else {
            console.log("no property layer active");
        }
    }
    if (map.getZoom() >= 10){
        if (map.hasLayer(properties)){
            console.log("property layer already added");
        } else {
            map.addLayer(properties);
        }
    }
}

但是我不知道如何将L.ShapeFile更改为L.Marker或正确的方法.
感谢您的帮助和建议.

However I dont know how to change the L.ShapeFile to a L.Marker or what the right approach would be.
Thanks for the help and advice.

更新

"IvanSanchez"提供给我的答案正是我想要的. 有了这个简单的插件' Leaflet.Deflate ',我能够简单地转换任何形状的多边形,在标记上画圈或画线,只需要包含插件js和一个衬板即可.

The answer 'IvanSanchez' provided me was exactly what i was looking for. With this a simple plugin 'Leaflet.Deflate' I was able to simply convert any shape, polygon, circle or line to a marker and all it took was to include the plugin js and a one liner:

L.Deflate({minSize: 20}).addTo(map);

推荐答案

请参见 Leaflet.Deflate插件.

这篇关于Leaflet JS-在特定缩放级别将esri形状更改为标记的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆