<div id="container"></div>
html, body, #container {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
.anychart-tooltip {
border-radius: 23px;
background: rgba(255, 160, 0, 0.7);
font-family: Courier, Helvetica, Arial, 'sans-serif';
.anychart-tooltip-separator {
height: 3px;
background-color: rgba(221, 44, 0, 0.7);
.anychart-tooltip-title{
font-size: 28px;
anychart.onDocumentReady(function () {
// create a data set
var data = [
["John", 10000],
["Jake", 12000],
["Peter", 18000],
["James", 11000],
["Mary", 9000]
];
// create a chart and set the data
var chart = anychart.column(data);
// set the chart title
chart.title().useHtml(true);
chart.title("Tooltip: HTML (CSS Classes)<br><br><span style='font-style:italic'>Sales</span>");
// configure tooltips
chart.tooltip().useHtml(true);
chart.tooltip().format("{%value}");
// set the container id
chart.container("container");
// initiate drawing the chart
chart.draw();
});