D3-从enter()调用函数

时间:2019-01-08 13:21:17

标签: d3.js

我这里有个突如其来的飞车-https://stackblitz.com/edit/chart-update-1-34uvdo?file=src%2Fapp%2Fbar-chart.ts

我在Angular应用中有一个D3条形图。

创建的条带有开始和结束位置。

要显示它的开始位置是高于还是低于结束位置,我会在条形上方显示欠款。

我正在使用通用更新模式在数据更改时重绘图形。

我的问题是数据更新时箭头不会更新。

我认为我需要在模式的输入部分中创建箭头。

如何从输入部分调用函数。

///Enter
    bar.enter()
      .append("rect")
      .classed('bar', true)

      .attr("x", (d, i) => {
        return this.x(d.phase)
      })

      .attr("width", (d, i) => {
        return this.x.bandwidth()
      })
      .attr("y", (d, i) => {
        if(d.start < d.finish){
          return this.y(d.finish);
        }else{
          return this.y(d.start);
        }
      })
      .attr("height", (d, i) => {
        if(d.start < d.finish){
          return this.y(d.start) - this.y(d.finish);
        }else{
          return this.y(d.finish) - this.y(d.start);
        }
      })
      .each( function(d, i) {
        //call arrow function here
      })

0 个答案:

没有答案