html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function() {

​

  var color1 = "#FF0000";

  // Variable for controlling color darkness

  var colorIndex = 0;

  // color darken function

  function colorizer(){

    var mixColor1 = anychart.color.darken(color1, colorIndex);

    colorIndex = colorIndex + 0.2;

    return mixColor1;

  }

  // data and fill color settings

  var data = anychart.data.set([

    {x: "P1", value: 10000, fill: (colorizer())},

    {x: "P2", value: 12000, fill: (colorizer())},

    {x: "P3", value: 18000, fill: (colorizer())},

    {x: "P4", value: 13000, fill: (colorizer())},

    {x: "P5", value: 9000, fill: (colorizer())},

  ]);

  // chart type

  var chart = anychart.column();

  chart.title("Darken Colors Sample");

​

​

  // set data and set additional information in tooltip

  var series = chart.column(data);

  series.stroke(null);

  var tooltip = series.tooltip();

  tooltip.format(function(){

    var mixColor2 = anychart.color.darken(color1, (this.index * 0.2));

    return "Input Color: " + color1 +

      "\nDarken Ratio: " + this.index * 2 / 10 +

      "\nResult: " + mixColor2;

  });

  // draw

  chart.container("container");

  chart.draw();

});