From 8ed5b944ad4ff0429da320b38642e8d552706444 Mon Sep 17 00:00:00 2001 From: Paul-Christian Volkmer Date: Fri, 9 Jan 2026 10:38:30 +0100 Subject: fix: possible sorting errors in bar chart (#241) --- src/web/charts.js | 48 ++++++++++++++++++++++++++++++++++-------------- src/web/main.js | 4 ++-- 2 files changed, 36 insertions(+), 16 deletions(-) (limited to 'src/web') diff --git a/src/web/charts.js b/src/web/charts.js index 4826696..866e60d 100644 --- a/src/web/charts.js +++ b/src/web/charts.js @@ -58,13 +58,13 @@ export function drawPieChart(url, elemId, title, data) { } else { fetch(url) .then(resp => resp.json()) - .then(d => { - draw(elemId, title, d); - update(elemId, d); + .then(data => { + draw(elemId, title, data); + update(elemId, data); }); } - function update(elemId, data) { + const update = (elemId, data) => { let chartDom = document.getElementById(elemId); let chart = echarts.init(chartDom, null, {renderer: 'svg'}); @@ -92,7 +92,7 @@ export function drawPieChart(url, elemId, title, data) { option && chart.setOption(option); } - function draw(elemId, title, data) { + const draw = (elemId, title, data) => { let chartDom = document.getElementById(elemId); let chart = echarts.init(chartDom, null, {renderer: 'svg'}); let option= { @@ -124,18 +124,12 @@ export function drawBarChart(url, elemId, title, data) { }); } - function update(elemId, data) { + const update = (elemId, data) => { let chartDom = document.getElementById(elemId); let chart = echarts.init(chartDom, null, {renderer: 'svg'}); let option = { series: [ - { - name: 'UNKNOWN', - type: 'bar', - stack: 'total', - data: data.map(i => i.nameValues.unknown) - }, { name: 'ERROR', type: 'bar', @@ -154,11 +148,29 @@ export function drawBarChart(url, elemId, title, data) { stack: 'total', data: data.map(i => i.nameValues.success) }, + { + name: 'NO_CONSENT', + type: 'bar', + stack: 'total', + data: data.map(i => i.nameValues.no_consent) + }, { name: 'DUPLICATION', type: 'bar', stack: 'total', data: data.map(i => i.nameValues.duplication) + }, + { + name: 'BLOCKED_INITIAL', + type: 'bar', + stack: 'total', + data: data.map(i => i.nameValues.blocked_initial) + }, + { + name: 'UNKNOWN', + type: 'bar', + stack: 'total', + data: data.map(i => i.nameValues.unknown) } ] }; @@ -166,7 +178,7 @@ export function drawBarChart(url, elemId, title, data) { option && chart.setOption(option); } - function draw(elemId, title, data) { + const draw = (elemId, title, data) => { let chartDom = document.getElementById(elemId); let chart = echarts.init(chartDom, null, {renderer: 'svg'}); let option= { @@ -185,7 +197,15 @@ export function drawBarChart(url, elemId, title, data) { tooltip: { trigger: 'item' }, - color: ['slategray', 'red', 'darkorange', 'green', 'slategray'], + color: [ + '#FF0000', + '#FF8C00', + '#008000', + '#004A9D', + '#708090', + '#708090', + '#708090' + ], animationDuration: 250, animationDurationUpdate: 250 }; diff --git a/src/web/main.js b/src/web/main.js index ca1ecc9..b72396a 100644 --- a/src/web/main.js +++ b/src/web/main.js @@ -1,4 +1,4 @@ -import * as styles from './style.css'; +import './style.css'; import 'htmx.org'; @@ -8,7 +8,7 @@ const dateTimeFormat = new Intl.DateTimeFormat('de-DE', dateTimeFormatOptions); const formatTimeElements = () => { Array.from(document.getElementsByTagName('time')).forEach((timeTag) => { let date = Date.parse(timeTag.getAttribute('datetime')); - if (! isNaN(date)) { + if (! Number.isNaN(date)) { timeTag.innerText = dateTimeFormat.format(date); } }); -- cgit v1.2.3