From 9d6c43ecd3b25bf54d32545325527007b081aa11 Mon Sep 17 00:00:00 2001 From: Jeffrey Wang Date: Wed, 28 Feb 2018 18:48:15 -0500 Subject: [PATCH] Make margin width based on container width instead of slice width (#4487) * Make width based on container width instead of slice width * fix const var name and add comment * Actually 30 looks good too --- superset/assets/visualizations/nvd3_vis.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/superset/assets/visualizations/nvd3_vis.js b/superset/assets/visualizations/nvd3_vis.js index b60c32a0e57c..ef544065228d 100644 --- a/superset/assets/visualizations/nvd3_vis.js +++ b/superset/assets/visualizations/nvd3_vis.js @@ -18,6 +18,8 @@ import './nvd3_vis.css'; import { VIZ_TYPES } from './main'; const minBarWidth = 15; +// Limit on how large axes margins can grow as the chart window is resized +const maxMarginPad = 30; const animationTime = 1000; const BREAKPOINTS = { @@ -463,7 +465,9 @@ function nvd3Vis(slice, payload) { if (chart.yAxis !== undefined || chart.yAxis2 !== undefined) { // Hack to adjust y axis left margin to accommodate long numbers - const marginPad = isExplore ? width * 0.01 : width * 0.03; + const containerWidth = slice.container.width(); + const marginPad = Math.min(isExplore ? containerWidth * 0.01 : containerWidth * 0.03, + maxMarginPad); const maxYAxisLabelWidth = chart.yAxis2 ? getMaxLabelSize(slice.container, 'nv-y1') : getMaxLabelSize(slice.container, 'nv-y'); const maxXAxisLabelHeight = getMaxLabelSize(slice.container, 'nv-x');