Cryptocurrency 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 a logarithmic axis scale.

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: "Cryptocurrency History",
        width: "800",
        height: "600",
        numberOfDecimals: 2,
        thousandsSeparator: ".",
        decimalSeparator: ",",
        transitionTime: 2,
        logarithmicXaxis: true,
        logarithmicYaxis: true,
        circleBorder: true,
        measures: [{ title: "Price", prefix: "$" }],
        dataCSVURL: "/charts/examples/cryptocurrency-historical-price.csv",
    }

    config.width = document.getElementById("chartDiv").clientWidth;
    config.height = document.getElementById("chartDiv").clientWidth * 0.6;

    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 Cryptocurrency-historical-price.csv file.