Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not deleted when data is updated. #116

Open
kdh6429 opened this issue Sep 1, 2015 · 1 comment
Open

Not deleted when data is updated. #116

kdh6429 opened this issue Sep 1, 2015 · 1 comment

Comments

@kdh6429
Copy link

kdh6429 commented Sep 1, 2015

I'm using d3.chart as my bar chart.
When I changed my data through 'push', and seems every function is called well. (only 'update' function is not called, dont know why)
but my chart is not deleted, over-draw on it.
what am i missing.

this is my part of code

            insert: function() {
                var chart = this.chart();
                console.log("insert");

                return this.append('rect')
                .attr('fill', 'blue')
                .attr('width', chart.xScale.rangeBand());
            },
            events: {
                enter: function() {
                    var chart = this.chart();
                    console.log("enter", data);
                    console.log(chart);
                    return this
                    .attr('x', function(d) { return chart.xScale(d.name); })
                    .attr('y', function(d) { return chart.yScale(d3.max([0, d.value])); })
                    .attr('height', function(d) { return Math.abs(chart.yScale(d.value) - chart.yScale(0)); })
                    .attr('width', chart.xScale.rangeBand())
                    .attr('fill', function(d) {return chart._color(d.name);})
                    .on("mouseover", function(d) { console.log(d); chart._callback_mouseover(d); });
                },
                merge: function () {
                    console.log("merge");
                    var chart = this.chart();

                    console.log(this);
                    return this
                    .attr('x', function(d) { console.log(chart.xScale(d.name)); return chart.xScale(d.name); })
                    .attr('y', function(d) { return chart.yScale(d3.max([0, d.value])); })
                    .attr('width', chart.xScale.rangeBand())
                    .attr('height', function(d) { return Math.abs(chart.yScale(d.value) - chart.yScale(0)); })
                    .attr('fill', function(d) {return chart._color(d.name);})
                    .on("mouseover", function(d) { console.log(d); chart._callback_mouseover(d); });
                }
            }

first draw
image

second draw
image

and third
image

@kdh6429
Copy link
Author

kdh6429 commented Sep 2, 2015

http://jsfiddle.net/vtC75/6/
I tried to change some code to make more reuseable. since that, bar chart is currently displayed NOT well.
I think because of scale and range.. any idea of this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant