5

I have a Google LineChart with multiple lines. These points do not share the same X value's so i have to format my data in a certain way to make it work:

var data = google.visualization.arrayToDataTable([
        ["Y", "Your X & Y", "Product 1", "Product 2", "Product 3"],
        [419, 589, null, null, null],
        [386, null, 504, null, null],
        [386, null, 526, null, null],
        [387, null, 543, null, null],
        [395, null, 564, null, null],
        [402, null, 591, null, null],
        [408, null, 612, null, null],
        [378, null, null, 501, null],
        [398, null, null, null, 600],
        [460, null, null, null, 500]
    ]);

Now i want to add custom tooltips to these lines, i've tried adding an extra column and setting the role to tooltip.. but this only affects the first line.

see both charts (with and without tooltip): http://jsfiddle.net/TD92C/8/

How do i add custom tooltips for all lines? Thanks

SOLVED: http://jsfiddle.net/asgallant/TD92C/14/

juniperi
  • 3,723
  • 1
  • 23
  • 30
user3078654
  • 51
  • 1
  • 4

1 Answers1

0

you have to make your variable like this

var data = google.visualization.arrayToDataTable([
//Columns

    ["Y", //Name  of the X-axis marker
    "Your X & Y",{type: 'string', role: 'tooltip'},
    "Product 1",{type: 'string', role: 'tooltip'},
    "Product 2",{type: 'string', role: 'tooltip'},
    "Product 3",{type: 'string', role: 'tooltip'},],
//Rows
//Add tooltip column after every value in each row

    [419,589,"tooltip info about your x & y",null,'',null,'',null,''],
    [386,null,'',504,'','Custom Tooltip',null,'',null,''],
    [386,null,'',526,'Custom Tooltip',null,'',null,''],
    [387,null,'',543,'Custom Tooltip',null,'',null,''],
    [378,null,'',null,'',501,'Custom Tooltip',null,''],
    [383,null,'',null,'',511,'Custom Tooltip',null,''],
    [368,null,'',null,'',null,'',526,'Custom Tooltip'],
    [373,null,'',null,'',null,'',547,'Custom Tooltip'],
]);

Fiddle Data is looking different but if you correct the first element to a string which is exactly as the columns displayed in 1st column index it will be correct

Alex
  • 457
  • 3
  • 16