Polygon Tweening

2020 was a record breaking year for wildfires in California. Four of last year's fires are in the largest six wildfires ever seen in California. These include the August Complex fire which was California's largest wildfire in history by some margin .

Reuters has created a very impressive data visualization to illustrate the devastating size of last year's fires in California. At the heart of The Age of the Megafire is a visual comparison of the size of California's largest historical wildfires. To achieve this comparison Reuters has created a series of animated tweens of the fires, morphing the polygon shapes of each fire into squares of the same sized area. Representing the size of the fires as separate squares allows the user to easily compare the size of California's historical wildfires. 

To show how wildfires in recent years have started to become significantly larger than fires from the past Reuters has included a 'wildfire race' visualization. This involves showing the largest ten fires chronologically by year. As the years pass the larger squares (of the more recent wildfires) start pushing out the smaller squares (representing the largest historical wildfires from previous years). 

At the heart of Reuter's visualization is the transition of geographical shapefiles into geometric squares. Achieving this can be very difficult. However if you want an easy-ish introduction into how you can create a similar effect you should have a look at Mike Bostock's Shape Tweening demo. This small demo shows you how to tween a polygon shape (from a json file) into a circle.In Mike's example the shapefile of the state of California tweens into a similar sized circle.