OpenLayers 3功能已连接

OpenLayers 3 Features Connected

本文关键字：连接 功能 OpenLayers      更新时间：2024-05-08

我正试图在地图上画一些圆圈。我将圆创建为特征，然后将它们放置在图层中。我遇到的问题是，有一条线连接着每个不同的功能。是什么导致功能连接？

// Generate some rings
var radius = [1000, 2000];
var features = [];
for(var i = 0; i < radius.length; i++)
{
    features[i] = new ol.Feature( new ol.geom.Circle(center, radius[i] / ol.proj.METERS_PER_UNIT.m ) );
}
// Add features to new layer.
var layer = new ol.layer.Vector({
    source: new ol.source.Vector({
        features: features
    }),
    style: new ol.style.Style({
        stroke: new ol.style.Stroke({
            width: 1,
            color: [0, 0, 255, 1]
        })
    })
});
map.addLayer(layer);

编辑：这是我得到的一张截图https://i.stack.imgur.com/T28Zj.png

您的代码对我来说很好，尽管我必须定义一个初始中心，我把它放在[0,0]，以匹配我为地图定义的视图。我还加了一些ol。地图代码（你的Q中没有提供这一位，所以可能有问题？）

我使用了这个HTML:

<div id="map" style="width: 100%; height: 500px"></div>

和这个JavaScript:

var center = [0, 0];
var radius = [1000, 2000, 3000, 4000];
var features = [];
for(var i = 0; i < radius.length; i++)
{
    features[i] = new ol.Feature( new ol.geom.Circle(center, radius[i] / ol.proj.METERS_PER_UNIT.m ) );
}
// Add features to new layer.
var layer = new ol.layer.Vector({
    source: new ol.source.Vector({
        features: features
    }),
    style: new ol.style.Style({
        stroke: new ol.style.Stroke({
            width: 1,
            color: [0, 0, 255, 1]
        })
    })
});
var map = new ol.Map({
    layers: [
        new ol.layer.Tile({
            source: new ol.source.OSM()
        }),
        layer
    ],
    target: 'map',
    view: new ol.View({
        center: [0, 0],
        zoom: 10
    })
});

连接圆的原因是openlayers中的一个错误。更新到最新版本更正了此问题。

相关文章：