sea-chart 0.0.94 → 0.0.95

package/dist/services/map-json.js

@@ -86,7 +86,13 @@ export default async function fetchMapJson(mapLevel, mapLocation, mediaUrl) {
   if (cachedJson) {
     return Promise.resolve(cachedJson);
   }
-  const res = await fetch("".concat(mediaUrl, "dtable-statistic/geolocation/").concat(url, ".json"));
-  const mapJson = await res.json();
+  let mapJson;
+  try {
+    const res = await fetch("".concat(mediaUrl, "dtable-statistic/geolocation/").concat(url, ".json"));
+    mapJson = await res.json();
+  } catch (error) {
+    console.error('on fetchMapJson: fetch error', error);
+    return null;
+  }
   return handleLoadedMapJson(url, mapJson);
 }

package/dist/settings/widgets/select-view/index.js

@@ -15,7 +15,14 @@ const SelectView = _ref => {
   const viewOptions = useMemo(() => {
     const table = getTableById(tables, selectedTableId);
     if (!table) return [];
-    const views = getNonPrivateViews(table.views);
+    let views = getNonPrivateViews(table.views);
+    const selectedView = views.find(view => view._id === selectedViewId);
+
+    // not support archive view on plugin, do not show archive view
+    // but if it is selected, keep it
+    if (!isArchiveView(selectedView)) {
+      views = views.filter(v => !isArchiveView(v));
+    }
     return Array.isArray(views) ? views.map(view => {
       const value = view._id;
       const archiveView = isArchiveView(view);
@@ -23,7 +30,9 @@ const SelectView = _ref => {
         label: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
           className: "sea-chart-table-view mr-2"
         }, /*#__PURE__*/React.createElement("i", {
-          className: classnames('dtable-font', {
+          className: classnames('dtable-font',
+          // 'dtable-icon-main-view',
+          {
             'dtable-icon-archive-view': archiveView,
             'dtable-icon-main-view': !archiveView
           })
@@ -33,7 +42,7 @@ const SelectView = _ref => {
         value
       };
     }) : [];
-  }, [tables, selectedTableId]);
+  }, [tables, selectedTableId, selectedViewId]);
   const selectedOption = selectedViewId ? viewOptions.find(option => option.value === selectedViewId) : null;
   return /*#__PURE__*/React.createElement(FormGroup, {
     className: "sea-chart-setting-item table-setting"

package/dist/utils/chart-utils/base-utils.js

@@ -693,16 +693,19 @@ BaseUtils.sortCharts = (charts, column, sortKey) => {
           }
         case CellType.SINGLE_SELECT:
           {
+            // key was used to sort "pivot columns" in pivot chart
             const {
               name: currentName,
-              group_name: currentGroupName
+              group_name: currentGroupName,
+              key: currentKey
             } = currResult || {};
             const {
               name: nextName,
-              group_name: nextGroupName
+              group_name: nextGroupName,
+              key: nextKey
             } = nextResult || {};
-            const current = currentGroupName || currentName;
-            const next = nextGroupName || nextName;
+            const current = currentGroupName || currentName || currentKey;
+            const next = nextGroupName || nextName || nextKey;
             return sortSingleSelect(current, next, {
               sort_type: sortType,
               option_id_index_map: optionIdIndexMap

package/dist/utils/chart-utils/sql-statistics-utils.js

@@ -2,6 +2,7 @@ var _SQLStatisticsUtils;
 import dayjs from 'dayjs';
 import { CellType, MULTIPLE_CELL_VALUE_COLUMN_TYPE_MAP, getFormulaDisplayString, getPrecisionNumber, getTableById, getTableColumnByKey, isNumber, DateUtils } from 'dtable-utils';
 import { isObject } from 'lodash';
+import { cloneDeep } from 'lodash-es';
 import { CHART_SUMMARY_TYPE, CHART_TYPE, SUPPORT_DATA_SORT_CHART_TYPES, TABLE_DIMENSIONS, Y_AXIS_TYPE_PREFIX, STYLE_COLORS, TREND_TYPES } from '../../constants';
 import { chartColumn2SqlColumn, summaryMethodColumn2SqlColumn } from '../sql';
 import { getClientLinkDisplayString } from '../cell-format-utils';
@@ -493,6 +494,7 @@ SQLStatisticsUtils.oneDimensionTableSQLResult2JavaScript = (chart, sqlRows, char
         }
       });
     });
+    BaseUtils.sortCharts(pivot_rows, groupbyColumn, 'name');
     return {
       pivot_columns,
       pivot_rows: pivot_rows,
@@ -1550,14 +1552,17 @@ SQLStatisticsUtils.sqlResult2JavaScript = (chart, sqlRows, chartSQLMap, columnMa
         const {
           column_groupby_column_key
         } = chart.config;
+        let result;
         if (!column_groupby_column_key) {
-          return {
+          result = {
             result: _SQLStatisticsUtils.oneDimensionTableSQLResult2JavaScript(chart, sqlRows, chartSQLMap, columnMap, tables)
           };
+        } else {
+          result = {
+            result: _SQLStatisticsUtils.twoDimensionTableSQLResult2JavaScript(chart, sqlRows, chartSQLMap, columnMap, tables)
+          };
         }
-        return {
-          result: _SQLStatisticsUtils.twoDimensionTableSQLResult2JavaScript(chart, sqlRows, chartSQLMap, columnMap, tables)
-        };
+        return result;
       }
     case CHART_TYPE.PIE:
     case CHART_TYPE.RING:
@@ -1792,20 +1797,29 @@ SQLStatisticsUtils.scatterSQLResult2JavaScript = (chart, sqlRows, chartSQLMap, c
     columnGroupbyColumn,
     summaryColumn
   } = columnMap;
-
   // format sql rows
+  const originalSqlRows = cloneDeep(sqlRows);
   BaseUtils.updateTableViewList(sqlRows, groupbyColumn, groupbyColumn.key, 'color');
   BaseUtils.updateTableViewList(sqlRows, summaryColumn, summaryColumn.key, 'color');
   if (sqlColumnGroupbyColumnKey) BaseUtils.updateTableViewList(sqlRows, columnGroupbyColumn, sqlColumnGroupbyColumnKey, 'color');
   const res = [];
-  sqlRows.forEach(row => {
+  sqlRows.forEach((row, index) => {
     const xValue = '' + row[sqlXColumnKey] || intl.get('Empty');
     const yValue = '' + row[sqlYColumnKey] || intl.get('Empty');
     const groupby = '' + row[sqlColumnGroupbyColumnKey] || intl.get('Empty');
+    const originalSqlRow = originalSqlRows[index];
+    const originalXValue = originalSqlRow[sqlXColumnKey];
+    const originalYValue = originalSqlRow[sqlYColumnKey];
+    const originalGroupby = originalSqlRow[sqlColumnGroupbyColumnKey];
     res.push({
       name: xValue,
       value: yValue,
-      groupby
+      groupby,
+      original_value: {
+        name: originalXValue,
+        value: originalYValue,
+        groupby: originalGroupby
+      }
     });
   });
   return res;

package/dist/utils/row-record-utils.js

@@ -1,7 +1,7 @@
 import _ButtonFormatter from "dtable-ui-component/lib/ButtonFormatter";
 import _RateFormatter from "dtable-ui-component/lib/RateFormatter";
 import React from 'react';
-import { CellType, FORMULA_RESULT_TYPE, getNumberDisplayString, getDateDisplayString, getCellValueStringResult, isNumber, isDateColumn, isValidLink } from 'dtable-utils';
+import { CellType, FORMULA_RESULT_TYPE, getNumberDisplayString, getDateDisplayString, getCellValueStringResult, isNumber, isDateColumn, isValidLink, getColumnOptions } from 'dtable-utils';
 import dayjs from 'dayjs';
 import { isEqual } from 'lodash-es';
 import cellFormatterFactory from '../components/cell-factory/cell-formatter-factory';
@@ -501,6 +501,7 @@ const filterPredicateMap = {
   [CellType.STRING]: 'is',
   [CellType.BOOL]: 'is'
 };
+const USE_OPTION_ID_CELL_TYPES = [CellType.SINGLE_SELECT, CellType.MULTIPLE_SELECT];
 const getFilterByColumnType = (columnKey, columns, value) => {
   const filter = {
     column_key: columnKey || ''
@@ -510,8 +511,20 @@ const getFilterByColumnType = (columnKey, columns, value) => {
     filter['value'] = value;
     return filter;
   }
+  if (typeof value === 'string') {
+    value = value.trim();
+  }
+  if (USE_OPTION_ID_CELL_TYPES.includes(column === null || column === void 0 ? void 0 : column.type)) {
+    const options = getColumnOptions(column);
+    // name may contains spaces
+    // value maybe id or name, find option by name or id
+    const selectedOption = options.find(o => o.name.trim() === value || o.id === value);
+    filter['filter_term'] = selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.id;
+  } else {
+    // value may contains spaces
+    filter['filter_term'] = value;
+  }
   filter['filter_predicate'] = filterPredicateMap[column === null || column === void 0 ? void 0 : column.type];
-  filter['filter_term'] = value;
   return filter;
 };
 export const getFilterConditions = function (statisticRecord, chart) {
@@ -519,7 +532,9 @@ export const getFilterConditions = function (statisticRecord, chart) {
   const {
     name = '',
     group_name = '',
-    rows
+    groupby = '',
+    rows,
+    isPivot
   } = statisticRecord || {};
   const {
     config
@@ -530,7 +545,7 @@ export const getFilterConditions = function (statisticRecord, chart) {
   const filters = [];
   const columnKey = xAxisMap[type];
   const groupColumnKey = groupAxisMap[type];
-  if (!group_name && (rows === null || rows === void 0 ? void 0 : rows.length)) {
+  if (isPivot && rows.length) {
     const xValueList = [];
     const yValueList = [];
     rows.forEach(r => {
@@ -555,7 +570,7 @@ export const getFilterConditions = function (statisticRecord, chart) {
     const columnFilter = getFilterByColumnType(config[columnKey], columns, name);
     filters.push(columnFilter);
     if (config[groupColumnKey]) {
-      const groupColumnFilter = getFilterByColumnType(config[groupColumnKey], columns, group_name);
+      const groupColumnFilter = getFilterByColumnType(config[groupColumnKey], columns, group_name || groupby);
       filters.push(groupColumnFilter);
     }
   }

package/dist/view/wrapper/area.js

@@ -125,20 +125,6 @@ class Area extends ChartComponent {
         lineWidth: 2,
         opacity: 1
       });
-
-      // point
-      let point;
-      point = this.chart.point().animate({
-        appear: {
-          animation: 'fadeIn',
-          duration: 1000,
-          easing: 'easeLinear'
-        }
-      }).position('name*value').color(chartBarColor, colorCallBack).shape('circle').size(4).style({
-        stroke: 0,
-        fillOpacity: 1,
-        opacity: y_axis_show_value ? 1 : 0
-      }).tooltip(false);
       const area = this.chart.area().position('name*value').animate({
         appear: {
           animation: 'fadeIn',
@@ -154,6 +140,20 @@ class Area extends ChartComponent {
       }).style({
         fillOpacity: 0.3
       });
+
+      // point
+      let point;
+      point = this.chart.point().animate({
+        appear: {
+          animation: 'fadeIn',
+          duration: 1000,
+          easing: 'easeLinear'
+        }
+      }).position('name*value').color(chartBarColor, colorCallBack).shape('circle').size(4).style({
+        stroke: 0,
+        fillOpacity: 1,
+        opacity: y_axis_show_value ? 1 : 0
+      }).tooltip(false);
       this.chart.on('tooltip:show', () => {
         if (line.styleOption.cfg.opacity === 0.3) return;
         line.style({

package/dist/view/wrapper/scatter.js

@@ -28,7 +28,7 @@ export function Scatter(_ref) {
         appendPadding
       });
       currentChart.chart.on('element:click', e => {
-        toggleRecords(e.data.data);
+        toggleRecords(e.data.data.original_value);
       });
     }
     function drawChart() {

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

@@ -7,6 +7,10 @@ import './index.css';
 class Table extends PureComponent {
   constructor() {
     super(...arguments);
+    this.toggleRecords = (cell, selectedCell) => {
+      cell && (cell.isPivot = true);
+      this.props.toggleRecords(cell, selectedCell);
+    };
     this.renderContainer = () => {
       const {
         groupbyColumn,
@@ -21,13 +25,19 @@ class Table extends PureComponent {
         return /*#__PURE__*/React.createElement("div", null, intl.get('There_are_too_many_statistics_entries_to_display'));
       }
       if (columnGroupbyColumn) {
-        return /*#__PURE__*/React.createElement(TwoDimensionTable, this.props);
+        return /*#__PURE__*/React.createElement(TwoDimensionTable, Object.assign({}, this.props, {
+          toggleRecords: this.toggleRecords
+        }));
       }
       if (!Array.isArray(pivot_columns)) return null;
       if (pivot_columns.length < 2) {
-        return /*#__PURE__*/React.createElement(OneDimensionTableNoNumericColumns, this.props);
+        return /*#__PURE__*/React.createElement(OneDimensionTableNoNumericColumns, Object.assign({}, this.props, {
+          toggleRecords: this.toggleRecords
+        }));
       }
-      return /*#__PURE__*/React.createElement(OneDimensionTableWithNumericColumns, this.props);
+      return /*#__PURE__*/React.createElement(OneDimensionTableWithNumericColumns, Object.assign({}, this.props, {
+        toggleRecords: this.toggleRecords
+      }));
     };
   }
   render() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sea-chart",
-  "version": "0.0.94",
+  "version": "0.0.95",
   "main": "./dist/index.js",
   "dependencies": {
     "@antv/data-set": "0.11.8",