OpenLayers 3 Features Connected

Question

Я пытаюсь нарисовать несколько кругов на карте. Я создаю круги как функции, а затем помещаю их в слой. Проблема, с которой я сталкиваюсь, заключается в том, что есть линия, соединяющая каждую из различных функций. Что вызывает связь с функциями?

// 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); 

Edit: Вот скриншот того, что я получаю http://i.imgur.com/jV19gTJ.png

Answer 1

Причина подключенных кругов - ошибка в открытых слоях. Обновление последней версии исправило проблему.

Answer 2

Ваш код работал хорошо для меня, хотя я должен определить начальный центр, который я наношу в [0,0], чтобы соответствуют представлению, определенному для карты. Я также добавил некоторый ol.Map кода (вы не предоставили этот бит в вашей 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 
    }) 
});