Loading data from a server

It is probably very rare that you will only be visualizing static local data. The power of data visualization usually lays on the ability to visualize dynamic data typically generated by a server-side program. Since this is a common use case, D3 comes with some handy helper functions to make this task as easy as possible. In this recipe, we will see how a remote dataset can be loaded dynamically and will update an existing visualization once it is loaded.

Getting ready

Open your local copy of the following file in your web browser:

https://github.com/NickQiZhu/d3-cookbook-v2/blob/master/src/chapter3/asyn-data-load.html .

How to do it...

In the code example of the asyn-data-load.html file, we will load data dynamically from the server on the user's request, and once the data is loaded, we will also update our visualization to reflect the new expanded dataset. The following is the code for its implementation:

<div id="chart"></div> 
 
<script...