如何获取OpenLayers中绘制框的坐标？

我是OpenLayers的新手，很抱歉有一个明显的（也许是愚蠢的）问题，为此我找到了解决方案的不同方法，但都没有成功。尝试了这一点，并有十几种不同的建议（here,here,here,here,here）但徒劳无功。如何获取OpenLayers中绘制框的坐标？

基本上，我想将绘制的矩形的坐标传递给另一个webservice。所以，绘制矩形之后，它应该将我吐出边框的四个角。

我至今是绘制矩形的基本OL层例如：

var source = new ol.source.Vector({wrapX: false}); 


    vector = new ol.layer.Vector({ 
     source: source, 
     style: new ol.style.Style({ 
      fill: new ol.style.Fill({ 
       color: 'rgba(0, 255, 0, 0.5)' 
      }), 
      stroke: new ol.style.Stroke({ 
       color: '#ffcc33', 
       width: 2 
      }), 
      image: new ol.style.Circle({ 
       radius: 7, 
       fill: new ol.style.Fill({ 
       color: '#ffcc33' 
       }) 
      }) 
     })  
    }); 



    var map = new ol.Map({ 
     target: 'map', 
     layers: [ 
      new ol.layer.Tile({ 
       source: new ol.source.OSM() 
      }), 
      vector 
     ], 
     view: new ol.View({ 
      center: ol.proj.fromLonLat([37.41, 8.82]), 
      zoom: 4 
     }) 
    }); 



    var draw; // global so we can remove it later 
    function addInteraction() 
    { 
     var value = 'Box'; 

     if (value !== 'None') 
     { 
      var geometryFunction, maxPoints; 
      if (value === 'Square') 
      { 
       value = 'Circle'; 
       geometryFunction = ol.interaction.Draw.createRegularPolygon(4); 
      } 
      else if (value === 'Box') 
      { 
       value = 'LineString'; 
       maxPoints = 2; 
       geometryFunction = function(coordinates, geometry) 
       { 
        if (!geometry) 
        { 
         geometry = new ol.geom.Polygon(null); 
        } 
        var start = coordinates[0]; 
        var end = coordinates[1]; 
        geometry.setCoordinates([ 
        [start, [start[0], end[1]], end, [end[0], start[1]], start] 
        ]); 
        return geometry; 
       }; 
      } 

      draw = new ol.interaction.Draw({ 
       source: source, 
       type: /** @type {ol.geom.GeometryType} */ (value), 
       geometryFunction: geometryFunction, 
       maxPoints: maxPoints    
      }); 

      map.addInteraction(draw);    
     } 
    } 


    addInteraction();

现在，下一步怎么走？提取边界框的好方法是什么？

感谢您的任何提示！

来源

2016-08-02 luftikus143

您需要为侦听交互设置侦听器。像这样：

draw.on('drawend',function(e){ 
alert(e.feature.getGeometry().getExtent()); 
});

这里是一个fiddle

来源

2016-08-02 06:59:04 pavlos

伟大啊！非常感谢。然而，有趣的是，小提琴在Safari浏览器中工作，但没有在我的身边执行 - 另一方面在火狐浏览器和Chrome（所有Mac）上都可以工作... – luftikus143

这是一个官方的ol3示例（http：// openlayers。 org/en/latest/examples/draw-features.html），我刚刚添加了监听器。它真的很奇怪，它不适用于safari。我没有safari，所以我无法测试它。乐意效劳 – pavlos

如何获取OpenLayers中绘制框的坐标？

回答

相关问题