使用leaflet.js对国家/地区的地图其余部分进行暗淡/隐藏 [英] Dim/Hide rest of map around country with leaflet.js

问题描述

是否可以在标准leaflet.js地图上使世界其他地区"(除了一个国家)暗淡或隐藏?马比(Mabye)覆盖着具有国家轮廓的某种倒多边形"吗?任何代码示例或链接都将不胜感激.

Is it possible to dim or hide the "rest of the world" except one country on a standard leaflet.js map? Mabye overlay out with some kind of "inverted polygon" with the contours of the country? Any code examples or links would be appreciated.

推荐答案

扩展@tmcw的答案...

Expanding @tmcw's answer ...

秘密在于使用 http://leafletjs.com/reference.html#polygon

您还可以通过传递数组来创建带有孔的多边形 的latlngs，第一个latlngs数组代表外部 响，而其余的代表内部的孔.

You can also create a polygon with holes by passing an array of arrays of latlngs, with the first latlngs array representing the exterior ring while the remaining represent the holes inside.

第一个多边形将是与地图本身一样大的矩形，孔将是您要突出显示的国家/地区.

The first polygon will be a rectangle as big as the map itself, the hole will be the country you want to highlight.

L.polygon( [outerBoundsLatLngs, latLngs] ); 

这是一个有效的示例: http://jsfiddle.net/FranceImage/1yaqtx9u/

Here is a working example: http://jsfiddle.net/FranceImage/1yaqtx9u/

这篇关于使用leaflet.js对国家/地区的地图其余部分进行暗淡/隐藏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！