Skip to main content
100%

Percent change GDP

✓ Published0🌍 Public
Aandrewwitherspoon
Last edited Aug 23, 2017
Created on Aug 23, 2017

This multi-series line chart visualizes the annual percent change in GDP for 20+ countries from 2000 to 2016, with each country represented by a colored line. The x-axis encodes time using d3.time.scale, while the y-axis uses a linear scale for percent change values. Data is loaded and parsed from a TSV file using d3.tsv, with dates parsed via d3.time.format. The chart computes its domains using d3.extent, d3.min, and d3.max, derives column names via d3.keys, and applies color encoding with d3.scale.category10. Axes are rendered using d3.svg.axis, and the multi-series lines are drawn with d3.svg.line. The visualization uses conventional margins and an SVG rendering, displaying each country's annual GDP percent change since the year 2000.

AI-generated description

This line chart is constructed from a TSV file storing the daily average temperatures of New York, San Francisco and Austin over the last year. The chart employs conventional margins and a number of D3 features:

forked from <a href='http://bl.ocks.org/mbostock/'>mbostock</a>'s block: <a href='http://bl.ocks.org/mbostock/3884955'>Multi-Series Line Chart</a>

forked from <a href='http://bl.ocks.org/andrewwitherspoon/'>andrewwitherspoon</a>'s block: <a href='http://bl.ocks.org/andrewwitherspoon/479c3d37010739023f8dfc5830b937f7'>Percent change GDP</a>

mit Licensed

Similar vizzes

Loading thumbnail…

Percent change GDP

This line chart shows the percent change in GDP for 55 countries from 1990 to 2014, with each country represented by a single multi-line series. The chart uses conventional margins and D3 v4 features including d3.tsv for data loading, d3.time.scale for the x-axis, d3.scale.linear for the y-axis, and d3.scale.category10 for color encoding. Data is parsed from a TSV file with d3.tsv, dates are parsed using d3.time.format, and the chart computes domains with d3.extent, d3.min, and d3.max. Axes are rendered with d3.svg.axis and the lines with d3.svg.line. The visualization reveals the varying economic growth trajectories across 55 countries from 1990 onward, with noticeable divergences and spikes in percent change GDP over time.

Aandrewwitherspoon
94% match
Loading thumbnail…

Line Chart

This line chart visualizes GDP growth for top countries across 2017–2018, using a time-scaled x-axis and linear y-axis. The SVG rendering relies on D3 v5 APIs including `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` to draw the path. Data is loaded from a CSV via `d3.csv`, with axis labels styled through CSS. The chart includes grid lines and a single red trend line, with the y-axis tick format simplified using a custom formatting function.

SSRI RAM REDDY KOTERU
78% match
Loading thumbnail…

Africa GDP

This line chart displays the annual GDP percent change for 52 African countries from 2008 to 2013, with each country represented by a separate line colored using d3.scale.category10. The data is loaded from a TSV file, and the visualization uses d3.tsv for parsing, d3.time.format for dates, d3.time.scale for the x-axis, and d3.scale.linear for the y-axis. Hovering over the chart reveals the specific country's values through an interactive tooltip, making it easy to compare economic growth trends across the continent. The chart is rendered with SVG and follows conventional margins.

Aandrewwitherspoon
78% match
Loading thumbnail…

GDP Average Chart

This D3.js bar chart visualizes the 2023 GDP per capita for the top 50 countries, using a green circle for each nation plotted along a categorical x-axis and a linear y-axis. Circles are positioned using `d3.scaleBand` and `d3.scaleLinear`, with interactive tooltips revealing the country name and GDP on hover. The SVG chart, built with `d3.svg` and `d3.axisBottom`/`d3.axisLeft`, reads data from the included `TopGDPCountries.csv` file, rotating x-axis labels for readability. Data originates from Worlddata.info.

Mmhzahdeh@dons.usfca.edu
77% match
Loading thumbnail…

GDP Variation over time plot-2

This scatter plot shows GDP variation over time, with each circle representing a country-year observation. The color of each point corresponds to the year, using an ordinal color scale with a diverging RdYlBu color scheme. The visualization includes an interactive color legend that filters points by year through click events. Built with D3 v5, the example uses `d3.scaleOrdinal`, `d3.schemeRdYlBu`, and custom modules for the scatter plot and legend, rendering as SVG with data loaded from a CSV file.

MMukund Khandelwal
76% match
Loading thumbnail…

GDP rate in Line Chart

This line chart visualizes India's GDP from 2010 to 2022, with the x-axis showing years and the y-axis displaying GDP values. The visualization uses D3.js v5 within a React framework, rendering as an SVG. It loads CSV data via `d3.csv` from a GitHub gist, then uses `d3.scaleTime`, `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft` to construct the axes. A `d3.line` generator creates the orange GDP trend line, with custom CSS styling for labels and the title.

Pprachow
75% match
Loading thumbnail…

GDP Choropleth Viz

A world map colored by GDP per capita displays each country’s economic standing for a selected year, controlled by a slider. Hovering over a country updates a line plot showing that nation’s GDP trend over time, with red and green reference lines marking the current year’s value. The visualization combines a `d3.geoEqualEarth` projection rendered as SVG with `d3.scaleLinear` color encoding, alongside a linked line chart built using `d3.line` and axis components. GDP data originates from a CSV file, while country boundaries use a GeoJSON source.

TTom Heffernan
75% match
Loading thumbnail…

Line Chart

This line chart displays India’s GDP in billion U.S. dollars from 2001 to 2021, with the year on the x-axis and GDP values on the y-axis. The visualization uses D3 v5 with the `csv`, `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` APIs, rendering in SVG. Data is loaded from a remote CSV file, and axes include gridlines and labels. A red path traces the GDP trend over time.

HHarshavardhan
74% match