Animation using d3.js
We looked at a d3.js example in the previous chapter. We now know how to handle MeteorJS reactivity. In this section, we are going to learn how to perform animations and transitions using d3.js.
What are we going to develop to demonstrate d3.js animations? We are going to develop a visualization that will show climate change in world locations. Cool, isn't it?
Our objective is to learn how to perform animations using d3.js. Most of the code samples will be pretty well known to you. To keep things simple, we are going to draw a world map with the help of the DataMaps
package. The idea of the application is to show circles on the map at the specified latitude and longitude with simple animations.
Let us start by creating an application, for example, AnimationPartyd3
. Remove all the hello template-related code, including the content of the body
tag in AnimationPartyd3.html
. Insert a div
container where we will draw the, map as follows:
<div id="container"></div>...