D3 update dataset on click and redraw the bar chart

Question

I am new to d3 as well as javascript, and I am having trouble updating the dataset, as well as redrawing the bars. This is the code I have been looking at so far.

http://jsfiddle.net/TwEhT/2/

I have a function clickEvent, that is evoked upon a click on any bar. This function prompts for a value.

function clickEvent() 
{
    var op = prompt("Please enter the value", "");
};

What I need to do is to update the dataset at the index of the click, and redraw the rects so that they will reflect the change to the dataset.

Any help would be appreciated. Thanks.

Hurdle

You might try looking at returning something from that clickEvent function (or, perhaps, changing an array index value in your dataset somewhere inside/related to the clickEvent function) so that the value can be reflected in your dataset/graph. – Siderosis

Answer 1

For a very simple example, you could update the dataset directly, and put the bar drawing code in a render() function that you can call to re-render the changes.

var dataset = [...];

function render() {
    // bind dataset to rects and draw here
}

function clickEvent(d, i) {
    var op = prompt("Please enter the value", d);
    dataset[i] = parseInt(op, 10);
    render();
};

Here's a running example in your code: http://jsfiddle.net/findango/TwEhT/4/

Novokuznetsk