D3.js：使用更改数据更新图表

Question

我有一个网络抓取工具，可以获取每分钟的库存数据，并且我会在每次调用AJAX后尝试更新我的图表。我的x轴和y轴成功重绘，但我似乎无法将主要路径下的区域和移动平均线更新。两条线都过渡但只是沿着顶部形成一条线，而且该区域似乎根本不会移动。

我要做的是添加一个新的数据点，用data_prices.shift()弹出最旧的数据点，然后重新绘制线条和区域。

我不确定我的问题是否只是对enter()，update和exit()的理解不足，但我似乎无法理解我和＃ 39;我在这里做错了。

我在更新后AJAX调用图时的代码如下：

            .done(function(data) {
                console.log("Success");
                console.log(data);
                if (data['pagedata']!=null) {
                    for(result in data['pagedata']) {
                        var item = {'timestamp':data['pagedata'][result][0], 
                                         'close':data['pagedata'][result][1], 
                                         'high':data['pagedata'][result][2], 
                                         'low':data['pagedata'][result][3], 
                                         'open':data['pagedata'][result][4], 
                                         'volume':data['pagedata'][result][5], 
                                         'average':data['pagedata'][result][6]}
                        if(!data_prices.includes(item)) {
                            data_prices.push(item);
                            data_prices.shift();
                        }
                    }

                    var prices = d3.keys(data_prices[0]).filter(function(d){
                        return d == "close" || d == "high" || d == "low" || d=="average";
                    });

                    prices.forEach(function(price){     
                        var g = focus.selectAll("g."+price);
                        var ctx = context.selectAll("g."+price);

                        var arr = data_prices.map(function(d){
                            return {
                                key: price,
                                timestamp: d.timestamp,
                                volume: d.volume,
                                value: d[price]
                            };
                        });

                        x.domain([d3.min(data_prices, function(d){
                            var time = timeParser(d.timestamp);
                            return time;
                        }), d3.max(data_prices, function(d){
                            var time = timeParser(d.timestamp);
                            return time;
                        })]);
                        y = d3.scaleLinear().domain([minVal, maxVal]).nice();

                        focus.select(".axis.x")
                            .transition()
                            .duration(750)
                            .call(xAxis);

                        focus.select(".axis.y")
                            .transition()
                            .duration(750)
                            .call(yAxis);

                        g.selectAll(".area")
                            .transition()
                            .duration(750)
                            .attr("d", function(d){
                                return area(d);
                            });

                        ctx.selectAll(".area")
                            .transition()
                            .duration(750)
                            .attr("d", function(d){
                                return areaCtx(d);
                            });

                        ctx.selectAll(".trendline")
                            .transition()
                            .duration(750)
                            .attr("d", function(d){
                                return lineCtx(d);
                            });

                        g.selectAll(".trendline")
                            .attr("d", function(d){
                                console.log(d);
                                return line([arr]);
                            })
                            .attr("transform", null)
                                .transition()
                                    .duration(750)
                                    .attr("transform", "translate(" + x(-1) + ",0)")

                        ctx.selectAll(".avgLine")
                            .transition()
                            .duration(750)
                            .attr("d", function(d){
                                return lineCtx(d);
                            });

                        g.selectAll(".avgLine")
                            .transition()
                            .duration(750)
                            .attr("d", function(d){
                                return line(d);
                            });

                    });
                }
            })

更新：当我将console.log(d);放入趋势线等的attr部分之一时，数据集似乎无法更新。所以我认为问题在于我没有更新数据集而且它有点吓坏了吗？