的OpenLayers 3：多行

Question

畫箭頭，我想知道是否有可能在MULTILINESTRING

我的目標畫一個箭頭圖標是顯示多用的多的每一行的箭頭。

我在網上看到了一些例子，但那些例子總是隻有一行。

你知道是否可以用multiLineString做它嗎？

Answer 1

是的，這是可能的。

var styleFunction = function(feature) { 
    var geometry = feature.getGeometry(); 

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

var lineStringsArray = geometry.getLineStrings(); 
for(var i=0;i<lineStringsArray.length;i++){ 

    lineStringsArray[i].forEachSegment(function(start, end) { 
    var dx = end[0] - start[0]; 
    var dy = end[1] - start[1]; 
    var rotation = Math.atan2(dy, dx); 
    styles.push(new ol.style.Style({ 
     geometry: new ol.geom.Point(end), 
     image: new ol.style.Icon({ 
     src: 'https://openlayers.org/en/v3.19.1/examples/data/arrow.png', 
     rotateWithView: false, 
     rotation: -rotation 
     }) 
    })); 
    }); 
} 

    return styles; 
}; 

看一看演示鏈接 https://plnkr.co/edit/UM7bD8Pq55PjWQ6EHmTl?p=preview