Mapbox js：根據屬性更改多段線的不同緯度

Question

我有一個對象數組，每個對象都包含座標和不同的屬性。現在我想繪製地圖上那些根據對象屬性更改顏色的latlng對象的多段線。但是因爲我可以發現多段線只有一個顏色對象。所以我不能爲多段線上的不同點定義不同的顏色。 這是可能的嗎？我找不到任何類似的谷歌地圖或這裏的API ..

非常感謝！

Answer 1

您是正確的，當使用HERE API時，Polyline 只能有一種顏色。解決方法可能是繪製幾行，每行都有自己的顏色。讓我們試試這個。

以下示例使用經緯度和顏色信息的數組，並使用它來繪製一系列線條。通過將所有行添加到Group，我們可以像處理單個對象一樣處理它們。

var matrix = [ 
    [new H.geo.Point(41.759876, 12.942710), 'red'], 
    [new H.geo.Point(41.768711, 12.947602), 'orange'], 
    [new H.geo.Point(41.772936, 12.956271), 'yellow'], 
    [new H.geo.Point(41.773704, 12.964082), 'green'], 
    [new H.geo.Point(41.770824, 12.975497), 'blue'], 
    [new H.geo.Point(41.764230, 12.980647), 'indigo'], 
    [new H.geo.Point(41.758596, 12.982965), 'violet'] 
]; 

var rainbowGroup = new H.map.Group(); 

function drawRainbow(map) { 
    map.addObject(rainbowGroup); 
    for (var i = 0, len = matrix.length-1; i < len; i++) { 
    addRainbowSegment(matrix[i], matrix[i+1], map); 
    } 
} 

function addRainbowSegment(point, nextPoint, map) { 
    var strip = new H.geo.Strip(); 
    strip.pushPoint(point[0]); 
    strip.pushPoint(nextPoint[0]); 
    rainbowGroup.addObject(new H.map.Polyline(
    strip, { style: { lineWidth: 20, strokeColor: point[1] }} 
)); 
} 

最終結果應該看起來像一條連續的線條，其中每個線段具有不同的顏色。事情是這樣的：

看！一個彩虹！ （獨角獸單獨出售。）