首页 > 解决方案 > 基础层更改后的 setDrawingOptions Leaflet Draw

问题描述

更改基础层后,我正在尝试更改多边形的颜色。我用过setDrawingOptions,但是没用。。。

当我在setDrawingOptions它更改之前和之后记录对象时。但我没有看到已经绘制的多边形的变化。当我绘制一个新多边形时,它会使用新颜色绘制。

我正在使用 Leaflet 0.7.x

map.on('baselayerchange', function(){
  map.drawControl.setDrawingOptions({
    polygon: {
      shapeOptions: {
        color: "#fff"
      }
    }
  });
});

事件被触发。并且没有控制台错误

标签: javascriptleafletleaflet.draw

解决方案


我想 drawControl 的创建方式如下:

var drawControl = new L.Control.Draw();

如果是,那么它不是地图对象的属性,在您的控制台中,您应该有如下错误:

"map.drawControl is undefined"

请尝试以下代码(我只删除了“drawControl”之前的“map.”部分)

map.on('baselayerchange', function(){
  drawControl.setDrawingOptions({
    polygon: {
      shapeOptions: {
        color: "#fff"
      }
    }
  });
});

编辑:现在你编辑了你的帖子,很清楚。您还希望已经绘制的多边形也改变颜色。您创建的多边形托管在 layerGroup 或 featureGroup 中,我们称之为“drawnItems”。所以你要做的很简单:

map.on('baselayerchange', function(){
  drawControl.setDrawingOptions({
    polygon: {
      shapeOptions: {
        color: "#fff"
      }
    }
  });

  drawnItems.setStyle({
    color:"#fff"
  })
});

这是一个有效的 jsfiddle: https ://jsfiddle.net/jt7wy4eg/2/ 当用户放大/缩小时应用更改(多边形变为红色,即使是绘制的多边形)。


推荐阅读