Are you running this from your local machine or a webserver? If it's your local machine, you need to add "http:" to the jQuery script's url.
On Saturday, May 18, 2013 1:45:24 AM UTC-4, Zoro Swordsman wrote: > > is it add like this (the one that i highlighted with red)? but i tried and > still not working.. may i know why? > > <html xmlns="http://www.w3.org/1999/xhtml";> > <head> > <meta http-equiv="content-type" content="text/html; charset=utf-8"/> > <title> > Google Visualization API Sample > </title> > <style> > #tooltip { > display: none; > position: absolute; > height: 2.5em; > width: 60px; > background-color: #FFFFFF; > padding-left: 5px; > } > #tooltipTopLine { > font-weight: bold; > } > #tooltipBottomLine { > } > </style> > > <script type="text/javascript" src="http://www.google.com/jsapi > "></script> > *<script src="// > ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>* > <script type="text/javascript"> > google.load('visualization', '1', {packages: ['treemap']}); > var gDataXMLservcost = null; // your data here > </script> > <script type="text/javascript"> > > function drawVisualization() { > // Create and populate the data table. > var data = google.visualization.arrayToDataTable([ > ['Location', 'Parent', 'Market trade volume (size)', 'Market > increase/decrease (color)'], > ['Global', null, 0, > 0], > ['America', 'Global', 0, > 0], > ['Europe', 'Global', 0, > 0], > ['Asia', 'Global', 0, > 0], > ['Australia', 'Global', 0, > 0], > ['Africa', 'Global', 0, > 0], > ['Brazil', 'America', 11, > 10], > ['USA', 'America', 52, > 31], > ['Mexico', 'America', 24, > 12], > ['Canada', 'America', 16, > -23], > ['France', 'Europe', 42, > -11], > ['Germany', 'Europe', 31, > -2], > ['Sweden', 'Europe', 22, > -13], > ['Italy', 'Europe', 17, > 4], > ['UK', 'Europe', 21, > -5], > ['China', 'Asia', 36, > 4], > ['Japan', 'Asia', 20, > -12], > ['India', 'Asia', 40, > 63], > ['Laos', 'Asia', 4, > 34], > ['Mongolia', 'Asia', 1, > -5], > ['Israel', 'Asia', 12, > 24], > ['Iran', 'Asia', 18, > 13], > ['Pakistan', 'Asia', 11, > -52], > ['Egypt', 'Africa', 21, > 0], > ['S. Africa', 'Africa', 30, > 43], > ['Sudan', 'Africa', 12, > 2], > ['Congo', 'Africa', 10, > 12], > ['Zair', 'Africa', 8, > 10] > ]); > > // Create and draw the visualization. > var treemap = new > google.visualization.TreeMap(document.getElementById('visualization')); > google.visualization.events.addListener(treemap, 'onmouseover', function > (e) { > var provider = data.getValue(e.row, 1); > var totalService = data.getValue(e.row, 2); > // populate the tooltip with data > $('#tooltipTopLine').html(provider); > $('#tooltipBottomLine').html(totalService); > // show the tooltip > $('#tooltip').show(); > }); > google.visualization.events.addListener(treemap, 'onmouseout', function > (e) { > // hide the tooltip > $('#tooltip').hide(); > }); > treemap.draw(data, { > height: 400, > width: 600, > minColor: 'red', > midColor: '#ddd', > maxColor: '#0d0', > headerHeight: 15, > fontColor: 'black', > showScale: true, > showTooltips: false}); > } > > google.setOnLoadCallback(drawVisualization); > > // make the tooltip div follow the mouse > $(function () { > $('#visualization').mousemove(function (e) { > $('#tooltip').css({ > left: e.pageX, > top: e.pageY - 40 > }); > }); > }); > </script> > </head> > <body style="font-family: Arial;border: 0 none;"> > <div id="visualization" style="width: 600px; height: 400px;"></div> > <div id="tooltip"> <span id="tooltipTopLine"></span> > <br /> <span id="tooltipBottomLine"></span> > </div> > </body> > </html> > > > On Friday, May 17, 2013 6:45:07 PM UTC+8, Zoro Swordsman wrote: >> >> Hi, may I know can I show the value on the treemap? Just like a mouseover >> function on other google chart. Cos I saw on the sample at google >> playground, it only show the 'name' of that area instead of showing the >> 'value'. Can I know what is the coding? >> >> Thank you. >> > -- 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?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
