沿着线串特征的多个文本标签

Question

是否有可能在OpenLayers 3中创建一个文本标签，该标签沿线串特征克隆多次，具体取决于比例尺？喜欢的东西：

在这里你可以看到，当我们改变规模标签“九军团大道”出现两次。我们如何实现这一点？

Answer 1

您可以使用样式函数来实现此功能。我的代码示例的目的是使箭头线串（情况会稍有不同），但我有评论部分需要被改变（至少）：

var raster = new ol.layer.Tile({ 
    source: new ol.source.OSM() 
    }); 

var source = new ol.source.Vector(); 


var styleFunction = function(feature) { 
    var geometry = feature.getGeometry(); 
    var styles = [ 
     // linestring 
     new ol.style.Style({ 
     stroke: new ol.style.Stroke({ // apply street style here 
      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), 
     image: new ol.style.Icon({ // Use here label, not icon. 
      src: 'http://openlayers.org/en/v3.17.1/examples/data/arrow.png', 
      anchor: [0.75, 0.5], 
      rotateWithView: false, 
      rotation: -rotation 
     }) 
     })); 
    }); 

    return styles; 
    }; 

var vector = new ol.layer.Vector({ 
    source: source, 
    style: styleFunction 
}); 


    map.addInteraction(new ol.interaction.Draw({ 
    source: source, 
    type: /** @type {ol.geom.GeometryType} */ ('LineString') 
    })); 

需要一些更多的精力放在正确的展示位置标题。我这样离开了这个答案，为建立你的特性提供了一个坚实的起点。

我来源：

[1] http://openlayers.org/en/master/examples/line-arrows.html