Here's a jsfiddle: http://jsfiddle.net/ovxLjqyn/
On Thu Feb 05 2015 at 11:01:58 AM Tong Sun <[email protected]> wrote: > Thanks. I've altered my starter code to use the CoreCharts instead: > > > ``` > <html> > <head> > <!--Load the AJAX API--> > <script type="text/javascript" src="https://www.google.com/jsapi > "></script> > <script type="text/javascript"> > // Load the Visualization API > google.load("visualization", '1.1', {packages:['corechart']}); > google.setOnLoadCallback(drawStuff); > > function drawStuff() { > var data = new google.visualization.arrayToDataTable([ > ['Galaxy', 'V1', 'T1', 'V2', 'T2'], > ['Canis Major Dwarf', 8000, 23.3, 8000, 23.3], > ['Sagittarius Dwarf', 24000, 4.5, 24000, 4.5], > ['Ursa Major II Dwarf', 30000, 14.3, 30000, 14.3], > ['Lg. Magellanic Cloud', 50000, 0.9, 50000, 0.9], > ['Bootes I', 60000, 13.1, 60000, 13.1] > ]); > > var options = { > width: 900, > chart: { > title: 'Tooltip Demo', > subtitle: 'every data column having a tooltip of its own' > } > }; > > var chart = new > google.visualization.ColumnChart(document.getElementById('tooltip_div')); > chart.draw(data, options); > }; > </script> > </head> > <body> > <div id="tooltip_div" style="width: 900px; height: 500px;"></div> > </body> > </html> > ``` > > Can somebody help me turn the T1/T2 to be tooltips for V1/V2 please? > > Thanks > > > On Thu, Feb 5, 2015 at 10:48 AM, 'Sergey Grabkovsky' via Google > Visualization API <[email protected]> wrote: > >> Hi Tong, >> >> Custom tooltips are not yet supported for the Material Charts. If you >> want this feature, you should use the CoreCharts. >> >> On Thu Feb 05 2015 at 10:31:48 AM Tong Sun <[email protected]> wrote: >> >>> >>> >>> On Thursday, February 5, 2015 at 12:21:03 AM UTC-5, Tong Sun wrote: >>>> >>>> >>>> >>>> On Sunday, November 17, 2013 at 11:21:25 PM UTC-5, asgallant wrote: >>>>> >>>>> If you want custom tooltips to apply to all columns, you will need to >>>>> do one of two things: either add a tooltip column after every data column >>>>> you want a custom tooltip for, or use a DataView to create custom tooltip >>>>> columns for every data column you want a custom tooltip for. >>>>> >>>> >>>> Now all I need to do is make a method that will popular >>>>> setColumnProperty the correct amount of times depending on how many >>>>> columns >>>>> I have. >>>> >>>> >>>> I'm still having problem turning above into actual code. >>>> Could somebody post a working demo please? I need every data column >>>> having a tooltip of its own from the corresponding tooltip data column >>>> please. >>>> >>> >>> To help you start easier please start from the following code: >>> >>> ``` >>> <html> >>> <head> >>> <script type="text/javascript" src="https://www.google.com/jsapi >>> "></script> >>> <script type="text/javascript"> >>> google.load("visualization", "1.1", {packages:["bar"]}); >>> google.setOnLoadCallback(drawStuff); >>> >>> function drawStuff() { >>> var data = new google.visualization.arrayToDataTable([ >>> ['Galaxy', 'V1', 'T1', 'V2', 'T2'], >>> ['Canis Major Dwarf', 8000, 23.3, 8000, 23.3], >>> ['Sagittarius Dwarf', 24000, 4.5, 24000, 4.5], >>> ['Ursa Major II Dwarf', 30000, 14.3, 30000, 14.3], >>> ['Lg. Magellanic Cloud', 50000, 0.9, 50000, 0.9], >>> ['Bootes I', 60000, 13.1, 60000, 13.1] >>> ]); >>> >>> var options = { >>> width: 900, >>> chart: { >>> title: 'Tooltip Demo', >>> subtitle: 'every data column having a tooltip of its own' >>> } >>> }; >>> >>> var chart = new >>> google.charts.Bar(document.getElementById('tooltip_div')); >>> chart.draw(data, options); >>> }; >>> </script> >>> </head> >>> <body> >>> <div id="tooltip_div" style="width: 900px; height: 500px;"></div> >>> </body> >>> </html> >>> ``` >>> >>> Thanks a lot! >>> >> -- > You received this message because you are subscribed to the Google Groups > "Google Visualization API" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To post to this group, send email to > [email protected]. > Visit this group at > http://groups.google.com/group/google-visualization-api. > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
