I will try that so. Thanks very much for your help Daniel.
On Monday, 29 June 2015 17:31:31 UTC+1, Daniel LaLiberte wrote: > > It sounds like something outside of Google Charts is causing the displayed > chart to disappear after it has been drawn, because the only way Google > Charts would clear the chart is if you call clearChart(), or perhaps if you > draw again with bad data or options that cause a problem. Perhaps you need > to delay drawing the chart initially in the first tab until after some > other initialization of the tab is done. To find out what is causing the > clear, you should probably use a debugger to stop before the draw, step > over it to get it drawn, then step until the chart disappears. Hope that > helps. > > On Mon, Jun 29, 2015 at 12:13 PM, Aine Mitchell <[email protected] > <javascript:>> wrote: > >> It is a bit of a complicated one. >> >> >> >> This is all part of a web application. >> >> >> >> The application allows the user to select some parameters, they click >> submit and the charts are drawn. >> >> >> >> I have two scenarios: >> >> >> >> 1. I am rendering the charts in a number of tabs using Richfaces >> <rich:tabPanel >> >> There is an ontabenter event from which I call my javascript function to >> draw the chart >> >> >> >> e.g. <rich:tab label="My Tab" ….. >> ontabenter="createHitRatioChartData();”> >> >> >> >> <a4j:jsFunction name="createHitRatioChartData" >> oncomplete="drawHitRatioChart(#{behaviourAnalysisToolSession.behaviourChartData.hitRatioString});" >> >> immediate="true"> >> >> </a4j:jsFunction> >> >> >> >> >> >> The <a4j:jsFunction calls the javascript as above. >> >> >> >> This working fine and the charts are displayed and I am not using a >> callback here. >> >> >> >> >> >> 2. Unfortunately this will not work for the first tab - I want to >> load the charts here when the tab is loaded and ontabenter only fires >> when the tab is actually clicked on. >> >> >> >> So I have been trying to call the same <a4j:jsFunction from my submit >> button. >> >> >> >> <a4j:commandButton oncomplete="createHitRatioChartData();" >> >> >> >> However when I do it this way the charts appear for a moment then >> disappear. >> >> >> >> >> >> Any ideas you might have would be great. >> >> >> >> Thanks again. >> >> >> On Monday, 29 June 2015 16:38:58 UTC+1, Daniel LaLiberte wrote: >>> >>> Hi Aine, >>> >>> The code you copied isn't showing what you are doing with loading and >>> calling your chart drawing function after the ajax call. If you want to >>> copy more of your code, or better, point to a page running your code, then >>> we can tell what you are doing and what the problems might be. >>> >>> Generally, loading the visualization library takes some time, and you >>> have to use a callback to do the next thing that depends on the >>> visualization library. If you are calling google.load() when the page >>> first loads, then you can also call google.setOnLoadCallback() to draw your >>> chart. But since you also need to wait for the ajax call to finish, you >>> have to wait for two things. It's simpler if you can chain things so your >>> callback function is called first, at which time you can make your ajax >>> call to get your data and then draw the chart. >>> >>> On Mon, Jun 29, 2015 at 9:02 AM, Aine Mitchell <[email protected]> >>> wrote: >>> >>>> Hi, >>>> >>>> >>>> >>>> I am having an issue with my Google charts using an Ajax request to >>>> fetch the chart data. >>>> >>>> >>>> >>>> Through debugging the code I can see the Javascript function which >>>> draws my chart is being called. >>>> >>>> >>>> >>>> The issue is the chart appears for a few seconds then disappears. >>>> >>>> >>>> >>>> From looking through the forum I am thinking it is some kind of issue >>>> with how the Google charts library is loaded. >>>> >>>> >>>> >>>> I am loading the library and calling the Javascript function which >>>> draws the chart after the Dom has completely loaded. >>>> >>>> >>>> >>>> Could you perhaps give me some tips on what is the best way to debug >>>> this situation? >>>> >>>> >>>> >>>> Any assistance you could give me would be much appreciated. >>>> >>>> >>>> Below is a quick example of my chart script >>>> >>>> >>>> >>>> Many thanks. >>>> >>>> Aine >>>> >>>> >>>> >>>> <script type="text/javascript"> >>>> >>>> >>>> google.load("visualization", "1", >>>> {packages:["corechart","gauge"]}); >>>> >>>> function drawHitRatioChart(dataPoints) { >>>> >>>> var data = google.visualization.arrayToDataTable([ >>>> ['Label', 'Value'], >>>> ['Hit Ratio', {v: 50, f: ''}] >>>> ]); >>>> >>>> var options = { >>>> width: 450, height: 140, >>>> redFrom: 0, redTo: dataPoints, redColor: >>>> "#C1DAD6", >>>> yellowFrom: dataPoints, yellowTo: 100, >>>> yellowColor: "#ACD1E9", >>>> minorTicks: 10, >>>> max: 100 >>>> >>>> }; >>>> >>>> var chart = new >>>> google.visualization.Gauge(document.getElementById('hitRatioGraph')); >>>> >>>> chart.draw(data, options); >>>> } >>>> >>>> >>>> } >>>> >>>> -- >>>> 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. >>>> >>> >>> >>> >>> -- >>> Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> >>> - 978-394-1058 >>> [email protected] 5CC, Cambridge MA >>> [email protected] 9 Juniper Ridge Road, Acton MA >>> >> -- >> 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] >> <javascript:>. >> To post to this group, send email to [email protected] >> <javascript:>. >> Visit this group at >> http://groups.google.com/group/google-visualization-api. >> For more options, visit https://groups.google.com/d/optout. >> > > > > -- > Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> > - 978-394-1058 > [email protected] <javascript:> 5CC, Cambridge MA > [email protected] <javascript:> 9 Juniper Ridge Road, Acton MA > -- 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.
