This is awesome.... Thank you very much... This is what I wanted... Thanks a million And Can I ask you one more question... I posted It as well in the group..... Can I use this google-visualization-api for the commercial perpose. I read the Terms of Service <https://developers.google.com/chart/terms> but not sure about it!!!! I work for a company, they design instruments for measuring dust particles in the air and some other instruments. I want to use google visualization API for their website where clients can visualize their instrument's response. Is it legal to use this API for the said purpose. Thank you
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/-/PvZ-Ji1YA7MJ. 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.
