Adding vue copy/paste from daggy

2022-10-07 12:25:41 -03:00
parent 6b49038db6
commit e711b3249b
33 changed files with 4831 additions and 42 deletions
@@ -0,0 +1,39 @@
+function renderDetails(segment) {
+    document.getElementById("details").innerHTML = JSON.stringify(segment);
+}
+
+fetch("http://localhost:2503/api/v1/details",
+  {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json'
+    },
+    body: '{ "start": "2021-09-01T00:00:00Z", "end": "2022-10-01T00:00:00Z" }'
+  }
+)
+  .then((response) =>  {
+    if (!response.ok) {
+      throw new Error('Network response was not OK');
+    }
+    return response.json();
+  })
+  .then((payload) => {
+    console.log(payload);
+    payload.map((group) => {
+      Object.values(group.data).map((label) => {
+        label.data.map((interval) => {
+          interval.timeRange = interval.timeRange.map((t) => new Date(t));
+        })
+      })
+    });
+    TimelinesChart()
+    (document.getElementById("timeline"))
+      .timeFormat("%Y-%m-%dT%H:%M:%S.%LZ")    // ISO 8601 format
+      .zScaleLabel('State')
+      .zQualitative(true)
+      .useUtc(false)
+      .onSegmentClick(renderDetails)
+      .data(payload)
+  }
+  )
+  .catch(err => { throw err });
@@ -0,0 +1,9 @@
+<html>
+  <script src="https://unpkg.com/timelines-chart"></script>
+</html>
+<body>
+  <div id="timeline"></div>
+  <div id="details"></div>
+  <script src="app.js"></script>
+</body>
+</html>