Fertility Rate Historical Values Race to the Top with Animated Bar Chart

An Animated Bar Chart is used to visualize the historical values of World Fertility Rate Top between 1950 and 2021. The chart show top 20 countries by fertility rate for each year.

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 = {
        let config = {
            title: "World Fertility Rate Historical Values 1950 - 2021",
            width: "800",
            height: "600",
            darkMode: true,
            numberOfDecimals: 2,
            thousandsSeparator: ".",
            decimalSeparator: ",",
            transitionTime: 3,
            maxItemsPerTransition: 12,
            countryFlags: true,
            measures: [{ title: "Fertility Rate" }],
            dataCSVURL: "/charts/examples/world-fertility-gdp-population.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-fertility.csv file.