OpenLayers 5.3:为什么不画我的poligon?

时间:2018-11-22 14:30:34

标签: javascript openlayers

这是代码:

drawPoligon : function (vertices) {
    debugger;
    var map = peaMap;
    var feature = new ol.Feature({
        geometry: new ol.geom.Polygon([vertices])
    });

    var vectorSource= new ol.source.Vector({
        features: [feature ]
    });
    var vectorLayer = new ol.layer.Vector({
        source: vectorSource
    });
    map.addLayer(vectorLayer);

}
vertices = [1253906.08982072, 5430790.35506443, 1253935.16019819, 5430769.74133789, 1253951.90741865, 5430793.82802342, 1253955.42311216........]

我的坐标数组的格式:

[
  [1253906.08982072,5430790.35506443],
  [1253935.16019819,5430769.74133789],
  [1253951.90741865,5430793.82802342],
  [1253955.42311216,5430798.88815272],
  [1253953.91064413,5430800.28580152],
  [1253952.03520923,5430801.40886153],
  [1253945.88800332,5430791.50307534],
  [1253936.62615957,5430797.3914173]
]

...坐标列表不完整。仅其中一部分可以曝光。

1 个答案:

答案 0 :(得分:1)

格式[[lon,lat],…]是正确的格式。放大后,您可以看到结果:

var osmLayer = new ol.layer.Tile({
    source: new ol.source.OSM()
  });

  var vertices = [
    [1253906.08982072, 5430790.35506443],
    [1253935.16019819, 5430769.74133789],
    [1253951.90741865, 5430793.82802342],
    [1253955.42311216, 5430798.88815272],
    [1253953.91064413, 5430800.28580152],
    [1253952.03520923, 5430801.40886153],
    [1253945.88800332, 5430791.50307534],
    [1253936.62615957, 5430797.3914173]
  ];

  var feature = new ol.Feature({
    geometry: new ol.geom.Polygon([vertices])
  });

  var vectorSource = new ol.source.Vector({
    features: [feature]
  });
  var vectorLayer = new ol.layer.Vector({
    source: vectorSource,
    style: new ol.style.Style({
      stroke: new ol.style.Stroke({
        width: 2,
        color: [255, 0, 0]
      })
    })
  });

  var map = new ol.Map({
    layers: [osmLayer, vectorLayer],
    target: document.getElementById("map"),
    view: new ol.View({
      center: [1253950, 5430800],
      zoom: 20
    })
  });