United States Trade Deficit
The United States operates at a trade deficit, which means that the US buys more goods from abroad than it sells. This is one of the contributing factors to the national debt. This visualization looks at the US Trade Deficit from 2001 – 2013 by month. It shows the top 20 trading partners for both imports and exports.
The countries along the top represent countries the United States sells goods to, and the money flowing into the US. The countries along the bottom are the ones that the United States buys goods from, and the money flowing out of the US. The dollar amount in the middle is the cumulative deficit over this period of time.
This publicly available data was gathered from the US Census. (http://www.census.gov)
[…] The United States operates at a trade deficit, which means that the US buys more goods from abroad than it sells. This is one of the contributing factors to the national debt. This visualization looks at the US Trade Deficit over the last 11 years by month. It shows the top 20 trading partners forRead More […]
Can we do forward and backward some determined data set?
Hi
Can i get the files of this project?
Hello Shiva,
Thank you for your interest! At this time we have not released this project as open source, but at some point we might.
Cheers,
Tom
Hey Tom, there are some mistakes on mousehover. Please check.
Hi Manuk, Thanks for your feedback! This is just demo code we built several years ago. We have some ideas for a new way to visualize this data that we will be working on at some point.
I like the visualization, but ou have 1 major issue with the transitions. The problem/solution is described here: https://bost.ocks.org/mike/constancy/
To sum things up, you guys need to use the country as the key for the paths, so that they don’t randomly rotate around. That couple of lines of code would make a drastic improvement in the animations, and the perception of things as they change over time.
Hi Bob,
Thanks for the feedback. The countries are actually not moving around randomly, but a conscious decision was made to sort them based on the volume of deficit. We actually spent quite a bit of time engineering in the transitions to animate to show the relative position changing of each country. That being said, this visualization is several years old and could use some sprucing up – it doesn’t render all that well in several browsers.
Thanks again for your comments, keep them coming.
Cheers,
– Tom
Great suggesting!
[…] circular flow chart United States Trade Deficit [brightpointinc.com] shows the US Trade Deficit over the last 11 years by month. The United States […]
[…] United states trade deficit brightpoint. The united states operates at a trade deficit, which means that the us buys more goods from abroad than it sells. This is one of the contributing factors to the. […]
We want this
I really like this animation, it was helpful to look through the source code and see how you solved some of the challenges.
I agree that there is something wrong with the transitions as Bob Monteverde commented. The ordering is fine, but the bars swap around randomly. In looking at your code, I found it is not object constancy that is your problem, but rather that your are overriding the properties on the data objects instead of making new ones.
I also found the problem with the hover over inconsistencies. It was an array that was assumed to be sorted, but wasn’t.
I have downloaded your source code and fixed it. You are welcome to reach out to me if you’d like the fix. I fixed it mostly as a learning exercise in learning the d3 javascript framework.
And to answer shiva kumar, all javascript code is publicly available. In fact, your browser needs to download it in order to run it. Simply look at the page source and you can find it. It may help to pull it from this site: http://www.brightpointinc.com/labs/ustrade/index.html
Cheers, Mike
Hi Mike,
Thanks for the great work, much appreciated. This example is several years old, and clearly just a proof of concept, which is one of the reasons we didn’t open source it (known bugs.)
Thanks,
Tom
Thank you Tom. I appreciate you responding to my comment.
Yeah I know it’s several years old, but it is still a good resource for those learning D3. I found this example on the page of examples from the D3 website (d3js.org). I’ve now written up a little bit about the experience, and am hosting a fixed version if you would like to see it. You can see my description of the task here:
http://www.cs.utah.edu/~mbentley/hobbies/index.html
and the minimally fixed hosted version:
http://www.cs.utah.edu/~mbentley/hobbies/d3/ustrade/minimal-fix/index.html
The changes I made can be seen in this patch file:
http://www.cs.utah.edu/~mbentley/hobbies/d3/ustrade/minimal-fix.patch
I’m happy to contribute back for you guys making such a useful animation to learn from.
Thanks,
Mike
This is fantastic Mike! Thanks for the contribution and write up!
– Tom
Really interesting and useful design. I extremely enjoyed seeing it