html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

​

    // create data

    var data = [

    {

        "metric_value": "100.0",

        "metric_name": "Calories",

        "day": "2022-10-10"

    },

    {

        "metric_value": "970.0",

        "metric_name": "Calories",

        "day": "2022-12-15"

    },

    {

        "metric_value": "450",

        "metric_name": "Calories",

        "day": "2022-12-18"

    },

    {

        "metric_value": "420",

        "metric_name": "Calories",

        "day": "2022-12-19"

    },

    {

        "metric_value": "700",

        "metric_name": "Calories",

        "day": "2023-01-17"

    },

    {

        "metric_value": "212",

        "metric_name": "Calories",

        "day": "2023-01-20"

    },

    {

        "metric_value": "200",

        "metric_name": "Calories",

        "day": "2023-01-23"

    },

    {

        "metric_value": "198",

        "metric_name": "Calories",

        "day": "2023-01-28"

    },

    {

        "metric_value": "100",

        "metric_name": "Calories",

        "day": "2023-02-13"

    },

    {

        "metric_value": "252",

        "metric_name": "Calories",

        "day": "2023-02-21"

    },

    {

        "metric_value": "58",

        "metric_name": "Calories",

        "day": "2023-04-28"

    },

    {

        "metric_value": "100",

        "metric_name": "Calories",

        "day": "2023-05-10"

    },

    {

        "metric_value": "691",

        "metric_name": "Calories",

        "day": "2023-05-16"

    },

    {

        "metric_value": "695",

        "metric_name": "Calories",

        "day": "2023-05-17"

    },

    {

        "metric_value": "85",

        "metric_name": "Calories",

        "day": "2023-05-18"

    },

    {

        "metric_value": "225",

        "metric_name": "Calories",

        "day": "2023-05-19"

    }

]

​

    // create a chart

    var chart = anychart.column();

    dataSet = anychart.data.set(data);

    const dataSetmap = dataSet.mapAs({x: 'day', value: 'metric_value'});

​

    chart.data(dataSetmap);

    chart.stick(dataSetmap)

    chart.xScroller(true);

​

    const dateTimeScale = anychart.scales.dateTime();

    chart.xScale(dateTimeScale);

​

    // set the container id

    chart.container("container");

​

    // initiate drawing the chart

    chart.draw();

});