From b72014c7de8e9cb7311b1d60ef3895f7060082d8 Mon Sep 17 00:00:00 2001 From: Christopher Lam Date: Sat, 26 Sep 2020 17:43:17 +0800 Subject: [PATCH] Bug 797893 - Unable to change font size in charts The bug specifies chart fonts are not customisable. We can copy the (gnucash) stylesheet properties which define

and font styles onto chartjs properties. --- gnucash/report/html-chart.scm | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/gnucash/report/html-chart.scm b/gnucash/report/html-chart.scm index 70d3d49ea6..3a0c797063 100644 --- a/gnucash/report/html-chart.scm +++ b/gnucash/report/html-chart.scm @@ -186,7 +186,6 @@ (cons 'display #t) (cons 'labelString ""))) (cons 'ticks (list - (cons 'fontSize 12) (cons 'maxRotation 30)))) ;; the following another xAxis at the top '((position . top) @@ -205,7 +204,6 @@ (cons 'display 1.5) (cons 'labelString ""))) (cons 'ticks (list - (cons 'fontSize 10) (cons 'beginAtZero #f)))) ;; the following another yAxis on the right '((position . right) @@ -215,7 +213,6 @@ )))) (cons 'title (list (cons 'display #t) - (cons 'fontSize 16) (cons 'fontStyle "") (cons 'text "")))))) "XXX" ;currency-iso @@ -348,6 +345,17 @@ Chart.pluginService.register({ } }) +// copy font info from css into chartjs. +bodyStyle = window.getComputedStyle (document.querySelector ('body')); +Chart.defaults.global.defaultFontSize = parseInt (bodyStyle.fontSize); +Chart.defaults.global.defaultFontFamily = bodyStyle.fontFamily; +Chart.defaults.global.defaultFontStyle = bodyStyle.fontStyle; + +titleStyle = window.getComputedStyle (document.querySelector ('h3')); +chartjsoptions.options.title.fontSize = parseInt (titleStyle.fontSize); +chartjsoptions.options.title.fontFamily = titleStyle.fontFamily; +chartjsoptions.options.title.fontStyle = titleStyle.fontStyle; + document.getElementById(chartid).onclick = function(evt) { var activepoints = myChart.getElementAtEvent(evt); var anchor = document.getElementById(jumpid); @@ -403,6 +411,8 @@ document.getElementById(chartid).onclick = function(evt) { (push (gnc:html-js-include (gnc-path-find-localized-html-file "chartjs/Chart.bundle.min.js"))) + ;; the following hidden h3 is used to query style and copy onto chartjs + (push "

") (push (format #f "
\n" (size->str (gnc:html-chart-width chart)) (size->str (gnc:html-chart-height chart)))) @@ -428,7 +438,6 @@ document.getElementById(chartid).onclick = function(evt) { (push "chartjsoptions.options.tooltips.callbacks.label = tooltipLabel;\n") (push "chartjsoptions.options.tooltips.callbacks.title = tooltipTitle;\n") - (push "Chart.defaults.global.defaultFontFamily = \"'Trebuchet MS', Arial, Helvetica, sans-serif\";\n") (push JS-setup) (push "var myChart = new Chart(chartid, chartjsoptions);\n")