Thank you very much for your reply... but Still not working... Did you try it??? Please reply Thanks again
On Wednesday, May 2, 2012 9:30:35 AM UTC+1, mrishadali wrote: > > Hi, > I want to plot area chart with a slider. For the slider I need to use > the time values. > How can I do this ??? As it say time is not a number value. > Is there any way to convert time in numbers or use the area chart with > time format... > Please help me.... > Below is the sample code..... I want to use time for the slider value > Thanks > > <html> > <head> > <meta http-equiv="Content-Type" content="text/html; > charset=ISO-8859-1"> > <title>Turnkey Instrumentse</title> > > <!--Load the AJAX API--> > <script type="text/javascript" src="https://www.google.com/ > jsapi"></script> > <script type="text/javascript"> > > // Load the Visualization API and the controls package. > google.load('visualization', '1.0', {'packages':['controls']}); > > // Set a callback to run when the Google Visualization API is > loaded. > google.setOnLoadCallback(drawDashboard); > > > var slider; > // Callback that creates and populates a data table, > // instantiates a dashboard, a range slider and a pie chart, > // passes in the data and draws it. > function drawDashboard() { > > // Create our data table. > var data = google.visualization.arrayToDataTable([ > ['TimeStamp','Total', 'Value1', > 'Value2', 'Value3' ], > ['29/09/2011 > 18:33',10.7,8.1,3.73,1.3], > ['29/09/2011 > 18:38',12.6,8.7,3.84,1.29], > ['29/09/2011 > 18:43',11.2,8.3,3.61,1.25], > ['29/09/2011 > 18:48',11.1,7.5,3.62,1.23], > ['29/09/2011 > 18:53',12.3,8.2,3.4,1.2], > ['29/09/2011 > 18:58',8.4,6.9,3.37,1.21], > ['29/09/2011 > 19:03',10.2,6.8,3.41,1.24], > ['29/09/2011 > 19:08',7.5,6.3,3.33,1.23], > ['29/09/2011 > 19:13',9.6,6.3,3.19,1.19], > ]); > > // Create a dashboard. > var dashboard = new google.visualization.Dashboard( > document.getElementById('dashboard_div')); > > // Create a range slider, passing some options > slider = new google.visualization.ControlWrapper({ > 'controlType': 'NumberRangeFilter', > 'containerId': 'filter_div', > 'options': { > 'filterColumnLabel': 'Total' > } > }); > > // Create a pie chart, passing some options > var pieChart = new google.visualization.ChartWrapper({ > 'chartType': 'AreaChart', > 'containerId': 'chart_div', > 'options': { > 'width': 800, > 'height': 500, > 'pieSliceText': 'value', > 'legend': 'right' > } > }); > > // Establish dependencies, declaring that 'filter' drives > 'pieChart', > // so that the pie chart will only display entries that are > let through > // given the chosen slider range. > dashboard.bind(slider, pieChart); > > // Draw the dashboard. > dashboard.draw(data); > } > > > > > > > </script> > </head> > <body> > <!--Div that will hold the dashboard--> > <div id="dashboard_div" style="overflow:auto;width: 1000px; > height: 600px;"> > <!--Divs that will hold each control and chart--> > <div id="filter_div"></div> > <div id="chart_div" "></div> > </div> > </body> > </html> -- 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/-/nv5BO57Qw00J. 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.
