leaflet 结合D3 svg画图
首先获取: var svg = d3.selectAll(“svg”);
var defs = svg.append(“defs”);
然后
var linearGradient = defs.append(“linearGradient”)
.attr(“id”, i + “linearColor” + j)
.attr(“x1”, “0%”)
.attr(“y1”, “0%”)
.attr(“x2”, “100%”)
.attr(“y2”, “0%”);
var stop1 = linearGradient.append(“stop”)
.attr(“offset”, “0%”)
.style(“stop-color”, 开始颜色);
var stop2 = linearGradient.append(“stop”)
.attr(“offset”, “100%”)
.style(“stop-color”, 结整颜色);
var strokeWidth = “3”;
if (riverData[j].HLJB == “干流”) {
strokeWidth = “6”;
} else if (riverData[j].HLJB == “一级”) {
strokeWidth = “2”;
}
else if (riverData[j].HLJB == “二级”) {
strokeWidth = “1”;
}
else {
strokeWidth = “0.5”;
}
var weightedPolylineTest = new L.polyline(runData, {
riverName: riverNames[i],
//fill: true,
//fillColor: ‘#6688ff’,
//color: ‘#3388ff’,
weight: strokeWidth,
opacity: 1,
stroke: true,
className: “layer_” + i + “river” + j
})
var c = “layer_” + i + “river” + j
var d = “leaflet-interactive”;
GisPageMap.riverLayers.push(weightedPolylineTest);
//console.log(weightedPolylineTest)
map.addLayer(weightedPolylineTest);
svg.selectAll(“.” + c + “.” + d).attr(“stroke”, “url(#” + linearGradient.attr(“id”) + “)”);//此句放最后,记的
转载自:https://blog.csdn.net/lxl743p/article/details/79651870