Как интерактивно Нарисовать круг в openlayers-3

Question

Я познакомился в fuctionality, который присутствовал в openlayers-2, но отсутствовал на данный момент в третьей партии - интерактивный круговой рисунок.

Как вы можете видеть в примере здесь: http://openlayers.org/en/v3.0.0/examples/draw-and-modify-features.html

Там нет доступны опции для Круга. Несмотря на то, что в комментарии говорится, что там должно быть доступно все @type {ol.geom.GeometryType}, работа над кругом dowsen't. Пробовал это сам с помощью этого фрагмента кода:

function addInteraction(type) { 
    draw = new ol.interaction.Draw({ 
     features: featureOverlay.getFeatures(), 
     type: /** @type {ol.geom.GeometryType} */ 'Circle' 
    }); 
    map.addInteraction(draw); 
} 

Есть ли какие-либо нативные \ patch \ hack solutions?

Answer 1

У меня была почти такая же проблема. Вопрос в том, хотите ли вы добавить только круг для определения стиля или вам нужен его как многоугольник? Когда вы пытаетесь достичь многоугольника, вы можете легко использовать круговую функцию Poylgon.based. Как вы можете видеть в исходном коде ниже, вам нужна только сфера. Например, ol.sphere.WGS84. Центральная точка и радиус. Опциональный ввод определяет количество точек. которые используются для определения круга.

ol.geom.Polygon.circular = function(sphere, center, radius, opt_n) { 
var n = goog.isDef(opt_n) ? opt_n : 32; 
    /** @type {Array.<number>} */ 
    var flatCoordinates = []; 
    var i; 
    for (i = 0; i < n; ++i) { 
    goog.array.extend(
     flatCoordinates, sphere.offset(center, radius, 2 * Math.PI * i/n)); 
    } 
    flatCoordinates.push(flatCoordinates[0], flatCoordinates[1]); 
    var polygon = new ol.geom.Polygon(null); 
    polygon.setFlatCoordinates(
     ol.geom.GeometryLayout.XY, flatCoordinates, [flatCoordinates.length]); 
    return polygon; 
}; 

Это даже Api Stable, поэтому вы можете получить к нему доступ извне. В моем случае я создал собственный элемент управления, который расширил функцию рисования. Надеюсь, я смог тебе помочь.

Answer 2

Эта функция была добавлена ​​в версии 3.5.0, с примером здесь: http://openlayers.org/en/v3.5.0/examples/draw-features.html

Он работает так же, как вы уже догадались, что это

draw = new ol.interaction.Draw({ 
    features: featureOverlay.getFeatures(), 
    type: 'Circle' 
}); 
map.addInteraction(draw);