javascript 有没有办法根据传单中的缩放级别调整标记图标的大小？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17382012/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
is there a way to resize marker icons depending on zoom level in leaflet?
提问by cglmdq
I'm making a project for the school and I need to resize the marker icons depending on zoom level in a leaflet map, Is there an easy way to accomplish this? Any tutorial on the web? Thanks in advance for the help!!!
我正在为学校制作一个项目，我需要根据传单地图中的缩放级别调整标记图标的大小，有没有一种简单的方法来实现这一点？网上有教程吗？在此先感谢您的帮助！！！
回答by Patrick D
In order to change the size of the markers when you zoom in/out, you'll need to handle the event.
为了在放大/缩小时更改标记的大小，您需要处理该事件。
map.on('zoomend', function() { });
The zoomendevent will be called whenever the map has finished zooming in or out. See the API here.
zoomend每当地图完成放大或缩小时，都会调用该事件。请参阅此处的 API 。
Now, inside this function, you can call your custom code in order to change the size of the markers. For example, let's say you wanted to take a simple approach and set the size of a circle marker equal to the size of the maps zoom level. See the API for a CircleMarker here
现在，在此函数中，您可以调用自定义代码以更改标记的大小。例如，假设您想采用一种简单的方法并将圆形标记的大小设置为等于地图缩放级别的大小。在此处查看 CircleMarker 的 API
// Create some marker that will be resized on the map zooming
var myMarker = new L.CircleMarker([10,10], { /* Options */ });
map.on('zoomend', function() {
var currentZoom = map.getZoom();
myMarker.setRadius(currentZoom);
});
Now whenever the map zooms in or out, the size of the marker will change.
现在每当地图放大或缩小时，标记的大小都会改变。
回答by juliabulia245
I'm not sure what Stophace is referring to regarding circleMarkers not changing size, but, adding to the approved answer... if you want to resize circleMakers or change any other styling options (I find it helpful to change the weight along with radius), you can use the following approach:
我不确定 Stophace 指的是关于 circleMarkers 不改变大小的内容，但是，添加到批准的答案中... )，您可以使用以下方法：
map.on('zoomend', function() {
var currentZoom = map.getZoom();
var myRadius = currentZoom*(1/2); //or whatever ratio you prefer
var myWeight = currentZoom*(1/5); //or whatever ratio you prefer
layername.setStyle({radius: myRadius, weight: setWeight});
});
layernamewill be replaced with the name of whatever layer you have which contains circleMarkers... and of course you can change the fractions to your liking to suit your needs.
layername将被替换为您拥有的任何包含 circleMarkers 的图层的名称……当然，您可以根据自己的喜好更改分数以满足您的需要。
I'm guessing the OP's school project is finished, but I hope this helps others who have the same question!
我猜 OP 的学校项目已经完成，但我希望这可以帮助其他有同样问题的人！
