This is still not working. I have tried with the above solution. Not helpful. Spent so much time on this. Feels like google google chart is not good. Anybody got solution for this or any other good diff charts? Help me please
On Monday, August 1, 2016 at 11:21:52 PM UTC+5:30, Chad Geary wrote: > > Would it be possible to see these lines in context with the rest of the > chart script/HTML? > > I'd like to adopt this fix, this is what I've setup (everything is fine > otherwise) - I'm just not seeing the changes to the 'Previous data' > label(s): > > > <html> > <head> > <!--Load the Ajax API--> > <script type="text/javascript" src=" > https://www.gstatic.com/charts/loader.js"></script> > <script type="text/javascript" src=" > https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js > "></script> > <script type="text/javascript"> > > google.charts.load('current', {packages:['corechart']}); > google.charts.setOnLoadCallback(drawChart); > > function drawChart() { > var totalData = new google.visualization.DataTable(<?php echo > $jsonTableTotal; ?>); > var leasedData = new google.visualization.DataTable(<?php echo > $jsonTableLeased; ?>); > > var colChartDiff = new > google.visualization.ColumnChart(document.getElementById('colchart_diff')); > > var options = {title: '<?php echo 'IP utilization per service in > latest poll period. \nNote - Previous data represents total available > addresses.\nRouter - ' . htmlspecialchars($_GET["router"]);?>', > diff: { newData: { widthFactor: 0.8 } }, > hAxis: { title: 'Leased within Total per Service' }, > chartArea: {'width': '70%', 'height': '70%'}, > fontSize: 13, > fontName: 'Calibri'}; > > var diffData = colChartDiff.computeDiff(totalData, leasedData); > colChartDiff.draw(diffData, options); > > google.visualization.events.addListener(colChartDiff, > 'onmouseover', function (rowColumn) { > selectHandler(); > }); > > $("text").each(function () { > if ($(this).text() == "Previous data") { > $(this).text('Proper text'); > } > > }); > > > function selectHandler() > { > $('#colChartDiff').on('DOMNodeInserted', function (e) { > > if ($(e.target).is('.google-visualization-tooltip')) { > { > // now you will have access to the "tooltip" > // and can do the needed changes > > } > } > }); > } > > > > > } > > </script> > </head> > > <body> > <!--this is the div that will hold the chart--> > > <span id='colchart_diff' style='width: 1600px; height: 900px; display: > inline-block'></span> > > </body> > </html> > > > > > On Tuesday, May 17, 2016 at 3:33:55 PM UTC-4, [email protected] wrote: >> >> I had to do a couple of things to fix this issue: >> >> 1) Put mouseover event on chart with a function called "selectHandler" >> google.visualization.events.addListener(barChartDiff, 'onmouseover', >> function (rowColumn) { >> selectHandler(); >> }); >> >> 2) After I fixed initiated the grids I used some JQuery selector on the >> "text" element >> $("text").each(function () { >> if ($(this).text() == "Previous data") { >> $(this).text('Proper text'); >> } >> >> }); >> >> 3) Create a function to trigger when a new element is interested in the >> chart div or "barchart_diff" >> >> function selectHandler() >> { >> $('#barchart_diff').on('DOMNodeInserted', function (e) { >> >> if ($(e.target).is('.google-visualization-tooltip')) { >> { >> // now you will have access to the "tooltip" >> // and can do the needed changes >> >> } >> } >> }); >> } >> >> Hope this helps. >> >> Drew >> >> On Thursday, December 5, 2013 at 4:41:39 AM UTC-5, Niko Moilanen wrote: >>> >>> How you can replace those "Current" & "Previous" labels by more >>> informatic ones? >> >> -- 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 https://groups.google.com/group/google-visualization-api. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/17b014b4-b742-497d-b7cb-3e9c34ab7a76%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
