Google Graph API custom tooltip
I am trying to replicate the default tooltip style used by the Google Graph API:
Specifically offsetting some text as shown above. Once I add my own tooltip, I can no longer highlight the bold parts of the text like in the default view.
The label tooltip.textStyle
offers only one color change option for all displayed text {color: <string>, fontName: <string>, fontSize: <number>}
.
Any ideas?
source to share
The default view is bold, but custom tooltips are not.
Depending on the type of chart, you can enable HTML hints and use them to customize the format, as described here . This will work for:
- AreaChart
- BarChart
- Japanese candles
- ColumnChart
- ComboChart
- LineChart
- ScatterChart
Difficult to set up, but it allows you to display tooltips as flexibly as possible.
source to share
According to: @jmac's answer, it's easy. But if you can't make a bold font (according to the Google Charts Docs) then define your own font family, like so:
function createCustomHTMLContent(date, label, value) {
return '<div style=" font-family:Arial; /* other styles... */">' +
'<div><b>' + date + '</b></div>'+
'<div><b>' + label + ':</b> ' + value + ' </div>'+
' </div>'
}
I can't find solutions for a long time, and after installing the font family proxy everything works :)
source to share