From c59d5bb26338dce2ec743d6a6736ed2452e70458 Mon Sep 17 00:00:00 2001 From: Oleh Omelchenko Date: Thu, 30 Jan 2025 10:18:24 +0200 Subject: [PATCH] Enhance chart embedding with responsive design and custom export options --- public/all-charts.html | 46 +++++++++++++++++++++++++++++++++++++++++- 1 file changed, 45 insertions(+), 1 deletion(-) diff --git a/public/all-charts.html b/public/all-charts.html index 692ea12..baf5c0a 100644 --- a/public/all-charts.html +++ b/public/all-charts.html @@ -9,6 +9,20 @@ +
@@ -37,9 +51,39 @@ if (question) { const chartContainer = document.createElement('div'); chartContainer.id = `chart-${question.chart}-${version}`; + chartContainer.className = 'chart-container'; allChartsContainer.appendChild(chartContainer); const chartFile = `charts/${question.chart}-${version}.vl.json`; - vegaEmbed(`#chart-${question.chart}-${version}`, chartFile) + + // Embed the Vega-Lite chart with custom options + const embedOptions = { + downloadFileName: `${question.chart}-${version}`, + actions: { + export: { + svg: true, + png: true + }, + source: false, + compiled: false, + editor: false + }, + tooltip: false, // Disable tooltips + }; + + if (version === 'ukrainian') { + embedOptions.timeFormatLocale = { + dateTime: "%A, %e %B %Y р. %X", + date: "%d.%m.%Y", + time: "%H:%M:%S", + periods: ["", ""], + days: ["неділя", "понеділок", "вівторок", "середа", "четвер", "п'ятниця", "субота"], + shortDays: ["нд", "пн", "вт", "ср", "чт", "пт", "сб"], + months: ["січень", "лютий", "березень", "квітень", "травень", "червень", "липень", "серпень", "вересень", "жовтень", "листопад", "грудень"], + shortMonths: ["січ", "лют", "бер", "кві", "тра", "чер", "лип", "сер", "вер", "жов", "лис", "гру"] + }; + } + + vegaEmbed(`#chart-${question.chart}-${version}`, chartFile, embedOptions) .catch(error => console.error('Error embedding chart:', error)); } });