Add files via upload

csaladenes · web-flow · commit c926de977dac · 2023-11-15T21:08:32.000+03:00
diff --git a/visualization.html b/visualization.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <script src="https://cdn.jsdelivr.net/npm/vega@5.25.0"></script>
+  <script src="https://cdn.jsdelivr.net/npm/vega-lite@5.16.1"></script>
+  <script src="https://cdn.jsdelivr.net/npm/vega-embed@6.22.2"></script>
+</head>
+<body>
+  <div id="vis"/>
+  <script>
+    const spec = {
+  "data": {"url": "https://data.csaladen.es/songs_and_popularity.csv"},
+  "layer": [
+    {
+      "mark": {"type": "boxplot", "size": 3},
+      "width": 150,
+      "height": 100,
+      "encoding": {
+        "x": {"field": "ReleasedYear", "type": "temporal"},
+        "y": {
+          "field": "LyricalContent",
+          "type": "quantitative",
+          "aggregate": "median"
+        }
+      }
+    },
+    {
+      "mark": {"type": "line", "size": 3, "color": "red"},
+      "width": 150,
+      "height": 100,
+      "encoding": {
+        "x": {"field": "ReleasedYear", "type": "temporal"},
+        "y": {
+          "field": "LyricalContent",
+          "type": "quantitative",
+          "aggregate": "median"
+        }
+      }
+    }
+  ],
+  "config": {}
+};
+    vegaEmbed("#vis", spec, {mode: "vega-lite"}).then(console.log).catch(console.warn);
+  </script>
+</body>
+</html>
