Javascript 如何在绘制第二个多边形后删除多边形_Javascript_Openlayers_Openlayers 3

Javascript 如何在绘制第二个多边形后删除多边形

javascript openlayers openlayers-3

Javascript 如何在绘制第二个多边形后删除多边形,javascript,openlayers,openlayers-3,Javascript,Openlayers,Openlayers 3,我发现了一个绘制多边形的函数，但我在绘制第二个多边形时需要它，它将始终删除前一个多边形，因为我的地图上必须始终有一个多边形 <!DOCTYPE html> <html> <head> <title>Draw Features</title> <link rel="stylesheet" href="https://openlayers.org/en/v4.6.4/css/ol.css" type="text/c

我发现了一个绘制多边形的函数，但我在绘制第二个多边形时需要它，它将始终删除前一个多边形，因为我的地图上必须始终有一个多边形

<!DOCTYPE html>
<html>
  <head>
    <title>Draw Features</title>
    <link rel="stylesheet" href="https://openlayers.org/en/v4.6.4/css/ol.css" type="text/css">
    <!-- The line below is only needed for old environments like Internet Explorer and Android 4.x -->
    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>
    <script src="https://openlayers.org/en/v4.6.4/build/ol.js"></script>
  </head>
  <body>
<div id="map" class="map"></div>
<form class="form-inline">
  <label>Geometry type &nbsp;</label>
  <select id="type">
    <option value="Box">Box</option>
    <option value="None">None</option>
  </select>
</form>

其中包含所有html和javascript代码

在绘图交互上使用drawstart事件。 drawstart时使用clear作为源。您可以通过图层源访问地图上的要素。通过你的例子，你的特征包含在变量向量中。而且，正如您刚才看到的代码一样，这里有drawend事件对draw交互，您可以猜到还有drawstart事件

您希望在开始绘制时不显示任何特征，以便在开始绘制时清除源上的所有特征

我试过你的小提琴；它不画任何多边形。发布代码的工作示例，演示问题所在。另外，使用调试器一步完成代码。如果仍然找不到问题，请回到这里，讨论调试结果，以及运行和演示问题的代码示例。因为代码太大，我发送了包含所有html和javascript代码的链接，如我前面所说，使用调试器一步完成代码。如果仍然找不到问题，请回到这里讨论调试结果。在我的示例中，没有错误，如果您阅读，我的问题是，如果我绘制下一个多边形、直线、点，我想删除渲染层。如果您阅读，StackOverflow的工作原理如下。在你试着自己处理某件事之前，你不会来这里寻求帮助。然后，当你来寻求帮助时，你必须展示你已经尝试过的东西，并且你必须讨论为什么你的尝试不起作用。如中所示，您从调试器中发现的。是的，但是使用此代码，我无法通过alerte.feature.getGeometry.getExtent获取鼠标坐标；您可能希望使用e.feature.getGeometry.getCoordinates代替e.feature.getGeometry.getExtent。

// just like `drawend`
draw.on('drawstart', function(e) {

});

// map.getLayers().getArray()[1] is your vector layer
draw.on('drawstart', function(e) {
  map.getLayers().getArray()[1].getSource().clear();
});