在openlayers.js中，有沒有辦法在繪製該圓時顯示圓的半徑？

Question

我希望能夠在地圖上繪製一個圓，並在繪製圓時將圓的半徑顯示在圓上或其他位置。我想讓它在我畫圓的時候改變，所以我可以看到這個半徑。任何方式在openlayers中做到這一點？

Answer 1

的一種方法是創建一個MapToolTip

我製成一個圍繞跟隨鼠標在偏離設定位置。基本上它是一個絕對位置風格的div，在mousemove上更新。

我的代碼：

var MyAPP = MyAPP || {}; 

MyAPP.MapToolTip = function (position, text) { 

    var content = '<div id="tool_tip" class="dropSheet ui-corner-all"><span id="info_window_text">' + text + '</span></div>'; 

    var toolTip = $(content).hide().appendTo('div#wrapper div#content_wrapper'); 
    toolTip.IsVisible = false; 

    var mouseMove = function (e) { 

     if (toolTip.IsVisible) { 
      toolTip.fadeIn() 
     } 
     toolTip.css('top', e.clientY + 30); 
     toolTip.css('left', e.clientX + 30); 
     toolTip.IsVisible = true; 
    }; 

    this.Destroy = function() { 
     MyAPP.UI.Map.getMap().events.unregister("mousemove", MyAPP.UI.Map.getMap(), mouseMove); 
     toolTip.IsVisible = null; 
     toolTip.fadeOut(); 
     toolTip.remove(); 
     content = null; 
     toolTip = null; 
     mouseMove = null; 
    }; 

    MyAPP.UI.Map.getMap().events.register("mousemove", MyAPP.UI.Map.getMap(), mouseMove); 

    return; 

}; 

.dropSheet { 
    background-color: #000000; 
    background-image: none; 
    opacity: 0.6; 
} 
div#info_window { 
    color: White; 
    font-family: Verdana,Arial; 
    font-size: 0.6em; 
    left: 490px; 
    padding: 6px; 
    position: absolute; 
    top: 100px; 
    width: 220px; 
    z-index: 99; 
}