html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

    var stage = anychart.graphics.create('container');

​

    var rect = stage.rect(0, 0, stage.width(), stage.height());

    rect.fill('#2BC0E4');

​

    var chart = anychart.column([

        {x: 'John', value: 10000},

        {x: 'Jake', value: 12000},

        {x: 'Peter', value: 18000},

        {x: 'James', value: 11000},

        {x: 'Mary', value: 9000}

    ]);

​

    chart.margin('15%');

    chart.background('#EAECC6');

​

    var tooltip = chart.tooltip();

​

    // Let tooltips to leave the screen bounds.

    tooltip.allowLeaveScreen(true);

​

    // Let tooltips to leave the stage bounds.

    tooltip.allowLeaveStage(true);

​

    // Let tooltips to leave the chart bounds.

    tooltip.allowLeaveChart(true);

​

    var series = chart.getSeries(0);

    series.tooltip().format('This tooltip can be demonstrated out of the chart, stage, screen, if this becomes necessary to show it all');

​

    chart.title('Tooltips can leave the chart, the stage and the screen bounds');

    chart.container(stage);

    chart.draw();

});