Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

can't hide the tooltip (equation) on the trendline on a google chart

can you please help me hide the tooltip (equation) on the trendline on the google chart on this page ?

Thanks

Here are the chart options I am using :

var options = {
        title: 'Weight of pro surfer vs. Volume of his pro model',
        hAxis: {title: 'Weight (kg)', minValue: 53, maxValue: 100}, //55
        vAxis: {title: 'Volume (l)'}, //, minValue: 20, maxValue: 40},   //20
        legend: 'none',
           colors: ['#000000'],
           series: {
                  1: { color: '#06b4c8' }, 
                  2: { color: '#575e6a' }
              },
        legend: {position: 'top right', textStyle: {fontSize: 8}},
        chartArea: {width: '60%'},
        //tooltip:{trigger:'none'}, //it hides all tooltips on the whole graph
        trendlines: { 0: {//type: 'exponential',
                    visibleInLegend: true,
                    color: 'grey',
                    lineWidth: 2,
                    opacity: 0.2,
                    tooltip:{trigger:'none'}, //does nothing
                    labelInLegend: 'Linear trendline\n(Performance)'
                    } 
                }    // Draw a trendline for data series 0.
    };

If I add tooltip:{trigger:'none'}, before trendlines it hides the tooltips of the whole graph.

like image 259
Louis Avatar asked Oct 23 '14 17:10

Louis


2 Answers

It has been implemented but not documented yet:

trendlines: {0: {tooltip: false}}
like image 120
Martin Avatar answered Oct 14 '22 07:10

Martin


Only solution I was able to make is replacing the text of the tooltips from trendline. This example makes use of jquery, so if you are able to use jquery you can use:

      google.visualization.events.addListener(chart, 'onmouseover', function(e){
          $('svg *:contains("* x")').each(function(){
              $(this).text('')
          })
      })

If not, it should be possible to replicate with pure js, but that´s the main idea: find the tooltips that have the formula attached, and replace the text with nothing

Here is a working example: http://jsfiddle.net/juvian/aapdjbpt/

like image 39
juvian Avatar answered Oct 14 '22 09:10

juvian