将数据绑定到轴刻度D3.js

Question

将数据绑定到轴刻度D3.js

3

我会将数据绑定到我的轴刻度上（由序数比例尺生成），以便在鼠标悬停事件中稍后使用。

我不想显示它，只是绑定它：

  //data what I would like to bind on each tick (eg. "<0,1" tick binded to 10
//"<0,2" tick binded to 28
//"<0,3" tick binded to 4
//...
  var data = [10,28,4,6,10,65,87,54, 9, 1,45];
//what is display on tick
  this.xLabelsValues = ["<0,1", "<0,2", "<0,3", "<0,4", "<0,5", 
                        "<0,6", "<0,7", "<0,8", "<0,9", "<1", "=1"];

  this.x = d3.scale.ordinal()
    .rangeRoundBands([0, this.width], .1);

    this.x.domain(chart.xLabelsValues);

    this.svg.append("g")
      .attr("class", "x axis")
      .attr("transform", "translate(0," + this.height + ")")
      .call(this.xAxis);

//my event
 this.svg.selectAll(".tick").on("mouseover", this.mouseover);

  this.mouseover = function(d, e){
   //I want my binded data here!
};

这是可能的，还是我需要欺骗一些东西？

- Julien Leray

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Cyril Cherian · Answer 1

这些刻度已经绑定到刻度值上了。

类似于设置一些额外数据的技巧：

d3.selectAll(".tick")[0].forEach(function(tick){
          //set the data all ticks
          d3.select(tick)[0][0].myData = {foo:"bar"} 


        });

从 ticks 获取数据

d3.selectAll(".tick")[0].forEach(function(tick){
          //set the data


          console.log(d3.select(tick)[0][0].myData)
        });