[GitHub] mistercrunch closed pull request #6628: [pie] allow formatting numbers on pie chart

[GitBox <gi...@apache.org>]

mistercrunch closed pull request #6628: [pie] allow formatting numbers on pie chart
URL: https://github.com/apache/incubator-superset/pull/6628
 
 
   

This is a PR merged from a forked repository.
As GitHub hides the original diff on merge, it is displayed below for
the sake of provenance:

As this is a foreign pull request (from a fork), the diff is supplied
below (as it won't show otherwise due to GitHub magic):

diff --git a/superset/assets/src/explore/controlPanels/Pie.js b/superset/assets/src/explore/controlPanels/Pie.js
index b5eab4dcd9..eb80963f03 100644
--- a/superset/assets/src/explore/controlPanels/Pie.js
+++ b/superset/assets/src/explore/controlPanels/Pie.js
@@ -16,7 +16,7 @@ export default {
       label: t('Chart Options'),
       expanded: true,
       controlSetRows: [
-        ['pie_label_type'],
+        ['pie_label_type', 'number_format'],
         ['donut', 'show_legend'],
         ['show_labels', 'labels_outside'],
         ['color_scheme'],
@@ -27,5 +27,11 @@ export default {
     row_limit: {
       default: 25,
     },
+    number_format: {
+      description: (
+        t('D3 format syntax: https://github.com/d3/d3-format') + ' ' +
+        t('Only applies when the "Label Type" is not set to a percentage.')
+      ),
+    },
   },
 };
diff --git a/superset/assets/src/visualizations/nvd3/NVD3Vis.js b/superset/assets/src/visualizations/nvd3/NVD3Vis.js
index 93776046c6..ede2b3974c 100644
--- a/superset/assets/src/visualizations/nvd3/NVD3Vis.js
+++ b/superset/assets/src/visualizations/nvd3/NVD3Vis.js
@@ -6,7 +6,7 @@ import moment from 'moment';
 import PropTypes from 'prop-types';
 import { t } from '@superset-ui/translation';
 import { CategoricalColorNamespace } from '@superset-ui/color';
-import { getNumberFormatter, formatNumber, NumberFormats } from '@superset-ui/number-format';
+import { getNumberFormatter, NumberFormats } from '@superset-ui/number-format';
 import { getTimeFormatter, smartDateVerboseFormatter } from '@superset-ui/time-format';
 import 'nvd3/build/nv.d3.min.css';
 
@@ -127,6 +127,7 @@ const propTypes = {
     'dual_line',
   ]),
   xAxisFormat: PropTypes.string,
+  numberFormat: PropTypes.string,
   xAxisLabel: PropTypes.string,
   xAxisShowMinMax: PropTypes.bool,
   xIsLogScale: PropTypes.bool,
@@ -213,6 +214,7 @@ function nvd3Vis(element, props) {
     useRichTooltip,
     vizType,
     xAxisFormat,
+    numberFormat,
     xAxisLabel,
     xAxisShowMinMax = false,
     xField,
@@ -264,6 +266,7 @@ function nvd3Vis(element, props) {
       isTruthy(showBrush) ||
       (showBrush === 'auto' && maxHeight >= MIN_HEIGHT_FOR_BRUSH && xTicksLayout !== '45°')
     );
+    const numberFormatter = getNumberFormatter(numberFormat);
 
     switch (vizType) {
       case 'line':
@@ -330,7 +333,7 @@ function nvd3Vis(element, props) {
       case 'pie':
         chart = nv.models.pieChart();
         colorKey = 'x';
-        chart.valueFormat(formatter);
+        chart.valueFormat(numberFormatter);
         if (isDonut) {
           chart.donut(true);
         }
@@ -340,18 +343,14 @@ function nvd3Vis(element, props) {
         chart.labelThreshold(0.05);
         chart.cornerRadius(true);
 
-        if (pieLabelType !== 'key_percent' && pieLabelType !== 'key_value') {
+        if (['key', 'value', 'percent'].indexOf(pieLabelType) >= 0) {
           chart.labelType(pieLabelType);
         } else if (pieLabelType === 'key_value') {
-          chart.labelType(d => `${d.data.x}: ${formatNumber(NumberFormats.SI, d.data.y)}`);
-        }
-
-        if (pieLabelType === 'percent' || pieLabelType === 'key_percent') {
+          chart.labelType(d => `${d.data.x}: ${numberFormatter(d.data.y)}`);
+        } else if (pieLabelType === 'key_percent') {
           const total = d3.sum(data, d => d.y);
           chart.tooltip.valueFormatter(d => `${((d / total) * 100).toFixed()}%`);
-          if (pieLabelType === 'key_percent') {
-            chart.labelType(d => `${d.data.x}: ${((d.data.y / total) * 100).toFixed()}%`);
-          }
+          chart.labelType(d => `${d.data.x}: ${((d.data.y / total) * 100).toFixed()}%`);
         }
         // Pie chart does not need top margin
         chart.margin({ top: 0 });
diff --git a/superset/assets/src/visualizations/nvd3/transformProps.js b/superset/assets/src/visualizations/nvd3/transformProps.js
index 912683752d..1ddeffd0bd 100644
--- a/superset/assets/src/visualizations/nvd3/transformProps.js
+++ b/superset/assets/src/visualizations/nvd3/transformProps.js
@@ -45,6 +45,7 @@ export default function transformProps(chartProps) {
     xAxisFormat,
     xAxisLabel,
     xAxisShowminmax,
+    numberFormat,
     xLogScale,
     xTicksLayout,
     y,
@@ -83,6 +84,7 @@ export default function transformProps(chartProps) {
     leftMargin,
     lineInterpolation,
     maxBubbleSize: parseInt(maxBubbleSize, 10),
+    numberFormat,
     onBrushEnd: isTruthy(sendTimeRange) ? ((timeRange) => {
       onAddFilter('__time_range', timeRange, false, true);
     }) : undefined,


 

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
users@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org