Errors in my JSON scripting (I'm new to JavaScript Object Notation), I found several issues that FF did not care about, but IE did. * "application/javascript" should be "text/javascript" * No comma (or semicolon) on last element enclosed within curly braces
I'm still working on it, IE is taking the whole array as the return value for pieTable.getFilteredRows() :( On Oct 28, 5:24 pm, Doughboy <[EMAIL PROTECTED]> wrote: > Sorry about the line wraps, I'm not sure how to avoid that (other than > rewriting the code). > > On Oct 28, 5:20 pm, Doughboy <[EMAIL PROTECTED]> wrote: > > > I've created this small dashboard in which changing the time range in > > the top annotated time line controls the other 2 visualizations (pie > > chart and bottom annotated time line). > > > It works fine in FF(3.0.3) but in IE (6.0.2800.1106CO) it displays > > only the text preceding the div tags. > > Can anyone get it to work in IE or tell me why it fails? > > > I use this localhost URL to view > > it:http://localhost/devtools/metrics/googleTrend.htm > > > Thanks in advance, > > ~Tim > > > <html> > > <head> > > <script src="http://www.google.com/jsapi"></script> > > <script type="application/javascript"> > > var code = { > > pieViz: null, > > trendViz: null, > > trendTable: null, > > trendView: null, > > > init: function() { > > code.pieViz = new > > window.google.visualization.PieChart( document.getElementById( > > 'view_pie_div' ) ); > > code.trendViz = new > > window.google.visualization.AnnotatedTimeLine( document.getElementById( > > 'view_trend_div' ) ); > > > code.trendTable = new > > window.google.visualization.DataTable(); > > code.trendTable.addColumn( 'date', 'Date' ); > > code.trendTable.addColumn( 'string', 'type' ); > > code.trendTable.addColumn( 'number', 'AgeDays' ); > > code.trendTable.addRows( 5 ); > > code.trendTable.setValue( 0, 0, new Date( 2008, 9, > > 15 ) ); > > code.trendTable.setValue( 0, 1, 'Incident' ); > > code.trendTable.setValue( 0, 2, 1 ); > > code.trendTable.setValue( 1, 0, new Date( 2008, 9, > > 16 ) ); > > code.trendTable.setValue( 1, 1, 'Incident' ); > > code.trendTable.setValue( 1, 2, 4 ); > > code.trendTable.setValue( 2, 0, new Date( 2008, 9, > > 17 ) ); > > code.trendTable.setValue( 2, 1, 'Incident' ); > > code.trendTable.setValue( 2, 2, 4 ); > > code.trendTable.setValue( 3, 0, new Date( 2008, 9, > > 18 ) ); > > code.trendTable.setValue( 3, 1, 'Incident' ); > > code.trendTable.setValue( 3, 2, 1 ); > > code.trendTable.setValue( 4, 0, new Date( 2008, 9, > > 19 ) ); > > code.trendTable.setValue( 4, 1, 'Incident' ); > > code.trendTable.setValue( 4, 2, 3 ); > > > var controller = new > > window.google.visualization.AnnotatedTimeLine( document.getElementById( > > 'controller_div' ) ); > > controller.draw( code.trendTable, {} ); > > > window.google.visualization.events.addListener( controller, > > 'rangechange', function( range ) { code.rangechanger( range ); } ); > > > code.trendView = new > > window.google.visualization.DataView( code.trendTable ); > > code.trendView.setColumns( [ 0, 2 ] ); > > }, > > > drawPie: function( range ) { > > var pieTable = code.trendTable.clone(); // remove > > all rows outside time range, in reverse time order to preserve > > rowIndices > > var sRangeStart = range.start.toString(); > > var sRangeEnd = range.end.toString(); > > > var filterStart = { column: 0, value: new > > Date( sRangeStart.substr( 0, 15 ) ) }; > > filterStart.value.setDate( filterStart.value.getDate() > > + 1 ); > > var filterEnd = { column: 0, value: new > > Date( sRangeEnd.substr( 0, 15 ) ) }; > > filterEnd.value.setDate( filterEnd.value.getDate() + > > 1 ); > > > var rowStart = Number > > ( pieTable.getFilteredRows( [ filterStart ] ) ); > > var rowEnd = Number > > ( pieTable.getFilteredRows( [ filterEnd ] ) ); > > var numRows = Number ( pieTable.getNumberOfRows() - > > 1 ); > > var tailRows = numRows - rowEnd; > > if ( tailRows > 0 ) { > > numRows = numRows - 1; > > rowEnd = rowEnd + 1; > > pieTable.removeRows( rowEnd, numRows ); > > } > > > if ( rowStart > 0 ) { > > pieTable.removeRows( 0, rowStart ); > > } > > > var DV = new > > window.google.visualization.DataView( pieTable ); > > DV.setColumns( [ 0, 2 ] ); > > code.pieViz.draw( DV, {} ); > > }, > > > rangechanger: function( range ) { > > code.trendViz.draw( code.trendView, > > { displayZoomButtons: false, zoomStartTime: new Date( range.start ), > > zoomEndTime: new Date( range.end ), colors: [ 'red' ]} ); > > code.drawPie( range ); > > } > > }; > > window.google.load( "visualization", "1", { packages: > > [ "annotatedtimeline" ] } ); > > window.google.load( "visualization", "1", { packages: > > [ "piechart" ] } ); > > window.google.setOnLoadCallback( code.init );// Set callback > > to run when API is loaded > > </script> > > </head> > > <body> > > <table cellspacing="10"> > > <tbody> > > <tr><td>Controls TimeLine Range<div id="controller_div" > > style="width: 700px; height: 200px;"></div></td></tr> > > <tr><td>Views Pie<div id="view_pie_div" style="width: 700px; > > height: 200px;"></div></td></tr> > > <tr><td>Views TimeLine<div id="view_trend_div" style="width: > > 700px; height: 200px;"></div></td></tr> > > </tbody> > > </table> > > </body> > > </html> > > --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Google Visualization API" group. 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 -~----------~----~----~----~------~----~------~--~---
