Learn D3.js

Changing views

Now that we have successfully displayed one complete view, we can demonstrate the power of D3 by automatically updating the view with new datasets. First, we need an interface to trigger the changes, such as a panel with a button for each view. The buttons can also be generated using D3's data-binding mechanism. Since buttons are only created and configured once, we will set them up inside a new init() function, called inside the JSON fetch promise:

d3.json("../Data/sol_2016.json")    .then(function(data) {        // only include planets with moons (p3 to p8)        app.planets = data.planets                        .filter(p => +p.id.substring(1) >= 3                                  && +p.id.substring(1) <= 8);        init(); // add this line        configureView();        draw();    }); function init() {}

The init() ...