dtable-statistic 4.1.3 → 4.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/calculator/workers/basic-chart-calculator-worker.js +6 -2
- package/es/calculator/world-map-calculator.js +5 -1
- package/es/constants/regions.js +1147 -333
- package/es/stat-editor/stat-settings/advance-chart-settings/map-settings.js +0 -61
- package/es/stat-view/map.js +22 -18
- package/es/stat-view/world-map.js +5 -10
- package/es/utils/map.js +44 -0
- package/package.json +2 -2
|
@@ -5,15 +5,12 @@ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
|
5
5
|
import React, { Component, Fragment } from 'react';
|
|
6
6
|
import BaseSettings from '../public-setting/base-settings';
|
|
7
7
|
import ColumnSettings from '../public-setting/column-settings';
|
|
8
|
-
import GeoGranularitySettings from './geo-granularity-settings';
|
|
9
8
|
import SummarySettings from './summary-settings';
|
|
10
9
|
import MapStyleSetting from './style-setting/map-setting';
|
|
11
10
|
import { isMapColumn } from '../../../utils/column-utils';
|
|
12
11
|
import { GEOLOCATION_GRANULARITY } from '../../../constants';
|
|
13
12
|
import MapLevelSettings from '../map/map-level';
|
|
14
13
|
import MapProvinceCitySettings from '../map/map-province-city';
|
|
15
|
-
import { MAP_LEVEL } from '../../../constants/map';
|
|
16
|
-
import { fixGeoGranularity } from '../../../utils/map';
|
|
17
14
|
var MapSettings = /*#__PURE__*/function (_Component) {
|
|
18
15
|
_inherits(MapSettings, _Component);
|
|
19
16
|
var _super = _createSuper(MapSettings);
|
|
@@ -27,58 +24,11 @@ var MapSettings = /*#__PURE__*/function (_Component) {
|
|
|
27
24
|
return isMapColumn(column);
|
|
28
25
|
});
|
|
29
26
|
};
|
|
30
|
-
_this.generateGeoGranularityOptions = function () {
|
|
31
|
-
_this.provinceGranularityOption = {
|
|
32
|
-
label: /*#__PURE__*/React.createElement("span", {
|
|
33
|
-
className: "select-option-name"
|
|
34
|
-
}, '按省'),
|
|
35
|
-
value: GEOLOCATION_GRANULARITY.PROVINCE
|
|
36
|
-
};
|
|
37
|
-
_this.cityGranularityOption = {
|
|
38
|
-
label: /*#__PURE__*/React.createElement("span", {
|
|
39
|
-
className: "select-option-name"
|
|
40
|
-
}, '按市'),
|
|
41
|
-
value: GEOLOCATION_GRANULARITY.CITY
|
|
42
|
-
};
|
|
43
|
-
_this.districtGranularityOption = {
|
|
44
|
-
label: /*#__PURE__*/React.createElement("span", {
|
|
45
|
-
className: "select-option-name"
|
|
46
|
-
}, '按区/县'),
|
|
47
|
-
value: GEOLOCATION_GRANULARITY.DISTRICT
|
|
48
|
-
};
|
|
49
|
-
};
|
|
50
27
|
_this.getSelectedGeoColumnOption = function () {
|
|
51
28
|
return _this.geoColumnsOptions.find(function (option) {
|
|
52
29
|
return option.value.key === _this.props.statItem.geo_column;
|
|
53
30
|
});
|
|
54
31
|
};
|
|
55
|
-
_this.getGeoGranularityOptions = function () {
|
|
56
|
-
var map_level = _this.props.statItem.map_level;
|
|
57
|
-
return _this.mapLevel2GeoGranularityOptions[map_level || MAP_LEVEL.COUNTRY];
|
|
58
|
-
};
|
|
59
|
-
_this.getSelectedGeoGranularityOption = function () {
|
|
60
|
-
var _this$props$statItem = _this.props.statItem,
|
|
61
|
-
map_level = _this$props$statItem.map_level,
|
|
62
|
-
map_location = _this$props$statItem.map_location;
|
|
63
|
-
var geoGranularity = fixGeoGranularity({
|
|
64
|
-
mapLevel: map_level,
|
|
65
|
-
mapLocation: map_location
|
|
66
|
-
});
|
|
67
|
-
switch (geoGranularity) {
|
|
68
|
-
case GEOLOCATION_GRANULARITY.CITY:
|
|
69
|
-
{
|
|
70
|
-
return _this.cityGranularityOption;
|
|
71
|
-
}
|
|
72
|
-
case GEOLOCATION_GRANULARITY.DISTRICT:
|
|
73
|
-
{
|
|
74
|
-
return _this.districtGranularityOption;
|
|
75
|
-
}
|
|
76
|
-
default:
|
|
77
|
-
{
|
|
78
|
-
return _this.provinceGranularityOption;
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
};
|
|
82
32
|
_this.onSelectGeoColumn = function (option) {
|
|
83
33
|
var geo_column = _this.props.statItem.geo_column;
|
|
84
34
|
var new_geo_column = option.value.key;
|
|
@@ -88,14 +38,10 @@ var MapSettings = /*#__PURE__*/function (_Component) {
|
|
|
88
38
|
geolocation_granularity: GEOLOCATION_GRANULARITY.PROVINCE
|
|
89
39
|
}));
|
|
90
40
|
};
|
|
91
|
-
_this.onSelectGeoGranularity = function (option) {
|
|
92
|
-
return;
|
|
93
|
-
};
|
|
94
41
|
var _columns = props.columns,
|
|
95
42
|
getColumnsOptions = props.getColumnsOptions;
|
|
96
43
|
var geoColumns = _this.getColumns(_columns);
|
|
97
44
|
_this.geoColumnsOptions = getColumnsOptions(geoColumns);
|
|
98
|
-
_this.generateGeoGranularityOptions();
|
|
99
45
|
return _this;
|
|
100
46
|
}
|
|
101
47
|
_createClass(MapSettings, [{
|
|
@@ -121,7 +67,6 @@ var MapSettings = /*#__PURE__*/function (_Component) {
|
|
|
121
67
|
numericColumns = _this$props.numericColumns;
|
|
122
68
|
var selectedViewId = statItem.view_id;
|
|
123
69
|
var selectedGeoColumnOption = this.getSelectedGeoColumnOption();
|
|
124
|
-
var selectedGeoGranularityOption = this.getSelectedGeoGranularityOption();
|
|
125
70
|
if (settingType === 'style') {
|
|
126
71
|
return /*#__PURE__*/React.createElement(MapStyleSetting, {
|
|
127
72
|
statItem: statItem,
|
|
@@ -154,12 +99,6 @@ var MapSettings = /*#__PURE__*/function (_Component) {
|
|
|
154
99
|
columnsOptions: this.geoColumnsOptions,
|
|
155
100
|
selectedColumnOption: selectedGeoColumnOption,
|
|
156
101
|
onChangeSelectedColumn: this.onSelectGeoColumn
|
|
157
|
-
})), /*#__PURE__*/React.createElement("div", {
|
|
158
|
-
className: "statistic-chart-parameter-item"
|
|
159
|
-
}, /*#__PURE__*/React.createElement(GeoGranularitySettings, {
|
|
160
|
-
geoGranularityOptions: [selectedGeoGranularityOption],
|
|
161
|
-
selectedGeoGranularityOption: selectedGeoGranularityOption,
|
|
162
|
-
onChangeGeoGranularity: this.onSelectGeoGranularity
|
|
163
102
|
})), /*#__PURE__*/React.createElement("div", {
|
|
164
103
|
className: "statistic-chart-parameter-divider"
|
|
165
104
|
}), /*#__PURE__*/React.createElement(SummarySettings, {
|
package/es/stat-view/map.js
CHANGED
|
@@ -11,8 +11,7 @@ import { Chart } from '../custom-g2';
|
|
|
11
11
|
import { COLOR_OPTIONS, DEFAULT_NUMBER_FORMAT_OBJECT, SUMMARY_TYPE } from '../constants';
|
|
12
12
|
import { MAP_LEVEL } from '../constants/map';
|
|
13
13
|
import { shallowEqual } from '../utils/common-utils';
|
|
14
|
-
|
|
15
|
-
var HEIGHT = 520;
|
|
14
|
+
import { getRegionScaleOffsets } from '../utils/map';
|
|
16
15
|
var Map = /*#__PURE__*/function (_BaseChart) {
|
|
17
16
|
_inherits(Map, _BaseChart);
|
|
18
17
|
var _super = _createSuper(Map);
|
|
@@ -28,10 +27,7 @@ var Map = /*#__PURE__*/function (_BaseChart) {
|
|
|
28
27
|
return map_level !== preMapLevel || !shallowEqual(map_location, prevMapLocation);
|
|
29
28
|
};
|
|
30
29
|
_this.reCalculateChart = function (statItem) {
|
|
31
|
-
|
|
32
|
-
_this.chart.destroy();
|
|
33
|
-
_this.initStatisticContext(_this.geoData);
|
|
34
|
-
}
|
|
30
|
+
_this.rerenderChart();
|
|
35
31
|
_this.props.chartCalculator.calculate(statItem).then(function (statData) {
|
|
36
32
|
_this.calculateData = statData;
|
|
37
33
|
_this.setState({
|
|
@@ -44,6 +40,11 @@ var Map = /*#__PURE__*/function (_BaseChart) {
|
|
|
44
40
|
}
|
|
45
41
|
});
|
|
46
42
|
};
|
|
43
|
+
_this.rerenderChart = function () {
|
|
44
|
+
if (!_this.chart) return;
|
|
45
|
+
_this.chart.destroy();
|
|
46
|
+
_this.initStatisticContext(_this.geoData);
|
|
47
|
+
};
|
|
47
48
|
_this.getMapLevel = function (statItem) {
|
|
48
49
|
var map_level = statItem.map_level;
|
|
49
50
|
return map_level || MAP_LEVEL.COUNTRY;
|
|
@@ -143,16 +144,14 @@ var Map = /*#__PURE__*/function (_BaseChart) {
|
|
|
143
144
|
return _this.getNumberDisplayString(value, columnData, summary_method);
|
|
144
145
|
}
|
|
145
146
|
},
|
|
146
|
-
|
|
147
|
-
style: {
|
|
148
|
-
'opacity': 0
|
|
149
|
-
}
|
|
150
|
-
}
|
|
147
|
+
slidable: false
|
|
151
148
|
});
|
|
152
149
|
_this.statisticView.interaction('element-active');
|
|
153
150
|
_this.statisticView.render();
|
|
154
151
|
};
|
|
155
152
|
_this.updateStatisticData = function (data) {
|
|
153
|
+
_this.rerenderChart();
|
|
154
|
+
|
|
156
155
|
// re-render statistic data view;
|
|
157
156
|
if (_this.statisticView) {
|
|
158
157
|
_this.statisticView.destroy();
|
|
@@ -195,6 +194,9 @@ var Map = /*#__PURE__*/function (_BaseChart) {
|
|
|
195
194
|
}
|
|
196
195
|
_this.statisticView = _this.chart.createView();
|
|
197
196
|
_this.statisticView.data(userDv.rows);
|
|
197
|
+
_this.chart.theme({
|
|
198
|
+
defaultColor: statItem.bubble_color || '#2a67d1'
|
|
199
|
+
});
|
|
198
200
|
_this.statisticView.point().position('longitude*latitude').size('value', function (value) {
|
|
199
201
|
var percent = value / data.sum;
|
|
200
202
|
var size = percent * 100;
|
|
@@ -239,23 +241,25 @@ var Map = /*#__PURE__*/function (_BaseChart) {
|
|
|
239
241
|
return _this.getNumberDisplayString(value, columnData, summary_method);
|
|
240
242
|
}
|
|
241
243
|
},
|
|
242
|
-
|
|
243
|
-
style: {
|
|
244
|
-
'opacity': 0
|
|
245
|
-
}
|
|
246
|
-
}
|
|
244
|
+
slidable: false
|
|
247
245
|
});
|
|
248
246
|
_this.statisticView.interaction('element-active');
|
|
249
247
|
_this.statisticView.render();
|
|
250
248
|
};
|
|
251
249
|
_this.getCanvasSize = function () {
|
|
250
|
+
var statItem = _this.props.statItem;
|
|
251
|
+
var map_level = statItem.map_level,
|
|
252
|
+
map_location = statItem.map_location;
|
|
252
253
|
var maxWidth = _this.container.clientWidth;
|
|
253
254
|
var maxHeight = _this.container.clientHeight;
|
|
255
|
+
var _getRegionScaleOffset = getRegionScaleOffsets(map_level, map_location),
|
|
256
|
+
scale_w = _getRegionScaleOffset.scale_w,
|
|
257
|
+
scale_h = _getRegionScaleOffset.scale_h;
|
|
254
258
|
var h = maxHeight;
|
|
255
|
-
var w = h * (
|
|
259
|
+
var w = h * (scale_w / scale_h);
|
|
256
260
|
if (w > maxWidth) {
|
|
257
261
|
w = maxWidth;
|
|
258
|
-
h = w * (
|
|
262
|
+
h = w * (scale_h / scale_w);
|
|
259
263
|
}
|
|
260
264
|
return {
|
|
261
265
|
w: w,
|
|
@@ -125,11 +125,7 @@ var WorldMap = /*#__PURE__*/function (_BaseChart) {
|
|
|
125
125
|
return _this.getNumberDisplayString(value, summaryColumnData, summary_method);
|
|
126
126
|
}
|
|
127
127
|
},
|
|
128
|
-
|
|
129
|
-
style: {
|
|
130
|
-
'opacity': 0
|
|
131
|
-
}
|
|
132
|
-
}
|
|
128
|
+
slidable: false
|
|
133
129
|
});
|
|
134
130
|
_this.statisticView.interaction('element-active');
|
|
135
131
|
_this.statisticView.render();
|
|
@@ -158,6 +154,9 @@ var WorldMap = /*#__PURE__*/function (_BaseChart) {
|
|
|
158
154
|
}
|
|
159
155
|
_this.statisticView = _this.chart.createView();
|
|
160
156
|
_this.statisticView.data(userDv.rows);
|
|
157
|
+
_this.chart.theme({
|
|
158
|
+
defaultColor: statItem.bubble_color || '#2a67d1'
|
|
159
|
+
});
|
|
161
160
|
_this.statisticView.point().position('longitude*latitude').size('value', function (value) {
|
|
162
161
|
var percent = value / data.sum;
|
|
163
162
|
var size = percent * 100;
|
|
@@ -202,11 +201,7 @@ var WorldMap = /*#__PURE__*/function (_BaseChart) {
|
|
|
202
201
|
return _this.getNumberDisplayString(value, summaryColumnData, summary_method);
|
|
203
202
|
}
|
|
204
203
|
},
|
|
205
|
-
|
|
206
|
-
style: {
|
|
207
|
-
'opacity': 0
|
|
208
|
-
}
|
|
209
|
-
}
|
|
204
|
+
slidable: false
|
|
210
205
|
});
|
|
211
206
|
_this.statisticView.interaction('element-active');
|
|
212
207
|
_this.statisticView.render();
|
package/es/utils/map.js
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { GEOLOCATION_GRANULARITY, STAT_TYPE } from '../constants';
|
|
2
2
|
import { MAP_LEVEL, MUNICIPALITIES } from '../constants/map';
|
|
3
3
|
import { regions } from '../constants/regions';
|
|
4
|
+
var COUNTY_SCALE_WIDTH = 5.95;
|
|
5
|
+
var COUNTY_SCALE_HEIGHT = 4.37;
|
|
4
6
|
export var getGeoGranularityByLevel = function getGeoGranularityByLevel(mapLevel) {
|
|
5
7
|
switch (mapLevel) {
|
|
6
8
|
case MAP_LEVEL.PROVINCE:
|
|
@@ -61,4 +63,46 @@ export var fixMapGeoGranularity = function fixMapGeoGranularity(chart) {
|
|
|
61
63
|
mapLevel: map_level,
|
|
62
64
|
mapLocation: map_location
|
|
63
65
|
});
|
|
66
|
+
};
|
|
67
|
+
export var getRegionScaleOffsets = function getRegionScaleOffsets(mapLevel, mapLocation) {
|
|
68
|
+
var countryScaleOffsets = {
|
|
69
|
+
scale_w: COUNTY_SCALE_WIDTH,
|
|
70
|
+
scale_h: COUNTY_SCALE_HEIGHT
|
|
71
|
+
};
|
|
72
|
+
switch (mapLevel) {
|
|
73
|
+
case MAP_LEVEL.PROVINCE:
|
|
74
|
+
{
|
|
75
|
+
var provinceName = mapLocation && mapLocation.province;
|
|
76
|
+
var province = provinceName && regions.find(function (province) {
|
|
77
|
+
return province.name === provinceName;
|
|
78
|
+
});
|
|
79
|
+
if (!province) return countryScaleOffsets;
|
|
80
|
+
return {
|
|
81
|
+
scale_w: province.scale_w,
|
|
82
|
+
scale_h: province.scale_h
|
|
83
|
+
};
|
|
84
|
+
}
|
|
85
|
+
case MAP_LEVEL.CITY:
|
|
86
|
+
{
|
|
87
|
+
var _provinceName = mapLocation && mapLocation.province;
|
|
88
|
+
var _province = _provinceName && regions.find(function (province) {
|
|
89
|
+
return province.name === _provinceName;
|
|
90
|
+
});
|
|
91
|
+
var cities = _province && _province.cities;
|
|
92
|
+
var cityName = mapLocation.city;
|
|
93
|
+
var city = cityName && Array.isArray(cities) && cities.find(function (city) {
|
|
94
|
+
return city.name === cityName;
|
|
95
|
+
});
|
|
96
|
+
if (!city) return countryScaleOffsets;
|
|
97
|
+
return {
|
|
98
|
+
scale_w: city.scale_w,
|
|
99
|
+
scale_h: city.scale_h
|
|
100
|
+
};
|
|
101
|
+
}
|
|
102
|
+
default:
|
|
103
|
+
{
|
|
104
|
+
// default as 'country'
|
|
105
|
+
return countryScaleOffsets;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
64
108
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "dtable-statistic",
|
|
3
|
-
"version": "4.1.
|
|
3
|
+
"version": "4.1.4",
|
|
4
4
|
"description": "statistics",
|
|
5
5
|
"main": "dist/dtable-statistic.js",
|
|
6
6
|
"author": "seafile",
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
"@seafile/seafile-calendar": "0.0.24",
|
|
13
13
|
"comlink": "^4.3.1",
|
|
14
14
|
"dayjs": "1.10.7",
|
|
15
|
-
"dtable-store": "4.1.
|
|
15
|
+
"dtable-store": "4.1.2",
|
|
16
16
|
"dtable-web-api": "4.0.11",
|
|
17
17
|
"glamor": "^2.20.40",
|
|
18
18
|
"html2canvas": "^1.4.1",
|