在c3js中获取系列的开始和结束位置

Question

我正在尝试获取系列的开始和最后（x，y 坐标），以便我可以附加到我的图表。我已经尝试查看 onRendered 回调，但到目前为止只能获取标签。无法获取系列开始和系列结束（路径开始和路径结束）的实际 x、y 坐标。

我的fiddle：https://jsfiddle.net/sourabhtewari/94tbbyrd/27/

此代码为我提供了标签数据

function onRendered() {
  console.log(this);


 d3.selectAll('.c3-text').each((v) => {
           console.dir(v);
        });

}

Answer 1

尝试此代码段以获得每条路径的 first/last 点：

  var sel = d3.selectAll('.c3-line');
  console.log("sel:", sel);
  sel.each((v, i) => {
    var path = sel[0][i], 
    len = Math.floor( path.getTotalLength() );
    console.log("#:", i);
    console.log("path:", path);
    console.log("nr. points:", len);
    console.log("first point:", path.getPointAtLength(0));
    console.log("last point:", path.getPointAtLength(len-1));
  });

实际上 c3-line 是与系列 SVG 路径关联的 class。

检查 fiddle 更新：https://jsfiddle.net/beaver71/xzsq4t1z/

在c3js中获取系列的开始和结束位置

Get the starting and ending positions of the series in c3js

d3.js

c3.js