Hi Bryan, Well, the problem appears to be the startup animation. For BubbleChart, I had to do some special hacks to make it work at all, and they were not sufficient for your particular case. Disabling the startup animation allows the rest of your chart to be drawn, as you can see in this jsfiddle I made from your code: http://jsfiddle.net/dlaliberte/z9pzdykz/
Note that I disabled the toJSON() part, so it is using the original data from the spreadsheet as I believe you were also. Creating a new data table from the JSONified data does something potentially different, so that is a clue about a different problem I will also look into. Since the startup animation is a new feature that is broken (for BubbleChart), rather than a regression, I will probably not hold up the release for a fix, in which case you'll have to wait for the next release in another month to see the fix. I hope that doesn't spoil the purpose of your chart. Thanks for your help. On Wed, Jan 28, 2015 at 7:45 AM, <[email protected]> wrote: > > > On Wednesday, January 28, 2015 at 8:39:04 AM UTC, [email protected] > wrote: >> >> >> >> On Tuesday, January 27, 2015 at 10:34:38 PM UTC, Daniel LaLiberte wrote: >>> >>> Bryan, >>> >>> We do appreciate that you are testing with 1.1 so that we don't find out >>> about problems until it is too late - I'd much rather patch the ongoing >>> release than roll it back. >>> >>> If you can point to the page, we can figure out what data is given to >>> the chart. Or if you could change your code to make a call to >>> dataview.toDataTable().toJSON() to convert your data view into a data >>> table, and from there to a JSON string, dump it to the JS console and >>> copy/paste it into an email, we could look at it that way. >>> >>> It is possible the problem is in how the data view is used, however, so >>> we won't see an error just using the resulting data. So it would be best >>> if you could point us at the broken page so we can watch it in action. >>> >>> On Tue, Jan 27, 2015 at 3:48 PM, <[email protected]> wrote: >>> >>>> >>>> >>>> On Tuesday, January 27, 2015 at 3:14:42 PM UTC, Daniel LaLiberte wrote: >>>>> >>>>> Thanks for your compliments and bug report. >>>>> >>>>> I just tried bubble chart with 1.1 and it seems to work for me. I >>>>> modified the bubble chart example from the docs to load 1.1: >>>>> http://jsfiddle.net/dlaliberte/nw441j4c/ Does this work for you? If >>>>> it fails in the same way, which browser and platform are you using? If >>>>> this example works fine, then whatever you tried is using data or options >>>>> that cause a problem, so we would like to find out what it is. >>>>> >>>>> On Tue, Jan 27, 2015 at 2:48 AM, <[email protected]> wrote: >>>>> >>>>>> Just been using version 1.1 and there seems to be an error on the >>>>>> bubble charts - it throws up an error : >>>>>> >>>>>> undefined is not an object (evaluating 'glc)') >>>>>> >>>>>> when tryuing to draw the chart. >>>>>> >>>>>> works fine when I switch back to version 1 so its either a bug or its >>>>>> my error which is just showing up on the latest version (probably the >>>>>> latter). >>>>>> >>>>>> Thanks >>>>>> >>>>>> (ps - lots of good new stuff in the candidate though - especially >>>>>> like the horizontal candlestick charts - and the animation seems to be >>>>>> fixed too when using it with phonegap.) - i'm a big fan of your product - >>>>>> keep up the excellent work!) >>>>>> >>>>>> -- >>>>>> 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 google-visualization-api+unsub >>>>>> [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 >>>>> >>>> >>>> >>>> >>>> Daniel - thanks for getting back - well - I've tried substituting my >>>> options into your example and that works very well - including the >>>> animation. So I guess that boils down to the data. Thing is my program is >>>> rather large by now and its written in PhoneGap - so not super easy to >>>> translate into an example. The main test though is that all I have to do is >>>> change the version from 1 to 1.1 and it generates the error - so no doubt >>>> I'm running on borrowed time right now. >>>> >>>> The data I am passing originates in a google spreadsheet. From there I >>>> use JStorage to hold it locally and then after retrieving the data I create >>>> a data table which is variously filtered, augmented and ends up in a data >>>> view. I would obviously be happy to send you the offending code but its >>>> rather involved and I wouldn't want to impose - i've been struggling for a >>>> couple of hours to create a simpler example but this is going to take me >>>> some time. >>>> >>>> Bryan >>>> >>>> -- >>>> 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 >>> >> >> >> >> >> >> >> Daniel >> >> Yes of course I will be delighted to try to pin this down. SO as a start >> I've tried to >> follow your suggestion and inserted the following lines in my code: >> >> >> if(flippy>0){ >> $("#table_div").hide(); >> $("#table_div1").show(); >> if(bNumberOf > 0){ >> >> //dump test >> dumper = barView.toDataTable(); >> dumper1 = dumper.toJSON(); >> console.log(dumper1); >> //end of dump test >> >> tchart.draw(barView, goptions); >> }else{ >> alert('sorry no boards selected'); >> } >> } >> >> Just for reference the options used are: >> >> var goptions = { >> colorAxis: {colors: ['green','yellow', 'red']}, >> title:'Best Wave Height correlated to Length and Width', >> >> width: '100%', >> vAxis:{minValue:17,ticks: >> [17,18,19,20,21,22,23],textPosition: >> 'in',title: 'Board Width(ins)'}, >> legend: {position: 'in'}, >> sizeAxis: {minSize: 5, maxSize:15}, >> chartArea: {width: '90%', height: '60%'}, >> bubble:{opacity: 0.3}, >> animation:{startup:'true',duration:1000}, >> hAxis: {textPosition: 'in', title: 'Board >> Length(ft)'} >> >> }; >> >> And the results as copied from the console: >> >> >> running on version 1: >> >> {"cols":[{"id":"A","label":"MODEL","type":"string"},{"id":"K","label":"Length >> (ft)","type":"number","pattern":"0.000"},{"id":"N","label":"Width >> (ins)","type":"number","pattern":"# ?/?"},{"id":"AF","label":"Best >> (ft)","type":"number","pattern":"#,##0.00"}],"rows":[ >> {"c":[{"v":"TheProject"},{"v":6,"f":"6.000"},{"v":18.625,"f":"18 >> 5/8"},{"v":5.039746205879908,"f":"5.04"}]},{"c":[{"v":" >> ColdWaterProject"},{"v":6,"f":"6.000"},{"v":18.75,"f":"18 >> 3/4"},{"v":5.193356361703707,"f":"5.19"}]}],"p":null} >> >> running on version 1.1 release candidate: >> >> {"cols":[{"id":"A","label":"MODEL","type":"string"},{"id":"K","label":"Length >> (ft)","type":"number","pattern":"0.000"},{"id":"N","label":"Width >> (ins)","type":"number","pattern":"# ?/?"},{"id":"AF","label":"Best >> (ft)","type":"number","pattern":"#,##0.00"}],"rows":[ >> {"c":[{"v":"TheProject"},{"v":6,"f":"6.000"},{"v":18.625,"f":"18 >> 5/8"},{"v":5.039746205879908,"f":"5.04"}]},{"c":[{"v":" >> ColdWaterProject"},{"v":6,"f":"6.000"},{"v":18.75,"f":"18 >> 3/4"},{"v":5.193356361703707,"f":"5.19"}]}]} >> >> so the only difference I can see is right at the end of the JSON we have >> in verion 1: >> >> ,"p":null >> >> >> but in version 1.1 this is not there. And changing the version from 1 >> (which draws the bubble chart perfectly) to 1.1 produces the error >> message: >> >> undefined is not an object (evaluating 'glc)') >> >> Wonder if that helps some light? I'll see if I can make an example of >> this. >> >> Bryan >> > > > > PS Well after much fiddling around I managed to get a test version > working. I am sorry its still quite long but I think it shows the issue I > am having. If you run this in version 1 it works fine but if you go to > version 1.1 it does not. So its an issue I can duplicate!!!!! > Interestingly I get a different error message this time. It seems to come > down to the way in which the data are arriving from the google spreadsheet > and its quite beyond me as to what else I might do to overcome it. Anyway - > here's the code whcih I managed to get working in JSFiddle (but haven't > quite figured out how to share that so sorry I'm going to cut and paste it > here): > > HTML > > <script type="text/javascript" src=" > https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization > ','version':'1','packages':['corechart']}]}"></script> > <title>Data from a Spreadsheet</title> > <span id='table_div1'></span> > > JavaScript > > google.setOnLoadCallback(drawChart); > > function drawChart() { > var bquery = new google.visualization.Query( > ' > https://docs.google.com/spreadsheets/d/1xFvSJ4h8c8dIB1hr41f5ka0dbFOxwIgRT27AiZCC-LM/edit#gid=1800570287 > ' > ); > bquery.setQuery( > 'select A,B,D,E,F,G,H,N,M,C,Y,Z,AA,AF,AG,AH,K > order by AF'); > > bquery.send(handleBoardsWeHaveResponse); > } > > function handleBoardsWeHaveResponse(response) { > > if (response.isError()) { > alert('Error in query: ' + response.getMessage() + ' ' + > response.getDetailedMessage()); > return; > } > //load up the response to the query > var bboardData = response.getDataTable(); > //i've added this next line to my code to make this work here > //but it isn't in my code - no idea why this makes a > difference :( > boardJasonified = bboardData.toJSON(); > var refData = new > google.visualization.DataTable(boardJasonified); > var view1 = new google.visualization.DataView(refData); > > > > //just a cut and shut from my code to make the selection work > //guess its only interesting if you like surfboards > var columnNumber; > var YourWeight = 76; > var YourSkill = 'Skilled'; > var LowWeight = 0.975 * YourWeight; > var HighWeight = 1.02 * YourWeight; > var WaveySizeMax = 20; > var WaveySizeMin = 0; > > if (YourSkill == "Expert") { > columnNumber = 2; > } > if (YourSkill == "Skilled") { > columnNumber = 3; > } > if (YourSkill == "Independent") { > columnNumber = 4; > } > if (YourSkill == "Intermediate") { > columnNumber = 5; > } > if (YourSkill == "Apprentice") { > columnNumber = 6; > } > view1.setRows(view1.getFilteredRows > ([{ column: columnNumber, > minValue: LowWeight, > maxValue: HighWeight > }, > { column: 15, > maxValue: WaveySizeMax > }, > { column: 14, > minValue: WaveySizeMin > } > ])); > // end of cut and shut > > //and the rest is just creating the bubblechart > > > barView = new google.visualization.DataView(view1); > barView.setColumns([0, 16,7,13]); > //you can uncomment this if you wan to see the Dataview > and how it changes with > //version number > //dumper = barView.toDataTable(); > //dumper1 = dumper.toJSON(); > //console.log(dumper1); > > var tchart = new > google.visualization.BubbleChart(document.getElementById('table_div1')); > bNumberOf = view1.getNumberOfRows(); > var goptions = { > colorAxis: {colors: ['green','yellow', 'red']}, > title:'Best Wave Height correlated to Length and Width', > width: '100%', > vAxis:{minValue:17,ticks: > [17,18,19,20,21,22,23],textPosition: 'in',title: 'Board Width(ins)'}, > legend: {position: 'in'}, > sizeAxis: {minSize: 5, maxSize:15}, > chartArea: {width: '90%', height: '60%'}, > bubble:{opacity: 0.3}, > animation:{startup:'true',duration:1000}, > hAxis: {textPosition: 'in', title: 'Board Length(ft)'} > }; > > if(bNumberOf > 0){ > tchart.draw(barView, goptions); > }else{ > alert('sorry no boards selected'); > } > > > > } > > > > > > > > > > > -- > 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] <[email protected]> 5CC, Cambridge MA [email protected] <[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]. 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.
