Question

在传单中，我可以使用以下脚本来可视化geojson图层；

L.geoJSON('district.json', {
    style: myStyle,
    onEachFeature: function(feature, layer) {
       layer.bindPopup(feature.properties.name);     
  }
}).addTo(map);

上面的代码显示了地图上的特征，并且还显示了单击地图上的name属性。但是我想要的是不同的。我想在地图上隐藏district.json的功能，但是当我单击feature位置时，它应该显示为弹出内容。我尝试过以下风格；

var myStyle = {
  fillColor: rgb(0,0,0,0),
  opacity: 0,
  strokeOpacity: 0,
}

这将隐藏图层，但是当我单击地图时，不会弹出任何内容。此条件有可能的样式吗？

Answer 1

您可以使用圆形标记，如下所示：

L.geoJSON('district.json', {
    pointToLayer: function (feature, latlng) {
        return L.circleMarker(latlng, {color: 'transparent', fillColor: 'transparent', radius: 20});
    },
    onEachFeature: function(feature, layer) {
       layer.bindPopup(feature.properties.name);     
    }
}).addTo(map);

这样，您可以为每个要素添加一个透明的，不可见的圆圈标记。您还可以尝试使用不同的 radius 值，这些值会导致可点击区域变大或变小。

Answer 2

您可以简单地将不透明度的值更改为0.01，以便该图层从地图上消失，但仍然保留弹出内容。为此，请按照以下方式更改myStyle变量；

var myStyle = {
  fillColor: rgb(0,0,0,0.01),
  opacity: 0.01,
  strokeOpacity: 0.01,
}

有没有可能显示传单中没有功能的geojson属性的方法？

2 个答案: