Build some cool new datasets

cns-iu · Feb 29, 2024 · a49b984 · a49b984
1 parent a8cc903
commit a49b984
Show file tree

Hide file tree

Showing 6 changed files with 3,050 additions and 426 deletions.
diff --git a/docs/datasets.json b/docs/datasets.json
diff --git a/docs/sample-data/datasets.json b/docs/sample-data/datasets.json
@@ -0,0 +1,24 @@
+[
+  {
+    "label": "Region_D265-12",
+    "nodes":"./Region_D265-12.csv",
+    "edges":"./Region_D265-12.edges.csv",
+    "color-map":"./Region_D265-12.color_mapping.csv",
+    "color-map-key":"cell_type",
+    "color-map-value":"cell_color",
+    "node-target-key":"Cell Type",
+    "node-target-value":"Endothelial",
+    "max-edge-distance":"1000"
+  },
+  {
+    "label": "Region_D265-11",
+    "nodes":"./Region_D265-11.csv",
+    "edges":"./Region_D265-11.edges.csv",
+    "color-map":"./Region_D265-11.color_mapping.csv",
+    "color-map-key":"cell_type",
+    "color-map-value":"cell_color",
+    "node-target-key":"type",
+    "node-target-value":"Lymphatic Endothelial Cell (and some immune cells)",
+    "max-edge-distance":"1000"
+  }
+]
diff --git a/docs/sample-data/index.html b/docs/sample-data/index.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <title>Test hra-node-dist-vis Web Component</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <script src="../hra-node-dist-vis.wc.js"></script>
+    <script src="../demo.js"></script>
+
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet" />
+    <script src="https://apps.humanatlas.io/components/hra-app-shell.wc.js"></script>
+  </head>
+
+  <body>
+    <hra-app-shell logo-text="HRA Cell Type Distance Visualizations" logo-text-small="HRA Dist Vis"
+      logo-url="https://lod.humanatlas.io/" hide-menu>
+      <div class="main">
+        <div class="card-container">
+          <div class="card">
+            <h3>Select a dataset</h3>
+            <md-filled-select id="dataset-input">
+            </md-filled-select>
+          </div>
+        </div>
+        <div style="height: 90vh;background-color: #333;">
+          <hra-node-dist-vis id="vis"></hra-node-dist-vis>
+        </div>
+      </div>
+    </body>
+</html>