Alert Duration Chart

by aljordan82

HTML

<script src="http://cdn.jsdelivr.net/jqplot/1.0.8/jquery.jqplot.min.js"></script>
<link rel="stylesheet" href="http://cdn.jsdelivr.net/jqplot/1.0.8/jquery.jqplot.min.css">
<script src="http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.barRenderer.min.js"></script>
<script src="http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.categoryAxisRenderer.min.js"></script>
<script src="http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.pointLabels.min.js"></script>
<script src="http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.canvasTextRenderer.min.js"></script>
<div id="container" style="height:200px;width:800px;" ></div>

CSS

/* Don't use CSS to set dimentions*/
#container {
    width:400px;
    height: 200px,
}

JavaScript

var alertSeverityMap = {
                    0: 'none',
                    1: '#0f0',
                    2: '#00f',
                    3: '#ffa500 ',
                    4: '#ffff00 ',
                    5: '#f00'
                };

var rawData = {  "alertRules": [
                    {
                      "alertSeverity": 5,
                      "alertCondition": {
                        "minimum": {
                          "value": 3840
                        },
                        "maximum": {
                          "value": 90000
                        }
                      }
                    }  ,
                        {
                      "alertSeverity": 2,
                      "alertCondition": {
                        "minimum": {
                          "value": 600
                        },
                        "maximum": {
                          "value": 3840
                        }
                      }
                    },
                    {
                      "alertSeverity": 1,
                      "alertCondition": {
                        "minimum": {
                          "value": 0
                        },
                        "maximum": {
                          "value": 600
                        }
                      }
                    }
                  ]
                }

var data = []
var seriesConfiguration =[]
for(var i= 0; i < rawData.alertRules.length;i++){
    var alert = rawData.alertRules[i];  
           
    data.push([[alert.alertCondition.minimum.value, i ,formatTime(undefined,alert.alertCondition.minimum.value)],[alert.alertCondition.maximum.value,i,formatTime(undefined,alert.alertCondition.maximum.value)]])   
                      seriesConfiguration.push( {'color':  alertSeverityMap[alert.alertSeverity.value]});

}

console.log(data)

function formatTime(a,totalSec) {
    debugger
    var days = parseInt( totalSec / 86400 ) ;
        var hours =...