Openlayers 3.19.0似乎需要笔画样式才能正确渲染多边形

时间:2016-10-28 13:14:44

标签: javascript openlayers-3

创建ol.layer.Vector的ol.style.Style参数时,是正确渲染MultiPolygon所需的笔划吗?

这是取自here的示例代码的修改版本。注释掉stroke参数时,多边形将呈现为三边形多边形。取消注释stroke参数时,多边形将正确呈现为4边多边形。 This是一个小例子。下面的代码假设有一个html <div>元素,其id为“map”。

var styleFunction = (function() {
  var styles = {};
  styles['MultiPolygon'] = new ol.style.Style({
    /*stroke: new ol.style.Stroke({
      color: 'rgba(255, 255, 0, 1)',
      width: 1
    }),*/
    fill: new ol.style.Fill({
      color: 'rgba(255, 255, 0, 0.3)'
    })
  });
  return function(feature) {
    return styles[feature.getGeometry().getType()] || styles['default'];
  };
})();

var geojsonObject = {
  'type': 'FeatureCollection',
  'crs': {
    'type': 'name',
    'properties': {
      'name': 'EPSG:3857'
    }
  },
  'features': [{
    'type': 'Feature',
    'geometry': {
      'type': 'MultiPolygon',
      'coordinates': [[[[841605, 6482619], [841599, 6482618], [841598, 6482623], [841600, 6482624]]]]
    }
  }]
};

var source = new ol.source.Vector({
  features: (new ol.format.GeoJSON()).readFeatures(geojsonObject)
});

var layer = new ol.layer.Vector({
  source: source,
  style: styleFunction
});

var map = new ol.Map({
  layers: [layer],
  target: 'map',
  view: new ol.View({
    center: [841599.9364198849, 6482619.123901887],
    zoom: 21
  })
});

1 个答案:

答案 0 :(得分:0)

这不是错误。上面代码段中的坐标无效。根据{{​​3}},"The first and last positions are equivalent, and they MUST contain identical values;"。对于上面的代码片段,正确的坐标数组将是

'coordinates': [[[[841605, 6482619], [841599, 6482618], [841598, 6482623], [841600, 6482624], [841605, 6482619]]]]