D3 aimate Листовая полилиния

Question

Я пытаюсь использовать анимацию Polyline с помощью D3. Но это не сработало. Вот то, что я пробовал:

function drawPolyline(x1,y1,x2,y2, tooltip) 
    { 
     var arr = []; 
     arr.push(map.unproject([x1 , y1])); 
     arr.push(map.unproject([x2 , y2])); 
     var options ={color: 'green', weight: 3,opacity: 0.5, smoothFactor: 1 }; 
     var polyline = new L.Polyline(arr, options); 
     polyline.addTo(map); 
     var label = new L.Label({offset: [-20, -20]}); 
     label.setContent(tooltip); 
     label.setLatLng(polyline.getBounds().getCenter()); 
     map.showLabel(label); 
     d3.select(polyline).transition() 
    .duration(350) 
    .attr({stroke: "rgb(0, 41, 255)" , fill: "rgb(0, 41, 255)"}) 
    } 

Answer 1

Вы используете d3.select на экземпляре L.Polyline, что не будет работать. Это не элемент пути SVG. Фактический элемент пути хранится в вашем L.Polyline экземпляре как свойство-член _path. Попробуйте следующее:

d3.select(polyline._path).transition().duration(350).attr('stroke', 'rgb(0, 41, 255)')