sea-chart 1.1.64 → 2.0.0

package/dist/view/wrapper/pie.js

@@ -1,12 +1,19 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { CellType } from 'dtable-ui-component/lib/constants';
-import { CHART_LABEL_POSITIONS, CHART_LABEL_FORMATS, CHART_THEME_COLOR } from '../../constants';
-import { BaseUtils, isFunction } from '../../utils';
-import intl from '../../intl';
-import { SUPPORT_SINGLE_SELECT_THEMES_OPTIONS } from '../../constants/color-rules';
-import ChartComponent from './chart-component';
-class Pie extends ChartComponent {
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _constants = require("dtable-ui-component/lib/constants");
+var _constants2 = require("../../constants");
+var _utils = require("../../utils");
+var _intl = _interopRequireDefault(require("../../intl"));
+var _colorRules = require("../../constants/color-rules");
+var _chartComponent = _interopRequireDefault(require("./chart-component"));
+class Pie extends _chartComponent.default {
   constructor(props) {
     super(props);
     this.createChart = () => {
@@ -17,7 +24,7 @@ class Pie extends ChartComponent {
         label_position
       } = chart.config;
       this.initChart(this.container, {
-        appendPadding: label_position === CHART_LABEL_POSITIONS[1] ? [10, 0, 10, 0] : null
+        appendPadding: label_position === _constants2.CHART_LABEL_POSITIONS[1] ? [10, 0, 10, 0] : null
       });
     };
     this.destroyChart = () => {
@@ -38,7 +45,7 @@ class Pie extends ChartComponent {
         summaryColumn,
         customRender
       } = this.props;
-      const theme = CHART_THEME_COLOR[globalTheme];
+      const theme = _constants2.CHART_THEME_COLOR[globalTheme];
       if (data.length === 0) return;
       this.chart.coordinate('theta', {
         radius: 0.7
@@ -51,12 +58,12 @@ class Pie extends ChartComponent {
         summary_method,
         color_theme
       } = chart.config;
-      const currentTheme = BaseUtils.getCurrentTheme(chartColorTheme);
-      const useSingleSelectColumnColor = color_theme === SUPPORT_SINGLE_SELECT_THEMES_OPTIONS.SINGLE_SELECT_COLUMN_COLORS;
+      const currentTheme = _utils.BaseUtils.getCurrentTheme(chartColorTheme);
+      const useSingleSelectColumnColor = color_theme === _colorRules.SUPPORT_SINGLE_SELECT_THEMES_OPTIONS.SINGLE_SELECT_COLUMN_COLORS;
       const {
         data: newData,
         colorMap
-      } = BaseUtils.formatPieChartData(data, chart, tables, currentTheme, useSingleSelectColumnColor);
+      } = _utils.BaseUtils.formatPieChartData(data, chart, tables, currentTheme, useSingleSelectColumnColor);
       if (!Array.isArray(newData)) return;
       this.loadData(newData);
       this.chart.on('interval:click', e => {
@@ -74,13 +81,13 @@ class Pie extends ChartComponent {
           nice: false
         }
       });
-      this.isInnerLabel = !label_position || label_position === CHART_LABEL_POSITIONS[0];
+      this.isInnerLabel = !label_position || label_position === _constants2.CHART_LABEL_POSITIONS[0];
       this.innerLabelOffset = '-25%';
       this.outerLabelOffset = 20;
       this.currentChart = this.chart.interval().adjust('stack').position('value').color('name', name => {
         return colorMap[name.trim()];
       }).label('value*percent', (value, percent) => {
-        const displayValue = BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
+        const displayValue = _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
         return {
           content: this.getLabel(displayValue, percent)
         };
@@ -88,17 +95,17 @@ class Pie extends ChartComponent {
         offset: this.isInnerLabel ? this.innerLabelOffset : this.outerLabelOffset,
         style: {
           fill: theme.labelColor,
-          fontSize: BaseUtils.getLabelFontSize(label_font_size),
+          fontSize: _utils.BaseUtils.getLabelFontSize(label_font_size),
           ...this.labelStroke
         }
       }).tooltip('name*value*percent', (name, value, percent) => {
         let title = name;
         if (!name || name.trim() === 'undefined' || name.trim() === 'null') {
-          title = intl.get('Empty');
+          title = _intl.default.get('Empty');
         } else if (name === '_Others') {
-          title = intl.get('Others');
+          title = _intl.default.get('Others');
         }
-        const displayValue = BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
+        const displayValue = _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
         return {
           name: title,
           value: display_label ? this.getLabel(displayValue, percent) : displayValue
@@ -127,7 +134,7 @@ class Pie extends ChartComponent {
         summaryColumn,
         summaryMethod: summary_method
       }));
-      isFunction(customRender) && customRender(this.chart);
+      (0, _utils.isFunction)(customRender) && customRender(this.chart);
       requestAnimationFrame(() => {
         this.chart.render();
       });
@@ -143,10 +150,10 @@ class Pie extends ChartComponent {
       const {
         globalTheme
       } = this.props;
-      const theme = CHART_THEME_COLOR[globalTheme];
+      const theme = _constants2.CHART_THEME_COLOR[globalTheme];
       this.currentChart.label('name*value*percent', (name, value, percent) => {
         let displayValue;
-        displayValue = BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summaryMethod);
+        displayValue = _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summaryMethod);
         return {
           content: this.getLabel(displayValue, percent)
         };
@@ -154,7 +161,7 @@ class Pie extends ChartComponent {
         offset: this.isInnerLabel ? this.innerLabelOffset : this.outerLabelOffset,
         style: {
           fill: theme.labelColor,
-          fontSize: BaseUtils.getLabelFontSize(label_font_size),
+          fontSize: _utils.BaseUtils.getLabelFontSize(label_font_size),
           ...this.labelStroke
         }
       });
@@ -172,9 +179,9 @@ class Pie extends ChartComponent {
       const {
         globalTheme
       } = this.props;
-      const theme = CHART_THEME_COLOR[globalTheme];
+      const theme = _constants2.CHART_THEME_COLOR[globalTheme];
       this.currentChart.label('value*percent', (value, percent) => {
-        let displayValue = BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
+        let displayValue = _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
         return {
           content: this.getLabel(displayValue, percent)
         };
@@ -182,7 +189,7 @@ class Pie extends ChartComponent {
         offset: this.isInnerLabel ? this.innerLabelOffset : this.outerLabelOffset,
         style: {
           fill: theme.labelColor,
-          fontSize: BaseUtils.getLabelFontSize(label_font_size),
+          fontSize: _utils.BaseUtils.getLabelFontSize(label_font_size),
           ...this.labelStroke
         }
       });
@@ -197,11 +204,11 @@ class Pie extends ChartComponent {
         return '';
       }
       switch (label_format) {
-        case CHART_LABEL_FORMATS[0]:
+        case _constants2.CHART_LABEL_FORMATS[0]:
           return percent;
-        case CHART_LABEL_FORMATS[1]:
+        case _constants2.CHART_LABEL_FORMATS[1]:
           return value;
-        case CHART_LABEL_FORMATS[2]:
+        case _constants2.CHART_LABEL_FORMATS[2]:
           return "".concat(value, " (").concat(percent, ")");
         default:
           return percent;
@@ -215,7 +222,7 @@ class Pie extends ChartComponent {
   }
   componentDidUpdate(prevProps) {
     super.componentDidUpdate(prevProps);
-    if (BaseUtils.shouldChartComponentUpdate(prevProps, this.props)) {
+    if (_utils.BaseUtils.shouldChartComponentUpdate(prevProps, this.props)) {
       this.chart && this.destroyChart();
       this.createChart();
       this.drawChart();
@@ -225,22 +232,22 @@ class Pie extends ChartComponent {
     this.chart && this.destroyChart();
   }
   render() {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement("div", {
       className: "sea-chart-container ",
       ref: ref => this.container = ref
     });
   }
 }
 Pie.propTypes = {
-  canvasStyle: PropTypes.object,
-  chart: PropTypes.object,
-  groupbyColumn: PropTypes.object,
-  summaryColumn: PropTypes.object,
-  result: PropTypes.array,
-  tables: PropTypes.array,
-  globalTheme: PropTypes.string,
-  chartColorTheme: PropTypes.string,
-  toggleRecords: PropTypes.func,
-  customRender: PropTypes.func
+  canvasStyle: _propTypes.default.object,
+  chart: _propTypes.default.object,
+  groupbyColumn: _propTypes.default.object,
+  summaryColumn: _propTypes.default.object,
+  result: _propTypes.default.array,
+  tables: _propTypes.default.array,
+  globalTheme: _propTypes.default.string,
+  chartColorTheme: _propTypes.default.string,
+  toggleRecords: _propTypes.default.func,
+  customRender: _propTypes.default.func
 };
-export default Pie;
+var _default = exports.default = Pie;

package/dist/view/wrapper/ring.js

@@ -1,11 +1,18 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { CHART_LABEL_POSITIONS, CHART_LABEL_FORMATS, CHART_THEME_COLOR } from '../../constants';
-import { BaseUtils, isFunction } from '../../utils';
-import intl from '../../intl';
-import { SUPPORT_SINGLE_SELECT_THEMES_OPTIONS } from '../../constants/color-rules';
-import ChartComponent from './chart-component';
-class Ring extends ChartComponent {
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _constants = require("../../constants");
+var _utils = require("../../utils");
+var _intl = _interopRequireDefault(require("../../intl"));
+var _colorRules = require("../../constants/color-rules");
+var _chartComponent = _interopRequireDefault(require("./chart-component"));
+class Ring extends _chartComponent.default {
   constructor(props) {
     var _this;
     super(props);
@@ -34,7 +41,7 @@ class Ring extends ChartComponent {
         summaryColumn,
         customRender
       } = this.props;
-      const theme = CHART_THEME_COLOR[globalTheme];
+      const theme = _constants.CHART_THEME_COLOR[globalTheme];
       const radius = 0.7;
       const innerRadius = 0.8;
       if (data.length === 0) return;
@@ -52,13 +59,13 @@ class Ring extends ChartComponent {
         label_format,
         color_theme
       } = chart.config;
-      const colorTheme = BaseUtils.getCurrentTheme(chartColorTheme);
-      const useSingleSelectColumnColor = color_theme === SUPPORT_SINGLE_SELECT_THEMES_OPTIONS.SINGLE_SELECT_COLUMN_COLORS;
+      const colorTheme = _utils.BaseUtils.getCurrentTheme(chartColorTheme);
+      const useSingleSelectColumnColor = color_theme === _colorRules.SUPPORT_SINGLE_SELECT_THEMES_OPTIONS.SINGLE_SELECT_COLUMN_COLORS;
       const {
         data: newData,
         colorMap,
         total
-      } = BaseUtils.formatPieChartData(data, chart, tables, colorTheme, useSingleSelectColumnColor);
+      } = _utils.BaseUtils.formatPieChartData(data, chart, tables, colorTheme, useSingleSelectColumnColor);
       if (!Array.isArray(newData)) return;
       this.sum = total;
       this.loadData(newData);
@@ -78,13 +85,13 @@ class Ring extends ChartComponent {
         }
       });
       const labelWidthMap = {
-        [CHART_LABEL_FORMATS[0]]: 30,
-        [CHART_LABEL_FORMATS[1]]: 20,
-        [CHART_LABEL_FORMATS[2]]: 40
+        [_constants.CHART_LABEL_FORMATS[0]]: 30,
+        [_constants.CHART_LABEL_FORMATS[1]]: 20,
+        [_constants.CHART_LABEL_FORMATS[2]]: 40
       };
       const currntLabelWidth = labelWidthMap[label_format];
       let elementWidth = this.chart.height * radius * (1 - innerRadius) / 2;
-      const isInnerLabel = !label_position || label_position === CHART_LABEL_POSITIONS[0];
+      const isInnerLabel = !label_position || label_position === _constants.CHART_LABEL_POSITIONS[0];
       this.isInnerLabel = isInnerLabel;
       let innerLabelOffset;
       let outerLabelOffset = 20;
@@ -99,7 +106,7 @@ class Ring extends ChartComponent {
       this.currentChart = this.chart.interval().adjust('stack').position('value').color('name', name => {
         return colorMap[name.trim()];
       }).label('value*percent', (value, percent) => {
-        const displayValue = BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
+        const displayValue = _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
         return {
           content: this.getLabel(displayValue, percent)
         };
@@ -107,17 +114,17 @@ class Ring extends ChartComponent {
         offset: isInnerLabel ? innerLabelOffset : 20,
         style: {
           fill: theme.ringLabelColor,
-          fontSize: BaseUtils.getLabelFontSize(label_font_size),
+          fontSize: _utils.BaseUtils.getLabelFontSize(label_font_size),
           ...this.labelStroke
         }
       }).tooltip('name*value*percent', (name, value, percent) => {
         let title = name;
         if (!name || name === 'undefined' || name.trim() === 'undefined' || name.trim() === 'null') {
-          title = intl.get('Empty');
+          title = _intl.default.get('Empty');
         } else if (name === '_Others') {
-          title = intl.get('Others');
+          title = _intl.default.get('Others');
         }
-        const displayValue = BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
+        const displayValue = _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
         return {
           name: title,
           value: display_label ? this.getLabel(displayValue, percent) : displayValue
@@ -140,8 +147,8 @@ class Ring extends ChartComponent {
       });
       this.setToolTipForTheta();
       this.setAnnotation({
-        name: intl.get('Total'),
-        value: BaseUtils.getSummaryValueDisplayString(summaryColumn, this.sum, summary_method)
+        name: _intl.default.get('Total'),
+        value: _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, this.sum, summary_method)
       }, '', theme);
       this.chart.on('interval:mouseenter', evt => this.onEnterRingChart(evt, {
         summaryColumn,
@@ -152,7 +159,7 @@ class Ring extends ChartComponent {
         summaryMethod: summary_method
       }));
       this.chart.interaction('element-highlight');
-      isFunction(customRender) && customRender(this.chart);
+      (0, _utils.isFunction)(customRender) && customRender(this.chart);
       requestAnimationFrame(() => {
         this.chart.render();
       });
@@ -166,11 +173,11 @@ class Ring extends ChartComponent {
         return '';
       }
       switch (label_format) {
-        case CHART_LABEL_FORMATS[0]:
+        case _constants.CHART_LABEL_FORMATS[0]:
           return percent;
-        case CHART_LABEL_FORMATS[1]:
+        case _constants.CHART_LABEL_FORMATS[1]:
           return value;
-        case CHART_LABEL_FORMATS[2]:
+        case _constants.CHART_LABEL_FORMATS[2]:
           return "".concat(value, " (").concat(percent, ")");
         default:
           return percent;
@@ -181,12 +188,12 @@ class Ring extends ChartComponent {
         summaryColumn,
         summaryMethod
       } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-      let theme = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : CHART_THEME_COLOR['light'];
+      let theme = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : _constants.CHART_THEME_COLOR['light'];
       let name = content.name;
       if (!name || name === 'undefined') {
-        name = intl.get('Empty');
+        name = _intl.default.get('Empty');
       } else if (name === '_Others') {
-        name = intl.get('Others');
+        name = _intl.default.get('Others');
       }
       _this.chart.annotation().text({
         content: name,
@@ -200,7 +207,7 @@ class Ring extends ChartComponent {
         offsetY: -10
       }).text({
         position: ['50%', '50%'],
-        content: summaryColumn ? BaseUtils.getSummaryValueDisplayString(summaryColumn, content.value, summaryMethod) : content.value,
+        content: summaryColumn ? _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, content.value, summaryMethod) : content.value,
         style: {
           fontSize: theme.annotationFontSize,
           fill: theme.annotationValueFontColor,
@@ -220,12 +227,12 @@ class Ring extends ChartComponent {
       const {
         globalTheme
       } = this.props;
-      const theme = CHART_THEME_COLOR[globalTheme];
+      const theme = _constants.CHART_THEME_COLOR[globalTheme];
       const item = evt.data.data;
       this.chart.annotation().clear(true);
       this.currentChart.label('name*value*percent', (name, value, percent) => {
         let displayValue;
-        displayValue = BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summaryMethod);
+        displayValue = _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summaryMethod);
         return {
           content: this.getLabel(displayValue, percent)
         };
@@ -233,7 +240,7 @@ class Ring extends ChartComponent {
         offset: this.isInnerLabel ? this.innerLabelOffset : this.outerLabelOffset,
         style: {
           fill: theme.ringLabelColor,
-          fontSize: BaseUtils.getLabelFontSize(label_font_size),
+          fontSize: _utils.BaseUtils.getLabelFontSize(label_font_size),
           ...this.labelStroke
         }
       });
@@ -255,10 +262,10 @@ class Ring extends ChartComponent {
       const {
         globalTheme
       } = this.props;
-      const theme = CHART_THEME_COLOR[globalTheme];
+      const theme = _constants.CHART_THEME_COLOR[globalTheme];
       this.chart.annotation().clear(true);
       this.currentChart.label('value*percent', (value, percent) => {
-        let displayValue = BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
+        let displayValue = _utils.BaseUtils.getSummaryValueDisplayString(summaryColumn, value, summary_method);
         return {
           content: this.getLabel(displayValue, percent)
         };
@@ -266,12 +273,12 @@ class Ring extends ChartComponent {
         offset: this.isInnerLabel ? this.innerLabelOffset : this.outerLabelOffset,
         style: {
           fill: theme.ringLabelColor,
-          fontSize: BaseUtils.getLabelFontSize(label_font_size),
+          fontSize: _utils.BaseUtils.getLabelFontSize(label_font_size),
           ...this.labelStroke
         }
       });
       this.setAnnotation({
-        name: intl.get('Total'),
+        name: _intl.default.get('Total'),
         value: this.sum
       }, {
         summaryColumn,
@@ -288,7 +295,7 @@ class Ring extends ChartComponent {
   }
   componentDidUpdate(prevProps) {
     super.componentDidUpdate(prevProps);
-    if (BaseUtils.shouldChartComponentUpdate(prevProps, this.props)) {
+    if (_utils.BaseUtils.shouldChartComponentUpdate(prevProps, this.props)) {
       this.chart && this.destroyChart();
       this.sum = 0;
       this.createChart();
@@ -299,23 +306,23 @@ class Ring extends ChartComponent {
     this.chart && this.destroyChart();
   }
   render() {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement("div", {
       className: "sea-chart-container",
       ref: ref => this.container = ref
     });
   }
 }
 Ring.propTypes = {
-  canvasStyle: PropTypes.object,
-  chart: PropTypes.object,
-  groupbyColumn: PropTypes.object,
-  columnGroupbyColumn: PropTypes.object,
-  summaryColumn: PropTypes.object,
-  result: PropTypes.array,
-  tables: PropTypes.array,
-  globalTheme: PropTypes.string,
-  chartColorTheme: PropTypes.string,
-  toggleRecords: PropTypes.func,
-  customRender: PropTypes.func
+  canvasStyle: _propTypes.default.object,
+  chart: _propTypes.default.object,
+  groupbyColumn: _propTypes.default.object,
+  columnGroupbyColumn: _propTypes.default.object,
+  summaryColumn: _propTypes.default.object,
+  result: _propTypes.default.array,
+  tables: _propTypes.default.array,
+  globalTheme: _propTypes.default.string,
+  chartColorTheme: _propTypes.default.string,
+  toggleRecords: _propTypes.default.func,
+  customRender: _propTypes.default.func
 };
-export default Ring;
+var _default = exports.default = Ring;

package/dist/view/wrapper/scatter.js

@@ -1,12 +1,20 @@
-import classnames from 'classnames';
-import React, { useEffect, useRef } from 'react';
-import { getTableById, getTableColumnByKey } from 'dtable-utils';
-import { BaseUtils } from '../../utils';
-import intl from '../../intl';
-import { CHART_THEME_COLOR } from '../../constants';
-import ChartComponent from './chart-component';
-const chartComponent = new ChartComponent({});
-export function Scatter(_ref) {
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Scatter = Scatter;
+var _classnames = _interopRequireDefault(require("classnames"));
+var _react = _interopRequireWildcard(require("react"));
+var _dtableUtils = require("dtable-utils");
+var _utils = require("../../utils");
+var _intl = _interopRequireDefault(require("../../intl"));
+var _constants = require("../../constants");
+var _chartComponent = _interopRequireDefault(require("./chart-component"));
+const chartComponent = new _chartComponent.default({});
+function Scatter(_ref) {
   let {
     toggleRecords,
     result: data,
@@ -15,10 +23,10 @@ export function Scatter(_ref) {
     globalTheme,
     chartColorTheme
   } = _ref;
-  const chartRef = useRef(chartComponent);
+  const chartRef = (0, _react.useRef)(chartComponent);
   chartRef.current.initLabelStroke(globalTheme);
-  const chartContainerRef = useRef(null);
-  useEffect(() => {
+  const chartContainerRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
     const currentChart = chartRef.current;
     currentChart.isDestoryed = false;
 
@@ -33,7 +41,7 @@ export function Scatter(_ref) {
       });
     }
     function drawChart() {
-      const newData = BaseUtils.formatEmptyName(data, '', intl.get('Empty'));
+      const newData = _utils.BaseUtils.formatEmptyName(data, '', _intl.default.get('Empty'));
       if (!Array.isArray(newData)) return;
       currentChart.loadData(newData);
       draw(newData);
@@ -41,7 +49,7 @@ export function Scatter(_ref) {
       currentChart.renderAxisLabel(chart, tables);
     }
     function draw(data) {
-      const theme = CHART_THEME_COLOR[globalTheme];
+      const theme = _constants.CHART_THEME_COLOR[globalTheme];
       const {
         label_font_size,
         x_axis_column_key,
@@ -49,12 +57,12 @@ export function Scatter(_ref) {
         table_id,
         y_axis_show_value
       } = chart.config;
-      const selectedTable = getTableById(tables, table_id);
-      const selectedXAxisColumn = getTableColumnByKey(selectedTable, x_axis_column_key);
-      const selectedYAxisColumn = getTableColumnByKey(selectedTable, y_axis_column_key);
+      const selectedTable = (0, _dtableUtils.getTableById)(tables, table_id);
+      const selectedXAxisColumn = (0, _dtableUtils.getTableColumnByKey)(selectedTable, x_axis_column_key);
+      const selectedYAxisColumn = (0, _dtableUtils.getTableColumnByKey)(selectedTable, y_axis_column_key);
       currentChart.drawLabels(data);
       let currentIdx = 0;
-      let colors = BaseUtils.getCurrentTheme(chartColorTheme).colors;
+      let colors = _utils.BaseUtils.getCurrentTheme(chartColorTheme).colors;
       const colorMap = data.reduce((acc, cur) => {
         if (cur.groupby && !acc[cur.groupby]) {
           acc[cur.groupby] = colors[currentIdx++ % colors.length];
@@ -84,7 +92,7 @@ export function Scatter(_ref) {
       });
       currentChart.chart.point().position('name*value').label(y_axis_show_value ? 'value' : false, {
         style: {
-          fontSize: BaseUtils.getLabelFontSize(label_font_size),
+          fontSize: _utils.BaseUtils.getLabelFontSize(label_font_size),
           fill: theme.labelColor,
           ...currentChart.labelStroke
         }
@@ -95,7 +103,7 @@ export function Scatter(_ref) {
         return colorMap[groupby];
       }).shape('circle').tooltip('groupby*name*value', (groupby, name, value) => {
         return {
-          name: groupby || groupby === 0 ? groupby : intl.get('Empty'),
+          name: groupby || groupby === 0 ? groupby : _intl.default.get('Empty'),
           valueX: "".concat(selectedXAxisColumn === null || selectedXAxisColumn === void 0 ? void 0 : selectedXAxisColumn.name, ": ").concat(name),
           valueY: "".concat(selectedYAxisColumn === null || selectedYAxisColumn === void 0 ? void 0 : selectedYAxisColumn.name, ": ").concat(value)
         };
@@ -122,8 +130,8 @@ export function Scatter(_ref) {
   }, [chart, chartColorTheme, data, globalTheme, tables, toggleRecords]);
   const showXLabel = chartRef.current.isShowXAxisLabel(chart);
   const showYLabel = chartRef.current.isShowYAxisLabel(chart);
-  return /*#__PURE__*/React.createElement("div", {
-    className: classnames('sea-chart-container', {
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)('sea-chart-container', {
       'show-x-axis-label': showXLabel,
       'show-y-axis-label': showYLabel
     }),

package/dist/view/wrapper/table/index.js

@@ -1,10 +1,18 @@
-import React, { PureComponent } from 'react';
-import intl from '../../../intl';
-import TwoDimensionTable from './two-dimension-table';
-import OneDimensionTableNoNumericColumns from './one-dimension-table-no-numeric-columns';
-import OneDimensionTableWithNumericColumns from './one-dimension-table-with-numeric-columns';
-import './index.css';
-class Table extends PureComponent {
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _intl = _interopRequireDefault(require("../../../intl"));
+var _twoDimensionTable = _interopRequireDefault(require("./two-dimension-table"));
+var _oneDimensionTableNoNumericColumns = _interopRequireDefault(require("./one-dimension-table-no-numeric-columns"));
+var _oneDimensionTableWithNumericColumns = _interopRequireDefault(require("./one-dimension-table-with-numeric-columns"));
+require("./index.css");
+class Table extends _react.PureComponent {
   constructor() {
     super(...arguments);
     this.toggleRecords = (cell, selectedCell) => {
@@ -23,20 +31,20 @@ class Table extends PureComponent {
       } = result;
       if (!groupbyColumn) return null;
       if (Array.isArray(pivot_columns) && pivot_columns.length > 100) {
-        return /*#__PURE__*/React.createElement("div", null, intl.get('There_are_too_many_statistics_entries_to_display'));
+        return /*#__PURE__*/_react.default.createElement("div", null, _intl.default.get('There_are_too_many_statistics_entries_to_display'));
       }
       if (columnGroupbyColumn) {
-        return /*#__PURE__*/React.createElement(TwoDimensionTable, Object.assign({}, this.props, {
+        return /*#__PURE__*/_react.default.createElement(_twoDimensionTable.default, Object.assign({}, this.props, {
           toggleRecords: this.toggleRecords
         }));
       }
       if (!Array.isArray(pivot_columns)) return null;
       if (pivot_columns.length < 2) {
-        return /*#__PURE__*/React.createElement(OneDimensionTableNoNumericColumns, Object.assign({}, this.props, {
+        return /*#__PURE__*/_react.default.createElement(_oneDimensionTableNoNumericColumns.default, Object.assign({}, this.props, {
           toggleRecords: this.toggleRecords
         }));
       }
-      return /*#__PURE__*/React.createElement(OneDimensionTableWithNumericColumns, Object.assign({}, this.props, {
+      return /*#__PURE__*/_react.default.createElement(_oneDimensionTableWithNumericColumns.default, Object.assign({}, this.props, {
         toggleRecords: this.toggleRecords
       }));
     };
@@ -45,9 +53,9 @@ class Table extends PureComponent {
     const {
       result
     } = this.props;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement("div", {
       className: "sea-chart-table-wrapper sea-chart-".concat(result.dimensions, "-table-wrapper")
     }, this.renderContainer());
   }
 }
-export default Table;
+var _default = exports.default = Table;