因此,我正在尝试将 M Bostock 的 x 值鼠标悬停示例改编为我自己的图表,主要区别在于我有多个系列而不是他的系列。目前我只是想让这些圈子发挥作用。我的问题是,当我将鼠标悬停在图表上(在 Firebug 中)时,我收到消息:Unexpected value translate(<my_x>, NaN) parsing transform attribute
. 我尝试了几种不同的方法来修复它,但每次都得到相同的响应。我究竟做错了什么?
我有一个jsFiddle,问题在底部:
var focus = main.append('g')
.attr('class', 'focus')
.style('display', 'none');
var circles = focus.selectAll('circle')
.data(sets) // sets = [{name: ..., values:[{date:..., value:...}, ]}, ]
.enter()
.append('circle')
.attr('class', 'circle')
.attr('r', 4)
.attr('stroke', function (d) {return colour(d.name);});
main.append('rect')
.attr('class', 'overlay')
.attr('width', w)
.attr('height', h)
.on('mouseover', function () {focus.style('dispaly', null);})
.on('mouseout', function () {focus.style('display', 'none');})
.on('mousemove', mousemove);
function mousemove() {
var x0 = x_main.invert(d3.mouse(this)[0]),
i = bisectDate(dataset, x0, 1),
d0 = dataset[i - 1].date,
d1 = dataset[i].date,
c = x0 - d0 > d1 - x0 ? [d1, i] : [d0, i - 1];
circles.attr('transform', 'translate(' +
x_main(c[0]) + ',' +
y_main(function (d) {return d.values[c[1]].value;}) + ')'
);
== 编辑 ==