Usually it's necessary to show additional information about chart items. It is possible to set labels for this purpose. However, if a text is rather long, you can use tooltips.
Tooltips are defined by the 'tooltip' property. You need to define a template for the tooltip in the following way:
var chart = new dhtmlXChart({ view:"bar", container:"chart_container", value:"#sales#", tooltip:"#details#" });
Also it is possible to set the tooltip position - an offset from the mouse cursor position (by default, top offset is 0, left is 20)
var chart = new dhtmlXChart({ view:"bar", container:"chart_container", value:"#sales#", tooltip:{ template:"#details#", dx:10, dy:5 } });
The style of tooltip can be defined right in the template:
var chart = new dhtmlXChart({ ... tooltip:"<span style='color:#293CD6'>#details#</span>" });
Also you may define the dhx_tooltip CSS class:
.dhx_tooltip{ font-family:Tahoma; font-size:8pt; background-color:white; padding:2px 2px 2px 2px; border:1px solid #A4BED4; }
Back to top