0

我在那里发帖是因为我在其他帖子或谷歌上找不到东西。

http://jsfiddle.net/CUQaN/9/

正如您在 JS fiddle 上看到的那样，我有一个折线图，每个点都有一个圆圈。我想用新数据更新这个图表。问题是我可以得到比我已经在图表上得到的分数更少或更多的分数。例如，我的折线图上可以有 8 个点，然后当我更新图表时，我可以只有 4 个，甚至 15 个点。而且我的圈子没有正确更新，因为我只是在更改已经存在的圈子的值。但我真的不知道如何正确更新它们。

我有时可以拥有这些数据：

            var data = [
                {"date":"4-May-12","close":Math.random()*568.13,"open":Math.random()*35.12},
                {"date":"3-May-12","close":Math.random()*568.13,"open":Math.random()*35.12},
                {"date":"2-May-12","close":Math.random()*568.13,"open":Math.random()*35.12},
                {"date":"1-May-12","close":Math.random()*568.13,"open":Math.random()*35.12},
                {"date":"30-Apr-12","close":Math.random()*354.98,"open":Math.random()*424.56},
                {"date":"27-Apr-12","close":Math.random()*24.00,"open":Math.random()*253.89},
                {"date":"26-Apr-12","close":Math.random()*490.70,"open":Math.random()*215.54},
                {"date":"25-Apr-12","close":Math.random()*42.00,"open":Math.random()*351.23},
                {"date":"24-Apr-12","close":Math.random()*210.28,"open":Math.random()*20.23},
                {"date":"23-Apr-12","close":Math.random()*20.70,"open":Math.random()*368.34},
                {"date":"20-Apr-12","close":Math.random()*412.98,"open":Math.random()*42},
                {"date":"19-Apr-12","close":Math.random()*26.44,"open":Math.random()*20.56},
                {"date":"18-Apr-12","close":Math.random()*48.34,"open":Math.random()*356.45},
                {"date":"17-Apr-12","close":Math.random()*26.44,"open":Math.random()*20.56},
                {"date":"15-Apr-12","close":Math.random()*48.34,"open":Math.random()*356.45},
            ];

其他时候只是这些数据：（或多或少）

            var data = [
                {"date":"4-May-12","close":Math.random()*568.13,"open":Math.random()*35.12},
                {"date":"3-May-12","close":Math.random()*568.13,"open":Math.random()*35.12},
                {"date":"2-May-12","close":Math.random()*568.13,"open":Math.random()*35.12},
                {"date":"1-May-12","close":Math.random()*568.13,"open":Math.random()*35.12},
                {"date":"30-Apr-12","close":Math.random()*354.98,"open":Math.random()*424.56},
            ];

有人可以帮助我吗？

非常感谢 ！

4

1 回答 1

0

删除旧点并添加新点可能比尝试移动它们更好。为此，您可以使用 id 函数使点独一无二 - 请参见此处

一个小例子：

svg.selectAll("circle")
    .data(myData, function(d) { return d.x; })
    .enter()
    .append("circle");

这里的重要部分是点由它们的 x 值标识，而不是它们在数据点数组中的索引。事实上，这可能对您当前的情况有所帮助，因为这些点只会向上/向下移动，而不是左右移动。

于 2013-07-24T12:45:14.763 回答