无法通过在d3系列图表上拖动矩形来进行缩放以正常工作

我正试图通过在序列图上拖动一个矩形来确定缩放的间隔来实现缩放。这是我的plunkr

http://plnkr.co/edit/isaHzvCO6fTNlXpE18Yt?p=preview

你可以用鼠标在图表上画一个矩形来解决这个问题——新图表超出了X轴和Y轴的边界。我以为svg下的小组会处理系列赛的边界（路径），但我显然错了。盯着它看了很长时间，我想不通。请忽略plunkr的角度。我认为问题出在的某个地方

//Build series group
                        var series = svgGroup.selectAll(".series")
                            .data(data)
                            .enter().append("g")
                            .attr("class", "series");
                        //Build each series using the line function
                        series.append("path")
                            .attr("class", "line")
                            .attr("d", function (d) {
                                return line(d.series);
                            })
                            .attr("id", function (d) {
                                //While generating the id for each series, map series name to the path element.
                                //This is useful later on for dealing with legend clicks to enable/disable plots
                                legendMap[d.name] = this;
                                //Build series id
                                return buildPathId(d.name);
                            })
                            .style("stroke", function (d) {
                                //Use series name to get the color for plotting
                                return colorFcn(d.name);
                            })
                            .style("stroke-width", "1px")
                            .style("fill", "none");

如有任何帮助，我们将不胜感激。

非常感谢。