Skip to content
This repository was archived by the owner on Jun 25, 2020. It is now read-only.

fix: Making viz components respect D3 Format from metric #280

Merged
merged 10 commits into from
Jan 13, 2020
Merged

fix: Making viz components respect D3 Format from metric #280

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
60c41d1
fix: BigNumber uses metric's d3format value now, when populated.
rusackas Dec 2, 2019
fd67f96
fix: respecting D3 Format column for a handful of NVD3 charts
rusackas Dec 3, 2019
a905b18
fix: treemap respects metric's D3 Format setting
rusackas Dec 3, 2019
4685276
style: Simpler loop syntax using forEach, Prettier cleanup.
rusackas Dec 3, 2019
2026f6f
style: prettier
rusackas Dec 3, 2019
84e1810
style: re-installed modules, re-ran prettier
rusackas Dec 3, 2019
2a27782
fix: eslint nits
rusackas Dec 4, 2019
95e2638
style: moving grabD3Format outside the transformProps block
rusackas Dec 5, 2019
db1153c
fix: allow formData to override metric's D3 Format
rusackas Dec 5, 2019
96e9d75
style: overwriting yAxisFormat rather than declaring a new var
rusackas Dec 5, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 10 additions & 1 deletion packages/superset-ui-legacy-plugin-chart-treemap/src/transformProps.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,16 @@
/* eslint-disable sort-keys */
export default function transformProps(chartProps) {
const { width, height, formData, queryData } = chartProps;
const { colorScheme, numberFormat, treemapRatio } = formData;
const { colorScheme, treemapRatio } = formData;
let { numberFormat } = formData;

if (!numberFormat && chartProps.datasource && chartProps.datasource.metrics) {
chartProps.datasource.metrics.forEach(metric => {
if (metric.metric_name === chartProps.formData.metrics[0] && metric.d3format) {
numberFormat = metric.d3format;
}
});
}

return {
width,
Expand Down
15 changes: 13 additions & 2 deletions packages/superset-ui-legacy-preset-chart-big-number/src/BigNumber/transformProps.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,8 +36,8 @@ export default function transformProps(chartProps) {
startYAxisAtZero,
subheader = '',
vizType,
yAxisFormat,
} = formData;
let { yAxisFormat } = formData;
const { data } = queryData;

let mainColor;
Expand Down Expand Up @@ -68,7 +68,10 @@ export default function transformProps(chartProps) {
}
}
trendLineData = supportAndShowTrendLine
? sortedData.map(point => ({ x: point[TIME_COLUMN], y: point[metricName] }))
? sortedData.map(point => ({
x: point[TIME_COLUMN],
y: point[metricName],
}))
: null;
} else {
bigNumber = data[0][metricName];
Expand All @@ -82,6 +85,14 @@ export default function transformProps(chartProps) {
className = 'negative';
}

if (!yAxisFormat && chartProps.datasource && chartProps.datasource.metrics) {
chartProps.datasource.metrics.forEach(metricEntry => {
if (metricEntry.metric_name === metric && metricEntry.d3format) {
yAxisFormat = metricEntry.d3format;
}
});
}

const formatValue = getNumberFormatter(yAxisFormat);

return {
Expand Down
25 changes: 22 additions & 3 deletions packages/superset-ui-legacy-preset-chart-nvd3/src/transformProps.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,17 @@ import { formatLabel } from './utils';

const NOOP = () => {};

const grabD3Format = (chartProps, targetMetric) => {
let foundFormatter;
chartProps.datasource.metrics.forEach(metric => {
if (metric.d3format && metric.metric_name === targetMetric) {
foundFormatter = metric.d3format;
}
});

return foundFormatter;
};

export default function transformProps(chartProps) {
const { width, height, annotationData, datasource, formData, hooks, queryData } = chartProps;

Expand Down Expand Up @@ -59,18 +70,17 @@ export default function transformProps(chartProps) {
xAxisFormat,
xAxisLabel,
xAxisShowminmax,
numberFormat,
xLogScale,
xTicksLayout,
y,
yAxisFormat,
yAxis2Format,
yAxisBounds,
yAxisLabel,
yAxisShowminmax,
yLogScale,
} = formData;

let { numberFormat, yAxisFormat, yAxis2Format } = formData;

const rawData = queryData.data || [];
const data = Array.isArray(rawData)
? rawData.map(row => ({
Expand All @@ -79,6 +89,15 @@ export default function transformProps(chartProps) {
}))
: rawData;

if (chartProps.formData.vizType === 'pie') {
numberFormat = numberFormat || grabD3Format(chartProps, chartProps.formData.metric);
} else if (chartProps.formData.vizType === 'dual_line') {
yAxisFormat = yAxisFormat || grabD3Format(chartProps, chartProps.formData.metric);
yAxis2Format = yAxis2Format || grabD3Format(chartProps, chartProps.formData.metric2);
} else if (['line', 'dist_bar', 'bar', 'area'].indexOf(chartProps.formData.vizType) > -1) {
yAxisFormat = yAxisFormat || grabD3Format(chartProps, chartProps.formData.metrics[0]);
}

return {
width,
height,
Expand Down