Openlayers3 - 如何將文本標籤錨定到某個點上？

Question

我正在使用Openlayers3的應用程序。在地圖上有幾個線段和文本標籤。每一行都有一個顏色和一個關聯的標籤。

對於地圖，我希望將文本標籤錨定在地圖上繪製的線段點上。所以，如果我移動地圖或放大或縮小，標籤就會貼在這一點上。但是，如果我放大或縮小標籤移動（很多）。拖動地圖不會產生這種效果。不知何故，我希望他們堅持在線上的一點，而不是四處走動。

有沒有人有一些聰明的建議或鏈接在哪裏看？谷歌搜索像'錨'或'固定點'的條款，嘗試一些建議並沒有解決我的問題。任何幫助將非常感謝！

Answer 1

也許你可以用「箭頭」的例子來inspered至極使用使用幾何段樣式功能：

http://jsfiddle.net/davidhequet/7asg74Lc/

var styleFunction = function(feature, resolution) { 
    var geometry = feature.getGeometry(); 
    var styles = [ 
    // linestring 
    new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
     color: '#ffcc33', 
     width: 2 
     }) 
    }) 
    ]; 

    geometry.forEachSegment(function(start, end) { 
    var dx = end[0] - start[0]; 
    var dy = end[1] - start[1]; 
    var rotation = Math.atan2(dy, dx); 
    // arrows 
    styles.push(new ol.style.Style({ 
     geometry: new ol.geom.Point(end), 
     text: new ol.style.Text({ 
      textAlign: 'left', 
      textBaseline: 'bottom', 
      font: 'Arial', 
      text: 'test text', 
      fill: new ol.style.Fill({color: 'red'}), 
      stroke: new ol.style.Stroke({color: 'white', width: '2'}), 
      offsetX: 0, 
      offsetY: 0, 
      rotation: 0 
      }) 
    })); 
    }); 

    return styles; 
};