html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function() {

​

  var color1 = [255, 0, 0];

  var color2 = [0, 0, 255];

  // Variable for controlling color blend

  var colorIndex = 0;

  // color blending function

  function colorizer(){

    var mixColor1 = anychart.color.blend(color1, color2, 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("Blend 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.blend(color1, color2, (this.index * 0.2));

    return "Input Color: " + color1 +

      "\nBlend Color: " + color2 +

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

      "\nResult: " + mixColor2.color;

  });

  // draw

  chart.container("container");

  chart.draw();

});