Recreating a
butterfly chart
Octuber 9, 2024
This week I recreated a butterfly chart from the New York Times on the frequency in the use of certain words, and the distribution among each party, at the United States National Conventions. Jonathan Corum participated in its creation.
Warning: Data may be inaccurate compared to the source.Recreation
D.N.C.
speakers
speakers
R.N.C.
speakers
speakers
Highlights
I had never made a butterfly chart before and decided to go the easy way, one I already knew: two horizontal bar charts, each facing one direction and separated by a space in the middle.
- Among so many charts, I spent a few minutes looking for the right name: tornado chart, diverging bar chart, population pyramid... I found several options before coming up with a butterfly chart.
- I've rarely had to adjust so much with axes and ticks, as there were two styles to add. I even had to use D3's selection.filter to remove the firsts ticks.
- I added a tooltip with a setting that I have rarely been able to use: it will appear to the left or the right, depending on which side you are on. The few times I have made this adjustment is when the tooltip is about to reach the SVG limit.