大家好, 小弟找到一個leafletjs plugin 的addition plugin,
http://hgoebl.github.io/Leaflet.MultiOptionsPolyline/demo/
是用來把Polyline 加上不同顏色, 我已經看過sample code, 裡面只有幾個方法來拿Optionidx, 但如果我是要從自己的API的數據的intensity key 來做判斷, 好像就沒有說過怎樣用custom property 來做, 看了好久都沒找到, 希望大家可以給點提示.

另外一個是leaflet.motion
https://github.com/Igor-Vladyka/leaflet.motion

我不太知道怎樣可以在map 上面加上按鈕來控制個別line 的animation, 現在只是全部同一時間一起animate.

$.each(typhobj, function(key, coorArr) {
tempArr = [];
tempArr.push(coorArr);

        var randomColor = "#" + Math.floor(Math.random()*16777215).toString(16);

        //polyline = new L.polyline(tempArr, {color: randomColor}).addTo(map);
        polyline = L.motion.polyline(tempArr, {color: randomColor},{
            auto: false,
            duration: 100000,
            easing: L.Motion.Ease.easeInOutQuart
        }).addTo(map);

        if( !(key in polylineGroup) ) {
            polylineGroup[key] = polyline;
        }

        //polyline.motionStart();

        $.each(coorArr, function(key1,val){
            //console.log(val);
            var curArr = typhExtraobj[key][key1];
            L.circleMarker(val, {
                color: randomColor, fillColor: randomColor,radius: 3
            }).bindTooltip("<strong>Coordinate:</strong> " + val[0]+","+val[1] + "<br><strong>File Type: </strong>" + curArr["file_type"] + "<br><strong>Intensity: </strong>" + curArr["intensity"]+ "<br><strong> Forecast time: </strong>" + curArr["forecast_time"]+ "<br><strong> Mean Sea Level Pressure: </strong>" + curArr["mean_sea_level_pressure"]).addTo(map);
        });
        map.fitBounds(polyline.getBounds());

    });

    console.log(polylineGroup["G2021110"]);
    polylineGroup["G2021110"].motionStart();

試過將所有的polyline 都放到一個array, 但call motionStart的時候都沒作用

在github 那裡提到了這個
L.motion.*
Public methods in all motion objects:

motionStart() // to start motion.
但如果我要個別的polyline自己animate, 要怎樣呢...

謝謝幫忙