Използвам Leaflet, за да начертая картографски данни във формат SVG върху карта с javascript. Имам набор от хиляди координати, в които рисувам път на листовка (разширява L.Browser.svg).
Бих искал да оцветя линията с 3-та променлива (тъй като това е карта, да речем, надморска височина, синьото е ниско, а червеното е високо или нещо подобно). Нов съм в SVG, но изглежда, че мога да задам само цвят на щрих за целия път.
напр. Това, което имам сега -- линията е само един цвят (Концептуалният код е намален за простота):
// create the SVG group and path element
this._container = this._createElement('g');
this._path = this._createElement('path');
// set the stoke color -- I wish I could make this dynamic per segment!
this._path.setAttribute('stroke', '#00000');
// Not real code, but simplified...generate lots of coordinates for the polyline
var myPath = "M" + p.x + "," + p.y + " L";
points.each(function(item, index){
poly += item.x + "," + item.y + " ";
});
// update
this._path .setAttribute('d', poly);
Има ли по-добър начин да направите това от това да създадете хиляди елементи на пътя и да ги добавите към SVG групата, всеки със собствен цвят на щриха?