docs: add requests table to dashboard

Author: bednar

examples/dashboard.png

@@ -20,19 +20,23 @@
      "data": [
       {
        "type": "cell",
-       "id": "051559b2aa2a2000"
+       "id": "0541daaaa9471000"
       },
       {
        "type": "cell",
-       "id": "051559b2ae2a2000"
+       "id": "0541daaaaac71000"
       },
       {
        "type": "cell",
-       "id": "051559b2af6a2000"
+       "id": "0541daaaab071000"
       },
       {
        "type": "cell",
-       "id": "05155aef3daa2000"
+       "id": "0541daaaabc71000"
+      },
+      {
+       "type": "cell",
+       "id": "0541db0ef0871000"
       }
      ]
     },
@@ -43,7 +47,7 @@
   },
   "included": [
    {
-    "id": "051559b2aa2a2000",
+    "id": "0541daaaa9471000",
     "type": "cell",
     "attributes": {
      "x": 0,
@@ -55,49 +59,49 @@
      "view": {
       "data": {
        "type": "view",
-       "id": "051559b2aa2a2000"
+       "id": "0541daaaa9471000"
       }
      }
     }
    },
    {
-    "id": "051559b2ae2a2000",
+    "id": "0541daaaaac71000",
     "type": "cell",
     "attributes": {
-     "x": 0,
-     "y": 4,
-     "w": 12,
+     "x": 4,
+     "y": 0,
+     "w": 4,
      "h": 4
     },
     "relationships": {
      "view": {
       "data": {
        "type": "view",
-       "id": "051559b2ae2a2000"
+       "id": "0541daaaaac71000"
       }
      }
     }
    },
    {
-    "id": "051559b2af6a2000",
+    "id": "0541daaaab071000",
     "type": "cell",
     "attributes": {
-     "x": 4,
-     "y": 0,
-     "w": 4,
+     "x": 6,
+     "y": 4,
+     "w": 6,
      "h": 4
     },
     "relationships": {
      "view": {
       "data": {
        "type": "view",
-       "id": "051559b2af6a2000"
+       "id": "0541daaaab071000"
       }
      }
     }
    },
    {
-    "id": "05155aef3daa2000",
+    "id": "0541daaaabc71000",
     "type": "cell",
     "attributes": {
      "x": 8,
@@ -109,14 +113,32 @@
      "view": {
       "data": {
        "type": "view",
-       "id": "05155aef3daa2000"
+       "id": "0541daaaabc71000"
+      }
+     }
+    }
+   },
+   {
+    "id": "0541db0ef0871000",
+    "type": "cell",
+    "attributes": {
+     "x": 0,
+     "y": 4,
+     "w": 6,
+     "h": 4
+    },
+    "relationships": {
+     "view": {
+      "data": {
+       "type": "view",
+       "id": "0541db0ef0871000"
       }
      }
     }
    },
    {
     "type": "view",
-    "id": "051559b2aa2a2000",
+    "id": "0541daaaa9471000",
     "attributes": {
      "name": "Requests Count",
      "properties": {
@@ -164,9 +186,57 @@
    },
    {
     "type": "view",
-    "id": "051559b2ae2a2000",
+    "id": "0541daaaaac71000",
     "attributes": {
-     "name": "Requests",
+     "name": "Request Size",
+     "properties": {
+      "shape": "chronograf-v2",
+      "type": "single-stat",
+      "queries": [
+       {
+        "text": "from(bucket: \"my-bucket\")\n  |> range(start: v.timeRangeStart, stop: v.timeRangeStop)\n  |> filter(fn: (r) => r._measurement == \"httpd.access\")\n  |> filter(fn: (r) => r.method == \"GET\")\n  |> filter(fn: (r) => r._field == \"size\")\n  |> drop(columns: [\"path\"])\n  |> toInt()\n  |> sum(column: \"_value\")\n  |> map(fn: (r) => ({\n      r with\n      _value: r._value / 1024\n    })\n  )",
+        "editMode": "advanced",
+        "name": "",
+        "builderConfig": {
+         "buckets": [],
+         "tags": [
+          {
+           "key": "_measurement",
+           "values": []
+          }
+         ],
+         "functions": [],
+         "aggregateWindow": {
+          "period": "auto"
+         }
+        }
+       }
+      ],
+      "prefix": "",
+      "suffix": " KiB",
+      "colors": [
+       {
+        "id": "base",
+        "type": "text",
+        "hex": "#F48D38",
+        "name": "tiger",
+        "value": 0
+       }
+      ],
+      "decimalPlaces": {
+       "isEnforced": true,
+       "digits": 2
+      },
+      "note": "",
+      "showNoteWhenEmpty": false
+     }
+    }
+   },
+   {
+    "type": "view",
+    "id": "0541daaaab071000",
+    "attributes": {
+     "name": "Requests Count",
      "properties": {
       "shape": "chronograf-v2",
       "queries": [
@@ -251,15 +321,15 @@
    },
    {
     "type": "view",
-    "id": "051559b2af6a2000",
+    "id": "0541daaaabc71000",
     "attributes": {
-     "name": "Request Size",
+     "name": "Success rate",
      "properties": {
       "shape": "chronograf-v2",
       "type": "single-stat",
       "queries": [
        {
-        "text": "from(bucket: \"my-bucket\")\n  |> range(start: v.timeRangeStart, stop: v.timeRangeStop)\n  |> filter(fn: (r) => r._measurement == \"httpd.access\")\n  |> filter(fn: (r) => r.method == \"GET\")\n  |> filter(fn: (r) => r._field == \"size\")\n  |> drop(columns: [\"path\"])\n  |> toInt()\n  |> sum(column: \"_value\")\n  |> map(fn: (r) => ({\n      r with\n      _value: r._value / 1024\n    })\n  )",
+        "text": "from(bucket: \"my-bucket\")\n  |> range(start: v.timeRangeStart, stop: v.timeRangeStop)\n  |> filter(fn: (r) => r._measurement == \"httpd.access\")\n  |> filter(fn: (r) => r._field == \"code\")\n  |> drop(columns: [\"path\", \"method\", \"host\"])\n  |> toInt()\n  |> map(fn: (r) => ({   \n        _time: r._start,\n        _success:\n          if r._value < 300 then 1\n          else 0,\n        _failure:\n          if r._value >= 300 then 1\n          else 0\n       })\n    )\n  |> cumulativeSum(columns: [\"_failure\", \"_success\"])\n  |> drop(columns: [\"_time\"])\n  |> map(fn: (r) => ({\n    r with\n    _value: (float(v: r._success) / (float(v: r._success) + float(v: r._failure))) * 100.0\n  })\n)\n  |> last()",
         "editMode": "advanced",
         "name": "",
         "builderConfig": {
@@ -278,14 +348,28 @@
        }
       ],
       "prefix": "",
-      "suffix": " KiB",
+      "suffix": "%",
       "colors": [
        {
         "id": "base",
         "type": "text",
+        "hex": "#00C9FF",
+        "name": "laser",
+        "value": 0
+       },
+       {
+        "id": "5e50c5ba-51cc-4139-870f-663050d6e79d",
+        "type": "text",
         "hex": "#F48D38",
         "name": "tiger",
-        "value": 0
+        "value": 80
+       },
+       {
+        "id": "305d340f-09e5-4137-b88b-0a6599209dc0",
+        "type": "text",
+        "hex": "#7CE490",
+        "name": "honeydew",
+        "value": 90
        }
       ],
       "decimalPlaces": {
@@ -299,15 +383,15 @@
    },
    {
     "type": "view",
-    "id": "05155aef3daa2000",
+    "id": "0541db0ef0871000",
     "attributes": {
-     "name": "Success rate",
+     "name": "Requests",
      "properties": {
       "shape": "chronograf-v2",
-      "type": "single-stat",
+      "type": "table",
       "queries": [
        {
-        "text": "from(bucket: \"my-bucket\")\n  |> range(start: v.timeRangeStart, stop: v.timeRangeStop)\n  |> filter(fn: (r) => r._measurement == \"httpd.access\")\n  |> filter(fn: (r) => r._field == \"code\")\n  |> drop(columns: [\"path\", \"method\", \"host\"])\n  |> toInt()\n  |> map(fn: (r) => ({   \n        _time: r._start,\n        _success:\n          if r._value < 300 then 1\n          else 0,\n        _failure:\n          if r._value >= 300 then 1\n          else 0\n       })\n    )\n  |> cumulativeSum(columns: [\"_failure\", \"_success\"])\n  |> drop(columns: [\"_time\"])\n  |> map(fn: (r) => ({\n    r with\n    _value: (float(v: r._success) / (float(v: r._success) + float(v: r._failure))) * 100.0\n  })\n)\n  |> last()",
+        "text": "from(bucket: \"my-bucket\")\n  |> range(start: v.timeRangeStart, stop: v.timeRangeStop)\n  |> filter(fn: (r) => r._measurement == \"httpd.access\")",
         "editMode": "advanced",
         "name": "",
         "builderConfig": {
@@ -325,33 +409,75 @@
         }
        }
       ],
-      "prefix": "",
-      "suffix": "%",
       "colors": [
        {
         "id": "base",
         "type": "text",
         "hex": "#00C9FF",
         "name": "laser",
         "value": 0
+       }
+      ],
+      "tableOptions": {
+       "verticalTimeAxis": true,
+       "sortBy": {
+        "internalName": "",
+        "displayName": "",
+        "visible": false
        },
+       "wrapping": "",
+       "fixFirstColumn": false
+      },
+      "fieldOptions": [
        {
-        "id": "5e50c5ba-51cc-4139-870f-663050d6e79d",
-        "type": "text",
-        "hex": "#F48D38",
-        "name": "tiger",
-        "value": 80
+        "internalName": "_start",
+        "displayName": "_start",
+        "visible": false
        },
        {
-        "id": "305d340f-09e5-4137-b88b-0a6599209dc0",
-        "type": "text",
-        "hex": "#7CE490",
-        "name": "honeydew",
-        "value": 90
+        "internalName": "_stop",
+        "displayName": "_stop",
+        "visible": false
+       },
+       {
+        "internalName": "_time",
+        "displayName": "Time",
+        "visible": true
+       },
+       {
+        "internalName": "host",
+        "displayName": "Host",
+        "visible": true
+       },
+       {
+        "internalName": "path",
+        "displayName": "Path",
+        "visible": true
+       },
+       {
+        "internalName": "method",
+        "displayName": "Method",
+        "visible": true
+       },
+       {
+        "internalName": "_field",
+        "displayName": "Field",
+        "visible": true
+       },
+       {
+        "internalName": "_value",
+        "displayName": "Value",
+        "visible": true
+       },
+       {
+        "internalName": "_measurement",
+        "displayName": "_measurement",
+        "visible": false
        }
       ],
+      "timeFormat": "YYYY-MM-DD HH:mm:ss",
       "decimalPlaces": {
-       "isEnforced": true,
+       "isEnforced": false,
        "digits": 2
       },
       "note": "",