Javascript d3中的曲线

正在做一个信息可视化项目，并希望从一个机场到另一个机场绘制多条线

设法让它与伟大的弧工作，但由于有多个航班往返于同一机场，我想有不同的半径线。这在d3中可能吗

编辑：以下是当前代码：

this.formatedflightdata = {type: "FeatureCollection", features: formatFlightData(this.flightdata)};

console.log(this.formatedflightdata);

var line = this.g.selectAll(".arc") 
 .data(this.formatedflightdata.features);

  line.enter().append("path")
    .attr("class", "arc")
    .attr("fill", "none")
    .attr("stroke", "red")
    .attr("stroke-width", "2px")
    .attr("stroke-linecap", "round")
    .attr("opacity", "1")
    .attr("d", this.path)
    .on("click",  function(d) {
      console.log("Clicked line!")
    });

function formatFlightData(array) {
    var data = [];
    array.map(function (d, i) {
      var feature = {
        "type":       "Feature",
        "geometry":   {
          "type":        "LineString",
          "coordinates": [
            [d.origlong, d.origlat],
            [d.destlong, d.destlat]]
        },
        "properties": {
          "origin": d.ORIGIN,
          "destination": d.DEST,
          "dayOfMonth": d.DAY_OF_MONTH,
          "flightDate": d.FL_DATE,
          "carrier": d.CARRIER,
          "distance": d.DISTANCE
        }
      };
      data.push(feature);
    });
    return data;
  }

---

是的，这是可能的。这更像是一个“原始”svg问题，而不是d3问题。 d3正在创建svg

path

元素。有关更多信息，请参阅

基本上，您可以构造

路径

，使其具有您喜欢的任何类型的曲线。具体到你的例子，你可以吗？要向表示控制点的数组中插入其他元素。然后，在

.attr（“d”）部分中，用适当的曲线构造字符串

未经测试的示例：

attr（“d”，this.path[0]+“Q 12 17”+this.path[1]）

“Q 12 17”试图绘制二次曲线，将（12,17）作为任意选择的控制点。
是的，这是可能的。这更像是一个“原始”svg问题，而不是d3问题。
d3正在创建svg
path
元素。有关更多信息，请参阅

基本上，你可以构造你的
路径
来拥有你喜欢的任何类型的曲线。具体到你的例子中，你可能需要在表示控制点的数组中插入额外的元素。然后，在
.attr（“d”）部分，用适当的曲线构造字符串

未经测试的示例：

attr（“d”，this.path[0]+“Q 12 17”+this.path[1]）

“Q1217”试图用（12,17）绘制一条二次曲线作为任意选择的控制点。
不幸的是，这对我不起作用。稍微更改代码，为每个路径创建单个svg元素。你知道如何操作已经绘制的svg线吗？不幸的是，这对我不起作用。稍微更改代码，为每个路径创建单个svg元素。你知道如何操纵吗吃了已经画好的svg线？