<!-- You are free to copy and use this sample in accordance with the terms of the Apache license (http://www.apache.org/licenses/LICENSE-2.0.html) --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> <html xmlns="http://www.w3.org/1999/xhtml";> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title> CPU_Line_chart2 </title> <!-- COMMENT: PHP makes variable available to the rest of the page--> <script type="text/javascript" src="http://www.google.com/jsapi";></script> </head> <body style="font-family: Arial;border: 0 none;"> <h2> Capacity Vital Signs </h2> <form action="http://lpil0219capan01/CPU_Line_chartsarah.php";> Server Name: <input type="text" name="server_name" ><br> Data Gran: <select name="data_gran"> <option value="hourly">Hourly</option> <option value="daily">Daily</option> <option value="monthly">Monthly</option> </select> <br> <input type="submit" value="Submit"> </form> <table border="0" width="100%" cellspacing="0" cellpadding="4"> <tr> <td width="50%"> <div id="chart001" style="min-width:300px; min-height:300px; margin: 0 auto"> <script type="text/javascript"> google.load('visualization', '1', {packages: ['corechart']}); </script> <script type="text/javascript"> function drawVisualization() { // Create and populate the data table. var data = google.visualization.arrayToDataTable([ ['Date', 'MAX', 'MIN', 'AVG'], ['2013-Jan-27',50.0000 ,0.0000,1.3750] , ['2013-Jan-28',34.0000 ,0.0000,2.2917] , ['2013-Jan-29',22.0000 ,0.0000,0.4583] , ['2013-Jan-30',4.0000 ,0.0000,0.0521] , ['2013-Jan-31',34.0000 ,0.0000,1.8229] , ['2013-Feb-1',35.0000 ,0.0000,1.4479] , ['2013-Feb-2',11.0000 ,0.0000,0.6458] , ['2013-Feb-3',50.0000 ,0.0000,3.3854] , ['2013-Feb-4',50.0000 ,0.0000,0.6979] , ['2013-Feb-5',44.0000 ,0.0000,2.7917] , ['2013-Feb-6',42.0000 ,0.0000,0.9479] , ['2013-Feb-7',45.0000 ,0.0000,0.4792] , ['2013-Feb-8',35.0000 ,0.0000,0.7188] , ['2013-Feb-9',29.0000 ,0.0000,1.5208] , ['2013-Feb-10',35.0000 ,0.0000,2.6250] , ['2013-Feb-11',37.0000 ,0.0000,0.4479] , ['2013-Feb-12',44.0000 ,0.0000,3.1667] , ['2013-Feb-13',35.0000 ,0.0000,0.3958] , ['2013-Feb-14',40.0000 ,0.0000,0.4688] , ['2013-Feb-15',44.0000 ,0.0000,1.4167] , ['2013-Feb-17',25.0000 ,0.0000,0.7917] , ['2013-Feb-18',35.0000 ,0.0000,4.3542] , ['2013-Feb-19',50.0000 ,0.0000,2.3542] , ['2013-Feb-20',26.0000 ,0.0000,0.4375] , ['2013-Feb-21',0.0000 ,0.0000,0.0000] , ['2013-Feb-22',35.0000 ,0.0000,1.0417] , ['2013-Feb-23',32.0000 ,0.0000,1.6354] ]); var options = { title: 'Simple daily CPU Chart for wpil0219capan01', curveType: "function", width: 700, height: 400, vAxis: {title:'CPU Util %', maxValue: 100, minValue: 0} }; // Create and draw the visualization. document.getElementById('chart001').style.display = 'block'; new google.visualization.LineChart(document.getElementById('chart001')). draw(data, options); } google.setOnLoadCallback(drawVisualization); </script> </div> <small> </small> </td> <td width="50%" style="border-left:1px dotted #cccccc;"> <div id="chart002" style="min-width:300px; min-height:300px; margin: 0 auto"> <script type="text/javascript"> google.load('visualization', '1', {packages: ['corechart']}); </script> <script type="text/javascript"> function drawVisualization() { // Create and populate the data table. var data = google.visualization.arrayToDataTable([ ['Date', 'MAX', 'MIN', 'AVG'], ['2013-Jan-27',120.0000 ,113.0000,115.5521] , ['2013-Jan-28',124.0000 ,109.0000,115.1319] , ['2013-Jan-29',117.0000 ,110.0000,110.7500] , ['2013-Jan-30',118.0000 ,111.0000,113.1875] , ['2013-Jan-31',121.0000 ,83.0000,100.9479] , ['2013-Feb-1',118.0000 ,95.0000,105.3125] , ['2013-Feb-2',123.0000 ,114.0000,115.0660] , ['2013-Feb-3',119.0000 ,100.0000,113.1667] , ['2013-Feb-4',123.0000 ,109.0000,116.0729] , ['2013-Feb-5',129.0000 ,113.0000,123.4583] , ['2013-Feb-6',130.0000 ,115.0000,123.8854] , ['2013-Feb-7',118.0000 ,108.0000,112.7708] , ['2013-Feb-8',113.0000 ,107.0000,109.2813] , ['2013-Feb-9',129.0000 ,107.0000,122.1354] , ['2013-Feb-10',123.0000 ,107.0000,119.8021] , ['2013-Feb-11',123.0000 ,122.0000,122.8125] , ['2013-Feb-12',127.0000 ,110.0000,121.5625] , ['2013-Feb-13',129.0000 ,110.0000,122.1979] , ['2013-Feb-14',112.0000 ,109.0000,110.7917] , ['2013-Feb-15',121.0000 ,111.0000,111.9792] , ['2013-Feb-17',69.0000 ,61.0000,67.0104] , ['2013-Feb-18',79.0000 ,52.0000,71.8854] , ['2013-Feb-19',85.0000 ,67.0000,78.1875] , ['2013-Feb-20',83.0000 ,69.0000,76.2500] , ['2013-Feb-21',86.0000 ,82.0000,83.5729] , ['2013-Feb-22',95.0000 ,82.0000,84.3646] , ['2013-Feb-23',109.0000 ,84.0000,99.7292] ]); document.getElementById('chart002').style.display = 'block'; var options = { title: 'Simple daily MEM Chart for wpil0219capan01', curveType: "function", width: 700, height: 400, vAxis: {title:'MEM Util %', maxValue: 100, minValue: 0}, hAxis: {title:' Date' } }; // Create and draw the visualization. document.getElementById('chart002').style.display = 'block'; var chart = new google.visualization.LineChart(document.getElementById('chart002')). draw(data, options); } google.setOnLoadCallback(drawVisualization); </script> </div> <small> </small> </td> </tr> <tr> <td width="50%" style="border-top:1px dotted #cccccc;"> <div id="chart003" style="min-width:300px; min-height:300px; margin: 0 auto"></div> <script type="text/javascript"> google.load('visualization', '1', {packages: ['corechart']}); </script> <script type="text/javascript"> function drawVisualization() { // Create and populate the data table. var data = google.visualization.arrayToDataTable([ ['Disk', 'Used %'], ['_Total',64.925925] , ['C:',75.037037] , ['E:',25.444444] , ['HarddiskVolume2',14.000000] ]); var options = { title: 'Simple daily Disk Chart for wpil0219capan01', curveType: "function", width: 700, height: 400, vAxis: {title:'Disk Util %', maxValue: 100, minValue: 0} }; // Create and draw the visualization. new google.visualization.ColumnChart(document.getElementById('chart003')). draw(data, options); } google.setOnLoadCallback(drawVisualization); </script> </div> </td> <td width="50%" style="border-left:1px dotted #cccccc; border-top:1px dotted #cccccc;"> <div id="chart_4" style="min-width:300px; min-height:300px; margin: 0 auto">sector 4 within div</div> Network Data going here!!! </td> </tr> </table> </body> </html>
-- 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.
