OK it works ! I'll have to spend some time to "learn" correctly basis of htlm !
But something is strange on my site now... Look : http://meteoplougastel.e-monsite.com/pages/janvier/essai-2013.html The chart appears...but the rest of the page has disapeared ?? The end of the script may be ? Any idea why ? Thanks Eric Le mardi 11 juin 2013 18:08:16 UTC+2, asgallant a écrit : > > You are missing the divs that the code is trying to put the chart and > controls in: > > <div id="dashboard"> > <div id="visualization"></div> > <div id="control"></div> > </div> > > On Tuesday, June 11, 2013 10:27:20 AM UTC-4, [email protected] wrote: >> >> Are you sure of the script below ? >> It does not work... >> It's "blank"...on my website >> http://meteoplougastel.e-monsite.com/pages/janvier/essai-2013.html >> A last try if you have time ? then I'll give up. I don't want to waste >> your time... >> Sorry... >> >> >> @@@@@@@@@@@@@@@@@@@ >> >> <script type='text/javascript' src="http://www.google.com/jsapi >> "></script> >> <script type='text/javascript'> >> function drawVisualization() { >> var data = new google.visualization.DataTable(); >> data.addColumn('datetime', 'Date'); >> data.addColumn('number', 'T°ext'); >> data.addColumn('number', 'Vent'); >> data.addColumn('number', 'Pluie'); >> data.addRows([ >> [new Date(2013, 0, 1, 0, 0), 7.8, 0, 0], >> [new Date(2013, 0, 1, 0, 20), 7.5, 0, 0], >> [new Date(2013, 0, 1, 0, 40), 7.5, 2.9, 0], >> [new Date(2013, 0, 1, 1, 0), 7.7, 0, 0], >> [new Date(2013, 0, 1, 1, 20), 8.4, 4.7, 0], >> [new Date(2013, 0, 1, 1, 40), 8.4, 5, 0], >> [new Date(2013, 0, 1, 2, 2), 8.3, 6.5, 0], >> [new Date(2013, 0, 1, 2, 20), 8.3, 12.6, 0], >> [new Date(2013, 0, 1, 2, 40), 8.2, 10.4, 0], >> [new Date(2013, 0, 1, 3, 0), 8.2, 2.5, 0], >> [new Date(2013, 0, 1, 3, 20), 7.8, 17.3, 0], >> [new Date(2013, 0, 1, 3, 40), 7.7, 5, 0], >> [new Date(2013, 0, 1, 4, 0), 7.1, 1.1, 0], >> [new Date(2013, 0, 1, 4, 20), 7.1, 10.8, 0], >> [new Date(2013, 0, 1, 4, 40), 7.1, 10.1, 0], >> [new Date(2013, 0, 1, 5, 0), 6.8, 0, 0], >> [new Date(2013, 0, 1, 5, 20), 6.3, 2.2, 0], >> [new Date(2013, 0, 1, 5, 40), 6.3, 6.1, 0], >> [new Date(2013, 0, 1, 6, 0), 6.2, 0, 0], >> [new Date(2013, 0, 1, 6, 20), 5.8, 3.6, 0.518], >> [new Date(2013, 0, 1, 6, 40), 5.8, 0, 0], >> [new Date(2013, 0, 1, 7, 0), 5.9, 5.4, 0], >> [new Date(2013, 0, 1, 7, 20), 6, 4, 0], >> [new Date(2013, 0, 1, 7, 40), 6, 0, 0], >> [new Date(2013, 0, 1, 8, 0), 5.6, 0, 0], >> [new Date(2013, 0, 1, 8, 20), 5.3, 0, 0], >> [new Date(2013, 0, 1, 8, 40), 5.4, 0, 0], >> [new Date(2013, 0, 1, 9, 0), 5.3, 0, 0], >> [new Date(2013, 0, 1, 9, 20), 5.1, 0, 0], >> [new Date(2013, 0, 1, 9, 40), 5.5, 0, 0], >> [new Date(2013, 0, 1, 10, 0), 6.1, 8.6, 0], >> [new Date(2013, 0, 1, 10, 20), 6.3, 0, 0], >> [new Date(2013, 0, 1, 10, 40), 6.8, 1.1, 0], >> [new Date(2013, 0, 1, 11, 0), 7.1, 6.8, 0], >> [new Date(2013, 0, 1, 11, 20), 8.3, 0, 0], >> [new Date(2013, 0, 1, 11, 40), 8, 0, 0], >> [new Date(2013, 0, 1, 12, 0), 7.9, 13.3, 0], >> [new Date(2013, 0, 1, 12, 20), 8.6, 0, 0], >> [new Date(2013, 0, 1, 12, 40), 9.4, 5, 0], >> [new Date(2013, 0, 1, 13, 0), 9.1, 10.1, 0], >> [new Date(2013, 0, 1, 13, 20), 9.1, 2.9, 0], >> [new Date(2013, 0, 1, 13, 40), 9.6, 15.1, 0], >> [new Date(2013, 0, 1, 14, 0), 9.3, 11.9, 0] >> ]); >> >> // format the data for display in tooltips >> var tFormat = new google.visualization.NumberFormat({pattern: '#.0 >> °c'}); >> tFormat.format(data, 1); >> var ventFormat = new google.visualization.NumberFormat({pattern: >> '#.00 km/h'}); >> ventFormat.format(data, 2); >> var pluieFormat = new google.visualization.NumberFormat({pattern: >> '#.000 mm'}); >> pluieFormat.format(data, 3); >> >> // set some common dimensions for the chart and control >> var width = 500; >> var chartAreaWidth = '80%'; >> >> // create a chart >> var chart = new google.visualization.ChartWrapper({ >> chartType: 'LineChart', >> containerId: 'visualization', >> options: { >> height: 350, >> width: width, >> chartArea: { >> height: '75%', >> width: chartAreaWidth >> }, >> series: { >> 0: { >> // options for T°ext >> targetAxisIndex: 0, // use left axis >> color: '#59761d' >> }, >> 1: { >> // options for Vent >> targetAxisIndex: 1, // use right axis >> color: '#1d4376' >> }, >> 2: { >> // options for Pluie >> targetAxisIndex: 2, // use hidden axis >> color: '#761d1d' >> } >> }, >> vAxes: { >> 0: { >> // options for left axis >> title: '°c', >> viewWindow: { >> min: 0 >> } >> }, >> 1: { >> // options for right axis >> title: 'km/h', >> viewWindow: { >> min: 0 >> } >> }, >> 2: { >> // options for second right axis >> title: 'mm', >> textPosition: 'in', >> viewWindow: { >> min: 0 >> } >> } >> } >> } >> }); >> >> // create a control >> var control = new google.visualization.ControlWrapper({ >> controlType: 'ChartRangeFilter', >> containerId: 'control', >> options: { >> filterColumnIndex: 0, >> ui: { >> chartOptions: { >> height: 50, >> width: width, >> chartArea: { >> width: chartAreaWidth >> } >> }, >> chartView: { >> columns: [0, 1] // use the T°ext series in the range >> slider >> } >> } >> } >> }); >> >> // create a dashboard >> var dashboard = new >> google.visualization.Dashboard(document.getElementById('dashboard')); >> // bind control to chart >> dashboard.bind([control], [chart]); >> // draw the dashboard using the data table >> dashboard.draw(data); >> } >> google.load('visualization', '1', {packages:['controls'], callback: >> drawVisualization}); >> </script> >> @@@@@@@@@@@@@@@@@@@ >> > -- 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?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
