html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

​

    // create a data set

    var data = anychart.data.set([

      ["John", 1300, 1000, 1800],

      ["Larry", 1500, 1200, 2100],

      ["Marta", 1800, 1100, 1300]

    ]);

​

    // map the data

    var seriesData1 = data.mapAs({x: 0, value: 1});

    var seriesData2 = data.mapAs({x: 0, value: 2});

    var seriesData3 = data.mapAs({x: 0, value: 3});

​

    // create a chart

    var chart = anychart.column();

​

    // create series, set the data and names

    var series1 = chart.column(seriesData1);

    var series2 = chart.column(seriesData2);

    var series3 = chart.column(seriesData3);

    series1.name("2016");

    series2.name("2017");

    series3.name("2018");

​

    // enable the legend

    var legend = chart.legend();

    legend.enabled(true);

​

    // set the layout of the legend

    legend.itemsLayout("vertical");

​

    // set the position of the legend

    legend.position("right");

​

    // create an array for storing legend items

    var legendItems = [];

​

    // push legend items to the array

    for (var i = 0; i < chart.getSeriesCount(); i++) {

        var series = chart.getSeriesAt(i);

        for (var k = 0; k < series.data().getRowsCount(); k++) {

          legendItems.push({

            text: series.name() + ": " + data.data()[k][0] + 

                  " - $" + data.data()[k][i + 1],

            iconType: "square",

            iconFill: series.color()

          });

        }

    }

​

    // add custom legend items

    legend.items(legendItems);

​

    // set the chart title

    chart.title("Custom Legend Items");

​

    // set the container id

    chart.container("container");

​

    // initiate drawing the chart

    chart.draw();

});