From f7a667616bef0782e55d6700f24c23f8c1b980a1 Mon Sep 17 00:00:00 2001
From: Oleh Omelchenko <ptrvtch@protonmail.com>
Date: Wed, 29 Jan 2025 16:59:29 +0200
Subject: [PATCH] Update chart configurations to set fixed width and enhance
 export options in quiz

---
 src/charts/areachart-original.vl.json         |  2 +-
 src/charts/areachart-ukrainian.vl.json        |  2 +-
 src/charts/barchart-original.vl.json          |  2 +-
 src/charts/barchart-ukrainian.vl.json         |  2 +-
 src/charts/bubblechart-original.vl.json       |  2 +-
 src/charts/bubblechart-ukrainian.vl.json      |  2 +-
 src/charts/choropleth-original.vl.json        |  2 +-
 src/charts/choropleth-ukrainian.vl.json       |  2 +-
 src/charts/histogram-original.vl.json         |  2 +-
 src/charts/histogram-ukrainian.vl.json        |  2 +-
 src/charts/linechart-original.vl.json         |  2 +-
 src/charts/linechart-ukrainian.vl.json        |  2 +-
 src/charts/piechart-original.vl.json          |  2 +-
 src/charts/piechart-ukrainian.vl.json         |  2 +-
 src/charts/scatterplot-original.vl.json       |  2 +-
 src/charts/scatterplot-ukrainian.vl.json      |  2 +-
 src/charts/stacked100-original.vl.json        |  2 +-
 src/charts/stacked100-ukrainian.vl.json       |  2 +-
 src/charts/stackedareachart-original.vl.json  |  2 +-
 src/charts/stackedareachart-ukrainian.vl.json |  2 +-
 src/charts/stackedbarchart-original.vl.json   |  2 +-
 src/charts/stackedbarchart-ukrainian.vl.json  |  2 +-
 src/js/quiz.js                                | 11 ++++++++++-
 23 files changed, 32 insertions(+), 23 deletions(-)

