CODEWITHSUNDEEP
javascriptjquerychartsgoogle-visualizationtooltip
Albion
Albion

Reputation: 31

how to change font size of Google Chart Tooltip

How do i change the font size Google Chart Tooltip? [ This is what i tried so far: https://jsfiddle.net/Albion87/ujpv8oep/3/ ] These are the set options that i have ..

// Set chart options
var options = {
    isStacked: true,
    tooltip: { textStyle: { fontName: 'verdana', fontSize: 7 } },       
    width: 800,
    height: 600,
    chart: {
        title: 'Year-by-year coffee consumption',
        subtitle: 'This data is not real'
    },      
    vAxis: {
        viewWindow: {
            min: 0,
            max: 100
        }
    },
    legend: { position: 'left', alignment: 'start' },
    series: {
        2: {
            targetAxisIndex: 1
        },
        3: {
            targetAxisIndex: 1
        }
    },
    backgroundColor: {fill: 'transparent'},
    chartArea: {
      backgroundColor: 'transparent'
    }
};

enter image description here

Upvotes: 2

Views: 2879

Answers (1)

WhiteHat
WhiteHat

Reputation: 61232

the problem is material chart...

there are several options that simply do not work with material charts,
including... 

tooltip.isHtml
tooltip.showColorCode
tooltip.textStyle
tooltip.trigger

see --> Tracking Issue for Material Chart Feature Parity #2143

recommend trying core chart with following option... 

theme: 'material'

material chart --> google.charts.Bar -- packages: ['bar']

core chart --> google.visualization.ColumnChart -- packages: ['corechart']

Upvotes: 0

Related Questions