D3 Examples - google style gauges using javascript d3.js

xxxxxxxxxx
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8">
        <title>d3.js gauges</title>
        
        <style>
        
            body
            {
                font: 10px arial;
            }
            
        </style>
        
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/d3@2.10.3/d3.v2.js"></script>
        <script type="text/javascript" src="gauge.js"></script>
​
        <script>
                        
                
            var gauges = [];
            
            function createGauge(name, label)
            {
                var config = 
                {
                    size: 120,
                    label: label,
                    minorTicks: 5
                }
                
                config.redZones = [];
                config.redZones.push({ from: 90, to: 100 });
​
                config.yellowZones = [];
                config.yellowZones.push({ from: 75, to: 90 });
                
                gauges[name] = new Gauge(name + "GaugeContainer", config);
                gauges[name].render();
            }
        
            function createGauges()
            {
                createGauge("memory", "Memory");
                createGauge("cpu", "CPU");
                createGauge("network", "Network");                              
            }
            
            function updateGauges()
            {
                for (var key in gauges)
                {
                    gauges[key].redraw(30 + 50 * Math.random() - 30 * Math.random());
                }
            }
            
            function initialize()
            {
                createGauges();
                setInterval(updateGauges, 5000);
            }
                        
        </script>
        
        
    </head>
    
    <body onload="initialize()">
        <span id="memoryGaugeContainer"></span>
        <span id="cpuGaugeContainer"></span>
        <span id="networkGaugeContainer"></span>
    </body>
    
</html>
    