diff --git a/src/charts/areachart-original.vl.json b/src/charts/areachart-original.vl.json
index db7c6c4..84424b6 100644
--- a/src/charts/areachart-original.vl.json
+++ b/src/charts/areachart-original.vl.json
@@ -5,7 +5,7 @@
     "fontSize": 16,
     "fontWeight": "bold"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "data": {
     "values": [
diff --git a/src/charts/areachart-ukrainian.vl.json b/src/charts/areachart-ukrainian.vl.json
index 5c2856a..cab2c66 100644
--- a/src/charts/areachart-ukrainian.vl.json
+++ b/src/charts/areachart-ukrainian.vl.json
@@ -5,7 +5,7 @@
     "fontSize": 16,
     "fontWeight": "bold"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "data": {
     "values": [
diff --git a/src/charts/barchart-original.vl.json b/src/charts/barchart-original.vl.json
index 9c1b5d9..210ddda 100644
--- a/src/charts/barchart-original.vl.json
+++ b/src/charts/barchart-original.vl.json
@@ -8,7 +8,7 @@
   "data": {
     "url": "data/barchart.csv", "format": {"type": "csv"}
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "mark": {
     "type": "bar"
diff --git a/src/charts/barchart-ukrainian.vl.json b/src/charts/barchart-ukrainian.vl.json
index a7e2767..915c14d 100644
--- a/src/charts/barchart-ukrainian.vl.json
+++ b/src/charts/barchart-ukrainian.vl.json
@@ -8,7 +8,7 @@
   "data": {
     "url": "data/barchart.csv", "format": {"type": "csv"}
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "mark": {
     "type": "bar"
diff --git a/src/charts/bubblechart-original.vl.json b/src/charts/bubblechart-original.vl.json
index 6927623..ef75b34 100644
--- a/src/charts/bubblechart-original.vl.json
+++ b/src/charts/bubblechart-original.vl.json
@@ -5,7 +5,7 @@
       "fontSize": 16,
       "fontWeight": "bold"
     },
-    "width": "container",
+    "width": 800,
     "height": 400,
     "data": {
       "url": "data/bubblechart.csv"
diff --git a/src/charts/bubblechart-ukrainian.vl.json b/src/charts/bubblechart-ukrainian.vl.json
index a111fd2..ac90ddd 100644
--- a/src/charts/bubblechart-ukrainian.vl.json
+++ b/src/charts/bubblechart-ukrainian.vl.json
@@ -5,7 +5,7 @@
       "fontSize": 16,
       "fontWeight": "bold"
     },
-    "width": "container",
+    "width": 800,
     "height": 400,
     "data": {
       "url": "data/bubblechart.csv"
diff --git a/src/charts/choropleth-original.vl.json b/src/charts/choropleth-original.vl.json
index a2a5da2..a148cb9 100644
--- a/src/charts/choropleth-original.vl.json
+++ b/src/charts/choropleth-original.vl.json
@@ -5,7 +5,7 @@
       "fontSize": 16,
       "fontWeight": "bold"
     },
-    "width": "container",
+    "width": 800,
     "height": 500,
     "projection": {
       "type": "albersUsa"
diff --git a/src/charts/choropleth-ukrainian.vl.json b/src/charts/choropleth-ukrainian.vl.json
index 102101a..78bb9b1 100644
--- a/src/charts/choropleth-ukrainian.vl.json
+++ b/src/charts/choropleth-ukrainian.vl.json
@@ -1,7 +1,7 @@
 {
   "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
   "height": 500,
-  "width": "container",
+  "width": 800,
   "title": "Кількість шлюбів в першому півріччі 2024 р.",
   "config": {
     "padding": 0,
diff --git a/src/charts/histogram-original.vl.json b/src/charts/histogram-original.vl.json
index 7e2c594..006eadf 100644
--- a/src/charts/histogram-original.vl.json
+++ b/src/charts/histogram-original.vl.json
@@ -5,7 +5,7 @@
     "fontSize": 16,
     "fontWeight": "bold"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "data": {
     "url": "data/histogram.csv"
diff --git a/src/charts/histogram-ukrainian.vl.json b/src/charts/histogram-ukrainian.vl.json
index 7428480..2f134ba 100644
--- a/src/charts/histogram-ukrainian.vl.json
+++ b/src/charts/histogram-ukrainian.vl.json
@@ -5,7 +5,7 @@
     "fontSize": 16,
     "fontWeight": "bold"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "data": {
     "url": "data/histogram.csv"
diff --git a/src/charts/linechart-original.vl.json b/src/charts/linechart-original.vl.json
index 032934b..695ae10 100644
--- a/src/charts/linechart-original.vl.json
+++ b/src/charts/linechart-original.vl.json
@@ -1,6 +1,6 @@
 {
   "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
-  "width": "container",
+  "width": 800,
   "height": 400,
   "title": "Oil Prices",
   "data": {
diff --git a/src/charts/linechart-ukrainian.vl.json b/src/charts/linechart-ukrainian.vl.json
index a899d74..8d1d7b9 100644
--- a/src/charts/linechart-ukrainian.vl.json
+++ b/src/charts/linechart-ukrainian.vl.json
@@ -1,6 +1,6 @@
 {
   "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
-  "width": "container",
+  "width": 800,
   "height": 400,
   "title": "Ціни на нафту",
   "data": {
diff --git a/src/charts/piechart-original.vl.json b/src/charts/piechart-original.vl.json
index 85d8ec8..48ff5c9 100644
--- a/src/charts/piechart-original.vl.json
+++ b/src/charts/piechart-original.vl.json
@@ -12,7 +12,7 @@
         "titleFontWeight": "bold"
       }
     },
-    "width": "container", "height": 400,
+    "width": 800, "height": 400,
     "data": {
       "values": [        
         {"brand": "Samsung", "share": 17.6},
diff --git a/src/charts/piechart-ukrainian.vl.json b/src/charts/piechart-ukrainian.vl.json
index 6bf49c4..e288944 100644
--- a/src/charts/piechart-ukrainian.vl.json
+++ b/src/charts/piechart-ukrainian.vl.json
@@ -12,7 +12,7 @@
         "titleFontWeight": "bold"
       }
     },
-    "width": "container", "height": 400,
+    "width": 800, "height": 400,
     "data": {
       "values": [        
         {"brand": "Samsung", "share": 17.6},
diff --git a/src/charts/scatterplot-original.vl.json b/src/charts/scatterplot-original.vl.json
index 335d0f4..db0db2d 100644
--- a/src/charts/scatterplot-original.vl.json
+++ b/src/charts/scatterplot-original.vl.json
@@ -5,7 +5,7 @@
     "fontSize": 16,
     "fontWeight": "bold"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "data": {
     "url": "data/scatterplot.csv"
diff --git a/src/charts/scatterplot-ukrainian.vl.json b/src/charts/scatterplot-ukrainian.vl.json
index 4adb613..ae3e246 100644
--- a/src/charts/scatterplot-ukrainian.vl.json
+++ b/src/charts/scatterplot-ukrainian.vl.json
@@ -5,7 +5,7 @@
     "fontSize": 16,
     "fontWeight": "bold"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "data": {
     "url": "data/scatterplot.csv"
diff --git a/src/charts/stacked100-original.vl.json b/src/charts/stacked100-original.vl.json
index ba1f740..56e5c24 100644
--- a/src/charts/stacked100-original.vl.json
+++ b/src/charts/stacked100-original.vl.json
@@ -8,7 +8,7 @@
   "data": {
     "url": "data/stacked100.csv"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "encoding": {
     "y": {
diff --git a/src/charts/stacked100-ukrainian.vl.json b/src/charts/stacked100-ukrainian.vl.json
index 497a22d..eeecab7 100644
--- a/src/charts/stacked100-ukrainian.vl.json
+++ b/src/charts/stacked100-ukrainian.vl.json
@@ -8,7 +8,7 @@
   "data": {
     "url": "data/stacked100.csv"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "encoding": {
     "y": {
diff --git a/src/charts/stackedareachart-original.vl.json b/src/charts/stackedareachart-original.vl.json
index a5acd55..8cc2c23 100644
--- a/src/charts/stackedareachart-original.vl.json
+++ b/src/charts/stackedareachart-original.vl.json
@@ -5,7 +5,7 @@
         "fontSize": 16,
         "fontWeight": "bold"
     },
-    "width": "container",
+    "width": 800,
     "height": 400,
     "data": {
         "values": [
diff --git a/src/charts/stackedareachart-ukrainian.vl.json b/src/charts/stackedareachart-ukrainian.vl.json
index dff2bc5..384f52b 100644
--- a/src/charts/stackedareachart-ukrainian.vl.json
+++ b/src/charts/stackedareachart-ukrainian.vl.json
@@ -5,7 +5,7 @@
         "fontSize": 16,
         "fontWeight": "bold"
     },
-    "width": "container",
+    "width": 800,
     "height": 400,
     "data": {
         "values": [
diff --git a/src/charts/stackedbarchart-original.vl.json b/src/charts/stackedbarchart-original.vl.json
index 1416edc..9149bbc 100644
--- a/src/charts/stackedbarchart-original.vl.json
+++ b/src/charts/stackedbarchart-original.vl.json
@@ -6,7 +6,7 @@
   "data": {
     "url": "data/stackedbarchart.csv"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "encoding": {
     "x": {
diff --git a/src/charts/stackedbarchart-ukrainian.vl.json b/src/charts/stackedbarchart-ukrainian.vl.json
index f9b5c50..3dec055 100644
--- a/src/charts/stackedbarchart-ukrainian.vl.json
+++ b/src/charts/stackedbarchart-ukrainian.vl.json
@@ -6,7 +6,7 @@
   "data": {
     "url": "data/stackedbarchart.csv"
   },
-  "width": "container",
+  "width": 800,
   "height": 400,
   "encoding": {
     "x": {
diff --git a/src/js/quiz.js b/src/js/quiz.js
index 04e5801..201f55c 100644
--- a/src/js/quiz.js
+++ b/src/js/quiz.js
@@ -79,7 +79,16 @@ document.addEventListener('DOMContentLoaded', function () {
 
         // Embed the Vega-Lite chart
         const embedOptions = {
-            actions: false, // Disable kebab menu
+            downloadFileName: `${question.chart}-${version}`,
+            actions: {
+                export: {
+                    svg: true,
+                    png: true
+                },
+                source: false,
+                compiled: false,
+                editor: false
+            },
             tooltip: false  // Disable tooltips
         };