【问题标题】:Leaflet Choropleth Map - switch to Leaflet 1.2Leaflet Choropleth Map - 切换到 Leaflet 1.2
【发布时间】:2017-12-06 20:54:12
【问题描述】:

我的地图有问题。我切换到 Leaflet 1.2,其中一项功能无法正常工作。 代码在这里:

http://mapaszlakow.eu/mapa1.2.html

当通过 js 激活作为 geojson 的叠加层并单击自行车路线时,它会放大到一条路线,但它没有突出显示,信息窗口也没有显示。 这是在旧版本 Leaflet 上运行的完全相同的示例(我认为它是 0.7)。

http://mapaszlakow.eu/

我找不到问题,我唯一做的就是切换到Leaflet 1.2,我将不胜感激。

编辑:我相信,问题出在此处:

    function select(layer) {
    info.update(layer.feature.properties);
    if (selected !== null) {
        var previous = selected;
    }
    map.fitBounds(layer.getBounds());
    selected = layer;
    if (previous) {
        dehighlight(previous);
    }
    }

    var selected = null;

【问题讨论】:

  • 我在您发表评论后编辑了我的答案,请查看,如果有帮助,请将答案标记为已接受.. ;)

标签: leaflet geojson interactive


【解决方案1】:

我已经从http://mapaszlakow.eu/mapa1.2.html 测试了您的代码,它几乎可以正常工作 - 悬停时它会正确突出显示路线,点击它会缩放到路线范围 - 除了显示弹出信息之外。要解决此问题,请查看我从您的代码中制作的小提琴:

http://jsfiddle.net/5z17y5oL/18/ (这个小提琴必须通过http访问,因为你的服务器不使用https提供数据)

主要区别在于我将参数传递给info.update(e.feature.properties); 出现次数。


编辑

我编辑的小提琴在这里:http://jsfiddle.net/5z17y5oL/25/

所以我移动了 info.update(e.feature.properties); 以从层单击侦听器中调用。在地图上单击的图层样式被重置,并且在接收到 null 时正在清除信息。

.....
onEachFeature: function(feature, layer) {
    layer.on({
      .....
      'click': function(e) {
        select(e.target);
        info.update(e.feature.properties);
      }
    });
    map.on({
      'click': function(e) {
        bicyclegeojson.resetStyle(layer);
        info.update(null);
        selected = null;
      }
    });
....

//编辑结束


还有一件事 - 你有一个小错误,你应该改变这一行:

map.addControl(layerControl).addTo(map);

map.addControl(layerControl);

【讨论】:

  • 出色的工作,但有一件事不起作用:) 当您单击路线并突出显示,然后单击地图时,它应该取消突出显示。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2020-01-04
  • 2020-01-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-02-20
相关资源
最近更新 更多