有没有办法根据传单中的缩放级别调整标记图标的大小？ [英] is there a way to resize marker icons depending on zoom level in leaflet?

问题描述

我正在为学校制作一个项目，我需要根据传单地图中的缩放级别调整标记图标的大小，是否有一种简单的方法可以实现此目的？网上的任何教程？在此先感谢您的帮助！

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!!!

推荐答案

为了在放大/缩小时更改标记的大小，你需要处理这个事件。

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() { });

只要有$ code> zoomend 事件，地图已完成放大或缩小。请参阅API 此处。

The zoomend event will be called whenever the map has finished zooming in or out. See the API here.

现在，在此功能中，您可以调用自定义代码以更改标记的大小。例如，假设您想采用一种简单的方法，并将圆形标记的大小设置为等于地图缩放级别的大小。请参阅CircleMarker的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

// 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.

这篇关于有没有办法根据传单中的缩放级别调整标记图标的大小？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！