html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

  // create a preloader

  preloader = anychart.ui.preloader();

  // cover only chart container

  preloader.render(document.getElementById("container"));      

  // show preloader

  preloader.visible(true);

​

  var chart = anychart.pie([

    ["Chocolate", 5],

    ["Rhubarb compote", 2],

    ["Crêpe Suzette", 2],

    ["American blueberry", 2],

    ["Buttermilk", 1]

  ]);

  chart.title("Top 5 pancake fillings");

  chart.container("container");

  chart.draw();

​

  setTimeout(function() { 

    // hide preloader after 20 seconds

    preloader.visible(false);

    }, 20000)

});