如何在D3中的两点之间创建曲线?

时间:2017-08-07 16:02:57

标签: javascript d3.js

我想弯曲一条线的起点和终点之间的空间。我尝试过使用插值,但这只会破坏图形。有没有人有任何其他方法来实现这一目标?

var lines = linesContainer.selectAll("line.bot")
  .data(lineData);

lines.exit().remove();

lines
  .enter()
  .append("line")
     .attr("fill", "none")
     .attr("stroke-linecap", "round")
     .attr("stroke-width", "6");

lines
  .attr("class", function (d) {
     var isPositive = function (o) {
       if (o.y2 === 0) {
         return Math.sign(o.y1) >= 0;
       }
       return Math.sign(o.y2) >= 0;
     }

     if (isPositive(d)) {
       return "s-g3 bot";
     }
     return "s-r2 bot";
  })
  .attr('x1', function (d) {
     return x(d.x1);
  })
  .attr('y1', function (d) {
     return y(d.y1);
  })
  .attr('x2', function (d) {
     return x(d.x2);
  })
  .attr('y2', function (d) {
     return y(d.y2);
  });

0 个答案:

没有答案