Resolve fonts through options.font (#7674)

* Resolve fonts through options.font
* Remove defaultRoutes from Tooltip fonts

diff --git a/src/core/core.scale.js b/src/core/core.scale.js
index d08ac4ffcd3c1bb811ff6fab13711ee51297b745..c8fc02bbcb166799ecdc69920d8ab1d09b2ffa95 100644 (file)
--- a/src/core/core.scale.js
+++ b/src/core/core.scale.js
@@ -142,12 +142,12 @@ function getTickMarkLength(options) {
 /**
  * @param {object} options
  */
-function getScaleLabelHeight(options) {
+function getScaleLabelHeight(options, fallback) {
        if (!options.display) {
                return 0;
        }
 
-       const font = toFont(options.font);
+       const font = toFont(options.font, fallback);
        const padding = toPadding(options.padding);
 
        return font.lineHeight + padding.height;
@@ -673,7 +673,7 @@ export default class Scale extends Element {
                if (maxLabelWidth + 6 > tickWidth) {
                        tickWidth = maxWidth / (numTicks - (options.offset ? 0.5 : 1));
                        maxHeight = me.maxHeight - getTickMarkLength(options.gridLines)
-                               - tickOpts.padding - getScaleLabelHeight(options.scaleLabel);
+                               - tickOpts.padding - getScaleLabelHeight(options.scaleLabel, me.chart.options.font);
                        maxLabelDiagonal = Math.sqrt(maxLabelWidth * maxLabelWidth + maxLabelHeight * maxLabelHeight);
                        labelRotation = toDegrees(Math.min(
                                Math.asin(Math.min((labelSizes.highest.height + 6) / tickWidth, 1)),
@@ -709,19 +709,20 @@ export default class Scale extends Element {
                const display = me._isVisible();
                const labelsBelowTicks = opts.position !== 'top' && me.axis === 'x';
                const isHorizontal = me.isHorizontal();
+               const scaleLabelHeight = display && getScaleLabelHeight(scaleLabelOpts, chart.options.font);
 
                // Width
                if (isHorizontal) {
                        minSize.width = me.maxWidth;
                } else if (display) {
-                       minSize.width = getTickMarkLength(gridLineOpts) + getScaleLabelHeight(scaleLabelOpts);
+                       minSize.width = getTickMarkLength(gridLineOpts) + scaleLabelHeight;
                }
 
                // height
                if (!isHorizontal) {
                        minSize.height = me.maxHeight; // fill all the height
                } else if (display) {
-                       minSize.height = getTickMarkLength(gridLineOpts) + getScaleLabelHeight(scaleLabelOpts);
+                       minSize.height = getTickMarkLength(gridLineOpts) + scaleLabelHeight;
                }
 
                // Don't bother fitting the ticks if we are not showing the labels
@@ -1460,7 +1461,7 @@ export default class Scale extends Element {
                        return;
                }
 
-               const scaleLabelFont = toFont(scaleLabel.font);
+               const scaleLabelFont = toFont(scaleLabel.font, me.chart.options.font);
                const scaleLabelPadding = toPadding(scaleLabel.padding);
                const halfLineHeight = scaleLabelFont.lineHeight / 2;
                const scaleLabelAlign = scaleLabel.align;
@@ -1594,15 +1595,16 @@ export default class Scale extends Element {
         */
        _resolveTickFontOptions(index) {
                const me = this;
+               const chart = me.chart;
                const options = me.options.ticks;
                const ticks = me.ticks || [];
                const context = {
-                       chart: me.chart,
+                       chart,
                        scale: me,
                        tick: ticks[index],
                        index
                };
-               return toFont(resolve([options.font], context));
+               return toFont(resolve([options.font], context), chart.options.font);
        }
 }
 

diff --git a/src/helpers/helpers.options.js b/src/helpers/helpers.options.js
index c6dd6ef14279e716cb58c4e9557aec8c9c491a60..540f7c250431679406f05ad402053d25fe111cde 100644 (file)
--- a/src/helpers/helpers.options.js
+++ b/src/helpers/helpers.options.js
@@ -67,27 +67,29 @@ export function toPadding(value) {
 /**
  * Parses font options and returns the font object.
  * @param {object} options - A object that contains font options to be parsed.
+ * @param {object} [fallback] - A object that contains fallback font options.
  * @return {object} The font object.
  * @private
  */
-export function toFont(options) {
-       const defaultFont = defaults.font;
+export function toFont(options, fallback) {
        options = options || {};
-       let size = valueOrDefault(options.size, defaultFont.size);
+       fallback = fallback || defaults.font;
+
+       let size = valueOrDefault(options.size, fallback.size);
 
        if (typeof size === 'string') {
                size = parseInt(size, 10);
        }
 
        const font = {
-               color: valueOrDefault(options.color, defaultFont.color),
-               family: valueOrDefault(options.family, defaultFont.family),
-               lineHeight: toLineHeight(valueOrDefault(options.lineHeight, defaultFont.lineHeight), size),
-               lineWidth: valueOrDefault(options.lineWidth, defaultFont.lineWidth),
+               color: valueOrDefault(options.color, fallback.color),
+               family: valueOrDefault(options.family, fallback.family),
+               lineHeight: toLineHeight(valueOrDefault(options.lineHeight, fallback.lineHeight), size),
+               lineWidth: valueOrDefault(options.lineWidth, fallback.lineWidth),
                size,
-               style: valueOrDefault(options.style, defaultFont.style),
-               weight: valueOrDefault(options.weight, defaultFont.weight),
-               strokeStyle: valueOrDefault(options.strokeStyle, defaultFont.strokeStyle),
+               style: valueOrDefault(options.style, fallback.style),
+               weight: valueOrDefault(options.weight, fallback.weight),
+               strokeStyle: valueOrDefault(options.strokeStyle, fallback.strokeStyle),
                string: ''
        };
 

diff --git a/src/plugins/plugin.legend.js b/src/plugins/plugin.legend.js
index ad32e47c718c6aeea64e75b3109d24761ed9e683..0bd8d1d1af60c52cbd613fea6eee9eae7a934d87 100644 (file)
--- a/src/plugins/plugin.legend.js
+++ b/src/plugins/plugin.legend.js
@@ -178,7 +178,7 @@ export class Legend extends Element {
                const display = opts.display;
 
                const ctx = me.ctx;
-               const labelFont = toFont(labelOpts.font);
+               const labelFont = toFont(labelOpts.font, me.chart.options.font);
                const fontSize = labelFont.size;
                const boxWidth = getBoxWidth(labelOpts, fontSize);
                const boxHeight = getBoxHeight(labelOpts, fontSize);
@@ -304,7 +304,7 @@ export class Legend extends Element {
                me.drawTitle();
                const rtlHelper = getRtlAdapter(opts.rtl, me.left, me._minSize.width);
                const ctx = me.ctx;
-               const labelFont = toFont(labelOpts.font);
+               const labelFont = toFont(labelOpts.font, me.chart.options.font);
                const fontColor = labelFont.color;
                const fontSize = labelFont.size;
                let cursor;
@@ -469,7 +469,7 @@ export class Legend extends Element {
                const me = this;
                const opts = me.options;
                const titleOpts = opts.title;
-               const titleFont = toFont(titleOpts.font);
+               const titleFont = toFont(titleOpts.font, me.chart.options.font);
                const titlePadding = toPadding(titleOpts.padding);
 
                if (!titleOpts.display) {
@@ -551,7 +551,7 @@ export class Legend extends Element {
         */
        _computeTitleHeight() {
                const titleOpts = this.options.title;
-               const titleFont = toFont(titleOpts.font);
+               const titleFont = toFont(titleOpts.font, this.chart.options.font);
                const titlePadding = toPadding(titleOpts.padding);
                return titleOpts.display ? titleFont.lineHeight + titlePadding.height : 0;
        }

diff --git a/src/plugins/plugin.title.js b/src/plugins/plugin.title.js
index 50d722f10e1ec148f79762c733888826310d7924..594615a9b3555d239c108ad32f567a83f2f801b8 100644 (file)
--- a/src/plugins/plugin.title.js
+++ b/src/plugins/plugin.title.js
@@ -107,7 +107,7 @@ export class Title extends Element {
 
                const lineCount = isArray(opts.text) ? opts.text.length : 1;
                me._padding = toPadding(opts.padding);
-               const textSize = lineCount * toFont(opts.font).lineHeight + me._padding.height;
+               const textSize = lineCount * toFont(opts.font, me.chart.options.font).lineHeight + me._padding.height;
                me.width = minSize.width = isHorizontal ? me.maxWidth : textSize;
                me.height = minSize.height = isHorizontal ? textSize : me.maxHeight;
        }
@@ -130,7 +130,7 @@ export class Title extends Element {
                        return;
                }
 
-               const fontOpts = toFont(opts.font);
+               const fontOpts = toFont(opts.font, me.chart.options.font);
                const lineHeight = fontOpts.lineHeight;
                const offset = lineHeight / 2 + me._padding.top;
                let rotation = 0;

diff --git a/src/plugins/plugin.tooltip.js b/src/plugins/plugin.tooltip.js
index f0e03f9b199790967cc1ecbff816d6bf1ef9a8e9..67299892bb2c996d03d4cd7071c07dc7e212c9b7 100644 (file)
--- a/src/plugins/plugin.tooltip.js
+++ b/src/plugins/plugin.tooltip.js
@@ -135,14 +135,15 @@ function createTooltipItem(chart, item) {
 /**
  * Helper to get the reset model for the tooltip
  * @param options {object} the tooltip options
+ * @param fallbackFont {object} the fallback font options
  */
-function resolveOptions(options) {
+function resolveOptions(options, fallbackFont) {
 
        options = merge({}, [defaults.plugins.tooltip, options]);
 
-       options.bodyFont = toFont(options.bodyFont);
-       options.titleFont = toFont(options.titleFont);
-       options.footerFont = toFont(options.footerFont);
+       options.bodyFont = toFont(options.bodyFont, fallbackFont);
+       options.titleFont = toFont(options.titleFont, fallbackFont);
+       options.footerFont = toFont(options.footerFont, fallbackFont);
 
        options.boxHeight = valueOrDefault(options.boxHeight, options.bodyFont.size);
        options.boxWidth = valueOrDefault(options.boxWidth, options.bodyFont.size);
@@ -388,7 +389,8 @@ export class Tooltip extends Element {
 
        initialize() {
                const me = this;
-               me.options = resolveOptions(me._chart.options.tooltips);
+               const chartOpts = me._chart.options;
+               me.options = resolveOptions(chartOpts.tooltips, chartOpts.font);
        }
 
        /**
@@ -1114,5 +1116,5 @@ export default {
                        footer: noop,
                        afterFooter: noop
                }
-       }
+       },
 };

diff --git a/src/scales/scale.radialLinear.js b/src/scales/scale.radialLinear.js
index fa1f7caa4671a0a74b131c9efa0f44c0ff168f77..93d60cfad94067432abea318280b35bd5d733a36 100644 (file)
--- a/src/scales/scale.radialLinear.js
+++ b/src/scales/scale.radialLinear.js
@@ -102,7 +102,7 @@ function fitWithPointLabels(scale) {
                        index: i,
                        label: scale.pointLabels[i]
                };
-               const plFont = toFont(resolve([scale.options.pointLabels.font], context, i));
+               const plFont = toFont(resolve([scale.options.pointLabels.font], context, i), scale.chart.options.font);
                scale.ctx.font = plFont.string;
                textSize = measureLabelSize(scale.ctx, plFont.lineHeight, scale.pointLabels[i]);
                scale._pointLabelSizes[i] = textSize;
@@ -191,7 +191,7 @@ function drawPointLabels(scale) {
                        index: i,
                        label: scale.pointLabels[i],
                };
-               const plFont = toFont(resolve([pointLabelOpts.font], context, i));
+               const plFont = toFont(resolve([pointLabelOpts.font], context, i), scale.chart.options.font);
                ctx.font = plFont.string;
                ctx.fillStyle = plFont.color;
 

diff --git a/test/specs/plugin.title.tests.js b/test/specs/plugin.title.tests.js
index 31fa3bbbba43f92bbc3f74fa02495e0bc291a916..69d592715ddf9abadfc5b3fe23165b8c0c01ed2c 100644 (file)
--- a/test/specs/plugin.title.tests.js
+++ b/test/specs/plugin.title.tests.js
@@ -19,7 +19,9 @@ describe('Title block tests', function() {
        });
 
        it('should update correctly', function() {
-               var chart = {};
+               var chart = {
+                       options: Chart.helpers.clone(Chart.defaults)
+               };
 
                var options = Chart.helpers.clone(Chart.defaults.plugins.title);
                options.text = 'My title';
@@ -44,7 +46,9 @@ describe('Title block tests', function() {
        });
 
        it('should update correctly when vertical', function() {
-               var chart = {};
+               var chart = {
+                       options: Chart.helpers.clone(Chart.defaults)
+               };
 
                var options = Chart.helpers.clone(Chart.defaults.plugins.title);
                options.text = 'My title';
@@ -70,7 +74,9 @@ describe('Title block tests', function() {
        });
 
        it('should have the correct size when there are multiple lines of text', function() {
-               var chart = {};
+               var chart = {
+                       options: Chart.helpers.clone(Chart.defaults)
+               };
 
                var options = Chart.helpers.clone(Chart.defaults.plugins.title);
                options.text = ['line1', 'line2'];
@@ -90,7 +96,9 @@ describe('Title block tests', function() {
        });
 
        it('should draw correctly horizontally', function() {
-               var chart = {};
+               var chart = {
+                       options: Chart.helpers.clone(Chart.defaults)
+               };
                var context = window.createMockContext();
 
                var options = Chart.helpers.clone(Chart.defaults.plugins.title);
@@ -142,7 +150,9 @@ describe('Title block tests', function() {
        });
 
        it ('should draw correctly vertically', function() {
-               var chart = {};
+               var chart = {
+                       options: Chart.helpers.clone(Chart.defaults)
+               };
                var context = window.createMockContext();
 
                var options = Chart.helpers.clone(Chart.defaults.plugins.title);