Question

从我提出的另一个question创建了一个图表，并通过研究包含有关如何平分嵌套数组的信息的this thread，我丰富了我的图表以进行缩放和重新设置。

我非常接近完成它，只是遗漏了一些我认为会容易得多的东西。我目前卡在工具提示中。当鼠标悬停在图表上并显示当前日期，行名称和行值时，所需的效果是显示工具提示。我尝试了很多东西，但无法获得预期的结果。

而且，我不确定二分法。我做得对吗？原始数据集转为嵌套数组，然后进行二分法再次操作。这是正确的方法吗？或者使用原始数据集是否安全？

我正在寻找故障安全来创建可在其他情况下工作的工具提示 - 不仅仅是这个特定的图表，所以任何建议和/或建议都非常受欢迎。

我的工具提示代码如下：

var mousemoveFunc = function(d, i) {
      var d, d0, d1, i, x0, left, mouse, top;
      x0 = xz.invert(d3.mouse(this)[0]);
      ds = dataGroup.map(function(e) {
        var i = bisectDate(e.values, x0, 1),
            d0 = e.values[i - 1],
            d1 = e.values[i];
        return d = x0 - d0.date > d1.date - x0 ? d1 : d0;
        }); 

      mouse = d3.mouse(svg.node()).map(function(d) {
        return parseInt(d);
      });

      left = Math.min(containerwidth, mouse[0]+margin.left+margin.right);
      top = Math.min(containerheight, mouse[1]+margin.top+margin.right);

      tooltip.data(ds).classed('hidden', false).attr('style', 'left:' + left + 'px;top:' + top + 'px;margin-top:' + (-margin.top) + 'px;').html(function(d,i) { 

        for (var i = 0; i < ds.length; i++){
            if (ds[i].date === d.date){
              return ds[i].name + ' ' + ds[i].value;
            }
          }
      });
    };

..我几乎可以肯定在工具提示上重新附加数据（ds）是错误的，但这是我能够设法显示结果的唯一方法。

我创造了以下小提琴：https://jsfiddle.net/2en21Lqh/4/

：/现在我正在撰写帖子，我刚刚意识到在单个元素上附加数据是完全错误的，因为函数（d）只会运行一次。

Answer 1

以下是我对mousemove函数的实现：

var mousemoveFunc = function(d, i) {

  var x0 = xz.invert(d3.mouse(this)[0]);

  var lastDate,
      ds = dataGroup.map(function(e) { 
        var i = bisectDate(e.values, x0, 1),
            d0 = e.values[i - 1],
            d1 = e.values[i];

        var d = x0 - d0.date > d1.date - x0 ? d1 : d0;

        lastDate = d.date;
        return e.key + " " + d.value;
      });

  var left = d3.event.x,
      top = d3.event.y;      

  tooltip
    .html(lastDate.toString() + "<br/>" + ds.join("<br/>"))
    .classed('hidden', false)
    .style('left', left + 'px')
    .style('top', top + 'px');

};

更新了fiddle。

D3工具提示显示嵌套数据集中的值

1 个答案: