Congratulations! You found a bug in the API (see it reproduced here: http://jsfiddle.net/asgallant/k2FQt/). You can temporarily work around the bug by turning off animations when moving from a chart with 2 vAxes to a chart with only 1.
I filed a bug report on this here<http://code.google.com/p/google-visualization-api-issues/issues/detail?id=1044> . On Wednesday, October 3, 2012 2:30:10 PM UTC-4, Kyle Howe wrote: > > I am a bit of a newbie to Javascript, JQuery and web development in > general and have come upon an error which I can't find the solution to. > > I have a database that contains a bunch of meteorological data which is > continually being updated. On the webpage, I have given the user the > option to select the parameter to display along with the month, day and > year. When they click on a button, I use Ajax to call a second php file > which contains code to query a mySQL database and send the data back to the > webpage for display. The chart is updated and animates to show the new > selected data. All of the data is displayed as a standard line chart with > a single y-axis except for precipitation. > > On the precipitation graph, I have a secondary y-axis that is generated to > show the cumulative precipitation in addition to the hourly precipitation. > The transition from a parameter to precipitation works perfectly and the > chart is redrawn correctly with a secondary axis. > > The error occurs when the user is viewing the precipitation graph and then > selects another parameter (the chart is forced to go from 2 y-axes to 1 > y-axis)...or at least I think this is where the error is happening. The > chart displays "Cannot read property 'type' of undefined". If the user > clicks the update button a second time, the chart will display the correct > data, but no transition animation occurs. Are there certain variables that > I need to clear or is this an issue with Javascript? > > <https://lh3.googleusercontent.com/-HTbr5AT0ZK8/UGyC7Yx57XI/AAAAAAAACu4/KqIFE07tClM/s1600/CropperCapture%5B30%5D.png> > > Here is the Ajax that is executed on button click: > > var button_submission = document.getElementById('submission'); > button_submission.onclick = function(){ > //Set the variables to the dropdown selections. These are sent to > //the php script to query the database. > dropdown_type = $('#dropdown_type').val() > dropdown_month = $('#dropdown_month').val() > dropdown_day = $('#dropdown_day').val() > dropdown_year = $('#dropdown_year').val() > dropdown_station = $('#dropdown_station').val() > display_type = $('#display_type').val() > display_period = $('#time_period').val() > //The ajax call to the php function. > $.ajax({ > url: "DataRequest_v3.php", > type: "POST", > data: ({MonitorVar: dropdown_type, > Month: dropdown_month, > Day: dropdown_day, > Year: dropdown_year, > Station: dropdown_station, > Period: display_period}), > dataType:"text", > success: function(data){ > data_split=data.split("SPLITHERE"); > encoded_chart = new google.visualization.DataTable(data_split[0]) > encoded_table = new google.visualization.DataTable(data_split[1]) > switch(dropdown_type){ > case 'Rain_Tot': > options = { > > hAxis: {title: "Date"}, > series: [ > {targetAxisIndex:0}, > {targetAxisIndex:1}], > vAxes: [ > {title:"Hourly Precipitation (mm)"}, > {title:"Cummulative Precipitation (mm)"}], > colors:['blue','green'], > animation:{ > duration: 1000, > easing: 'out' > } > }; > break > default: > options = { > vAxis: {title: "Y-Value"}, > hAxis: {title: "Date"}, > series: {targetAxisIndex:0}, > colors: ['blue'], > animation:{ > duration: 1000, > easing: 'out' > } > }; > break > } > > drawTemperature(); > drawTable(); > }}); > } > > Please excuse the sloppy coding I am still learning :) > > I can post the "DataRequest_v3.php" if people need it but all it does is > query a database and it works fine. I hope this all makes sense! > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/pYeGpYXiWJMJ. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.
