More
More
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title><?php echo "Google Gauge - $user"; ?></title> <meta name="robots" content="noindex,follow"> <meta name="googlebot" content="nosnippet,noarchive"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta HTTP-EQUIV="Pragma" CONTENT="no-cache"> <meta HTTP-EQUIV="Expires" CONTENT="-1"> <meta http-equiv="refresh" content="60"> <style type="text/css"> body { background-color: #ddd; } #container { height: 100%; width: 100%; display: table; } #inner { vertical-align: middle; display: table-cell; } #gauge_div { width: <?php echo "$size"; ?>px; margin: 0 auto; } </style> <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script> <script type='text/javascript' src='https://www.google.com/jsapi'></script> <script type='text/javascript'> // maximum value for the gauge var max_gauge_value = 400; // name of the gauge var gauge_name = 'CPM'; // global variables var chart, charts, data; // load the google gauge visualization google.load('visualization', '1', {packages:['gauge']}); google.setOnLoadCallback(initChart); // display the data function displayData(point) { data.setValue(0, 0, gauge_name); data.setValue(0, 1, point); chart.draw(data, options); } // load the data function loadData() { // variable for the data point var p; p = <?php echo "$cpm"; ?>; // if there is a data point display it if (p) { p = Math.round((p / max_gauge_value) * 100); displayData(p); }; } // initialize the chart function initChart() { data = new google.visualization.DataTable(); data.addColumn('string', 'Label'); data.addColumn('number', 'Value'); data.addRows(1); chart = new google.visualization.Gauge(document.getElementById('gauge_div')); options = {width: <?php echo "$size"; ?>, height: <?php echo "$size"; ?>, redFrom: <?php echo "$alert"; ?>, redTo: 100, yellowFrom: <?php echo "$warning"; ?>, yellowTo: <?php echo "$alert"; ?>, greenFrom: 0, greenTo: <?php echo "$warning"; ?>, minorTicks: 5}; loadData(); // load new data every 30 seconds setInterval('loadData()', 30000); } </script> </head> <body> <div id="container"> <div id="inner"> <div id="gauge_div"></div> </div> </div> </body> </html> frameborder="0" allowfullscreen>