ENBOX DATA VISUALIZER

by whelkaholism

CSS

* {
  font-family: Arial,Helvetica,sans-serif;
}

table {
  border-collapse: collapse;
}

td {
   border: 1px solid #000000;
   padding: 2px;
}

td span {
  font-size: 12px;  
  display: inline-block;
  whitespace: nowrap;
}

td span:not(:last-child) {
  padding-right: 5px;
}

span.dt {
  color: #0000ff;
}

span.val {
  font-weight: 900;
  color: #ff0000;  
  width: 5em;
}

span.null {
  color: #909090;
  font-weight: 400;
}

JavaScript

var data = {
  "Title": "Fri 05 - Sat 06 Feb 2021",
  "Period": "CUSTOM",
  "RequestedFrom": {
    "dt": "2021-02-05T00:00:00",
    "l": true,
    "z": "+00:00"
  },
  "RequestedTo": {
    "dt": "2021-02-06T00:00:00",
    "l": true,
    "z": "+00:00"
  },
  "ActualFrom": {
    "dt": "2021-02-05T07:00:00",
    "l": true,
    "z": "+00:00"
  },
  "ActualTo": {
    "dt": "2021-02-06T00:00:00",
    "l": true,
    "z": "+00:00"
  },
  "PeriodOptions": {
    "TickInterval": null,
    "TickFormat": null,
    "IsAuto": true
  },
  "YMin": null,
  "YMax": null,
  "Y2Min": 0,
  "Y2Max": null,
  "YInterval": null,
  "Y2Interval": null,
  "Datasets": {
    "live_alerts-0": {
      "Name": "Alerts",
      "AnalyzerTypeName": "Enbox.AirQualityDB.LiveAlertsDataAnalyzer, AirQualityDB, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null",
      "MeasurementTimeType": 2,
      "MeasurementTimeTypeString": "AtEnd",
      "ChartType": "",
      "Color": "rgba(95, 212, 109, 0.8)",
      "LineWidth": 1,
      "LinePattern": "",
      "Data": [
        {
          "id": -1,
          "dt": {
            "dt": "2021-02-05T21:00:00",
            "l": null,
            "z": ""
          },
          "val": 11.4,
          "w": 3600
        }
      ],
      "SeriesDataField": "",
      "YAxisID": null,
      "Units": null,
      "YMin": null,
      "YMax": null,
      "Y2Min": null,
      "Y2Max": null,
      "YInterval": null,
      "Y2Interval": null,
      "XTicks": null,
      "Y1Ticks": null,
      "Y2Ticks": null,
      "Fields": null,
      "FieldLabels": null
    },
    "live_alerts-1": {
      "Name": "Alerts",
      "AnalyzerTypeName": "Enbox.AirQualityDB.LiveAlertsDataAnalyzer, AirQualityDB, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null",
      "MeasurementTimeType": 2,
      "MeasurementTimeTypeString": "AtEnd",
      "ChartType": "",
      "Color": "rgba(255, 0, 0, 0.8)",
      "LineWidth": 6,
      "LinePattern": "",
      "Data": [
        {
          "id": -1,
   ...