GDP Per Capita Historical Values Race to the Top with Animated Bar Chart

An Animated Bar Chart is used to visualize the historical values of all world countries related to GDP Per Capita. The chart employs linear axis scale, item images (flags), measure description and 2 seconds transition time.

Note: Use Play/Pause to control the animation or click on the time axis to jump to a specific period. Learn more about all Animated Bar Chart Features.

HTML/JavaScript Code

The HTML elements and JavaScript code used in this example.

...
<div id="chartDiv"></div>
...

function showChart() {
    let config = {
        title: "World GDP Per Capita Historical Values",
        width: "800",
        height: "600",
        numberOfDecimals: 2,
        thousandsSeparator: ".",
        decimalSeparator: ",",
        transitionTime: 2,
        countryFlags: true,
        measures: [{ title: "GDP Per Capita", prefix: "$", description: "GDP per capita is the sum of gross value added by all resident producers in the economy plus any product taxes (less subsidies) not included in the valuation of output, divided by mid-year population." }],
        dataCSVURL: "/charts/examples/world-gdp.csv"
    }

    kyubitTimeCharts.showBarChart("chartDiv", config);
}

Learn more about Animated Bar Chart API.

Chart Data

All values for this animated bar chart example are stored in the World-gdp.csv file.