D3.js: Cutting-edge Data Visualization

Updating graphs upon the modification of details data

The final example will make the update of the data bidirectional between the details view and bar and donut graphs. The previous example only updates the detail view upon clicking on a bar. The content of the details view is static text, and hence, the user cannot modify the data. This is changed by modifying the template to utilize text input fields. There is no change to the controller, so it will not be discussed.

The web page

The web page for this example, 04_dynamic.html, contains several small changes from the previous example to reference new implementations for the bars, donut, and details directives. The <div> tag remains the same. Take a look at the following code:

<script src="app.js"></script> ...