"未捕获的TypeError:undefined不是函数"更新圈子时

时间:2014-10-20 13:16:19

标签: javascript svg d3.js

我正在努力实施" Rescale"当我按下按钮时,SVG画布更新轴和圆圈,并显示重新缩放轴的数据。

但是,我一直收到上述错误。删除圆圈没有问题,轴重新缩放。可能是什么问题呢?我的代码如下。

            var button = d3.select("body")
                .append("input")
                .attr("type","button")
                .attr("value", "Rescale");

            var toggle;

            button.on("click", function(){
                toggle = !toggle;

                xScale_left = d3.scale.linear()
                    .domain((toggle ? [0,7.5] : [6,7.5]))
                    .range([0, width / 2]);

                xScale_right = d3.scale.linear()
                    .domain((toggle ? [0,7.5] : [6,7.5]))
                    .range([width / 2, width]);

                xAxis_left = d3.svg.axis()
                    .scale(xScale_left)
                    .tickValues((toggle ? [1,6,7] : [6.1,7.1,7.2,7.3,7.4]))
                    .orient("bottom");

                xAxis_right = d3.svg.axis()
                    .scale(xScale_right)
                    .tickValues((toggle ? [1,6,7] : [6.1,7.1,7.2,7.3,7.4]))
                    .orient("bottom");

                svg = d3.select("body").transition();

                svg.select(".xaxis-left") // change the x axis
                    .duration(1500).ease("sin-in-out")
                    .call(xAxis_left);

                svg.select(".xaxis-right") // change the x axis
                    .duration(1500).ease("sin-in-out")
                    .call(xAxis_right);

                svg.selectAll(".nodes").remove();

                circles = svg.selectAll(".nodes")
                    .data(data) // This is where the error occurs
                    .enter()
                    .append("g")
                    .attr("class", "nodes");

                circles
                    .append("circle")
                    .attr("cx", function(d) {
                        if (d.qResult === "Apples" || d.qResult === "Kiwis") {
                            return xScale_right(d.KCComment);
                        } else {
                            return xScale_left(d.KCComment);
                        }
                    })
                    .attr("cy", function(d) {
                        if (d.qResult === "Apples" || d.qResult === "Oranges") {
                            return yScale_top(d.pscoreResult);
                        } else {
                            return yScale_bottom(d.pscoreResult);
                        }
                    })
                    .attr("r", function(d) { return d.r; })
                    .attr("class", "circle")
                    .style("fill", function(d){
                        if(d.qResult == "Apples"){
                            return "#de2533";
                        } else if(d.qResult == "Oranges") {
                            return "#ef7600";
                        } else if(d.qResult == "Blueberries") {
                            return "#595194";
                        } else{
                            return "#46ad00";
                        }
                    });
            });

0 个答案:

没有答案