Global trade networks exploring app w/ Cytoscape + AG Grid

Dash Python
1

Hi Plotly community!

I’d like to share an app I’ve been working on lately and maybe get some feedback from you about it. It visualizes nine global trade networks for precious metals, stones and related products in 2022. The data for them was obtained using the UN Comtrade API.

Link to the app: https://precious-trade-9495c0104c61.herokuapp.com/

First, a few pictures of what I got, and then the story :slight_smile:

silver_links
silver_links1448×881 238 KB

silver_reg
silver_reg1448×883 247 KB

silver_reg_h
silver_reg_h1455×884 228 KB

silver_table
silver_table1440×883 77 KB

The idea

There are thousands of products in the Comtrade database, including food, art, spaceships, etc. And initially I wanted to quickly get an idea of how international trade of various goods is organized. You can learn more about the features of a particular trade network by changing the coloring parameter of its nodes: the region to which the country belongs, the number of its trade links, or the export-import balance of its trade.

The second goal here is to identify “hidden” trade connections and territories (bunkers, free trade zones, countries that have closed their statistics). They do not report exports and imports, but we can obtain information from countries that trade with them and record mutual transactions.

Network elements - brief description

The size of the nodes is determined by the total trade volume of the product (imports + exports in $). Each country/territory is linked to its two leading suppliers of this product. The link between two countries reflects the direction of net trade flow between them (the difference in mutual exports). My repo on how to build a similar network: GitHub - lomska/Visualizing-Global-Trade-Networks: Python script that visualizes international commodity trade networks quickly and beautifully

Tools

The network is built using Pygraphviz + Cytoscape. The tables are built using AG Grid. Since the grouping option is only available in the enterprise version, I made two tables in separate tabs: one for country totals (node data) and one for trade between countries (edge data). The tables contain detailed data about each country and allow you to sort countries by various indicators.

Open to feedback and any ideas for improvement :slight_smile:

4 Likes
2

This is an amazing app, @lomska . Thank you for sharing with us.

Two recommendations from me:

  • Instead of the label ‘country highlighted’ I would call it ‘country clicked’ because how to highlight a country is vague, and clicking a country is clearer.
    image

  • whenever a country is clicked, it takes about 2-3 seconds to fully update and the data to fully load. At first, I thought I broke the app. I recommend adding a dcc.loading.

1 Like
3

Hey Adam @adamschroeder,

Thank you very much for your good advice! I updated the app according to your suggestions :slight_smile:

4

@lomska , we would love to showcase this app on the Dash Explore Page.

Would you be interested?

5

@adamschroeder
Of course I’ll be glad!

6

wonderful, I just sent you a direct message.

7

HI @lomska welcome to the forums.

Nice app, I like the network graph and the color choice a lot!

Is there a way to place the nodes initially in a certain pattern, e.g. in a shape of a world map?

1 Like
8

Hi @AIMPED,

And thank you!

Cytoscape appears to have a “preset” layout where you place nodes in precise positions. But first you will have to pre-calculate these positions somewhere. I don’t think the program itself will place them on the map.

2 Likes
9

It looks great! Nice work :+1:

1 Like
10

Thanks a lot, @Emil !