面积图渐变色填充

请问老师面积图的渐变色填充问题该怎么做呢好像css3的渐变色属性在这里的fill里面不起作用

qq_痛恍若隔世的幸福_0

2020-05-19

源自：使用D3制作图表 3-1

关注问题我要回答

807

操作

收起

1 回答

青山依旧ii
2020-12-21

// 线性渐变 需要手动添加  linearGradient 标签
// 径向渐变同理
function linearGradient(container, color1, color2) {
  var defs = container.append("defs");

  var gradient = defs
    .append("linearGradient")
    .attr("id", "linearColor")
    .attr("x1", "0%")
    .attr("y1", "0%")
    .attr("x2", "0%")
    .attr("y2", "100%");

  gradient
    .append("stop")
    .attr("offset", "0%")
    .style("stop-color", color1.toString());

  gradient
    .append("stop")
    .attr("offset", "100%")
    .style("stop-color", color2.toString());

  return gradient;
}