当缩放级别改变时,如何在地图上调整SVG图像的大小?

时间:2015-04-24 22:57:36

标签: javascript css d3.js leaflet

我使用传单允许用户在地图上绘制自定义SVG路径(多边形)。问题是当用户缩小时,多边形变得太大并且遮挡了地图的其余部分。

我在线查看了示例,我遇到的资源使用了d3.geo库中的地理函数。在我的用例中,我在地图上使用d3,leaflet和SVG图层。

是否有可以应用于正确调整对象大小的公式?我知道我将需要应用一个基于宽度高度和当前缩放级别的平移功能,但我想知道是否有标准方法可以做到这一点?

编辑:这是我找到的一个资源,但它使用了d3地理功能,而且从我可以收集的内容来看,每次重置地图视图时它似乎都会重绘多边形(这可能效率低下(?)

http://www.d3noob.org/2014/03/leafletjs-map-with-d3js-objects-that.html

1 个答案:

答案 0 :(得分:1)

只需应用CSS来更改SVG的大小,或者只使用JS修改SVG,或者每次触发滚动事件时使用SVG修改SVG。

Google地图在其api中有一个事件,当缩放级别发生变化时会触发该事件。 https://developers.google.com/maps/documentation/javascript/events#EventProperties