@antv/gpt-vis 0.5.5 → 0.5.7
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/dist/cjs/Area/index.d.ts +2 -3
- package/dist/cjs/Area/index.js +48 -5
- package/dist/cjs/Bar/index.d.ts +5 -2
- package/dist/cjs/Bar/index.js +43 -7
- package/dist/cjs/Boxplot/index.d.ts +13 -0
- package/dist/cjs/Boxplot/index.js +88 -0
- package/dist/cjs/ChartCodeRender/VisChart.d.ts +7 -1
- package/dist/cjs/ChartCodeRender/VisChart.js +100 -12
- package/dist/cjs/ChartCodeRender/index.js +16 -2
- package/dist/cjs/ChartCodeRender/type.d.ts +104 -5
- package/dist/cjs/Column/index.d.ts +5 -3
- package/dist/cjs/Column/index.js +44 -7
- package/dist/cjs/ConfigProvider/hooks/useConfig.js +2 -1
- package/dist/cjs/DualAxes/index.d.ts +1 -1
- package/dist/cjs/DualAxes/index.js +20 -8
- package/dist/cjs/FishboneDiagram/index.d.ts +1 -0
- package/dist/cjs/FishboneDiagram/index.js +21 -7
- package/dist/cjs/Funnel/index.d.ts +12 -0
- package/dist/cjs/Funnel/index.js +173 -0
- package/dist/cjs/Histogram/index.d.ts +4 -3
- package/dist/cjs/Histogram/index.js +32 -3
- package/dist/cjs/IndentedTree/index.d.ts +1 -0
- package/dist/cjs/IndentedTree/index.js +32 -20
- package/dist/cjs/Line/index.d.ts +2 -3
- package/dist/cjs/Line/index.js +36 -3
- package/dist/cjs/Liquid/index.d.ts +11 -0
- package/dist/cjs/Liquid/index.js +85 -0
- package/dist/cjs/MindMap/index.d.ts +1 -0
- package/dist/cjs/MindMap/index.js +29 -21
- package/dist/cjs/Pie/index.d.ts +2 -2
- package/dist/cjs/Pie/index.js +22 -3
- package/dist/cjs/Radar/index.d.ts +5 -3
- package/dist/cjs/Radar/index.js +106 -37
- package/dist/cjs/Sankey/index.d.ts +12 -0
- package/dist/cjs/Sankey/index.js +106 -0
- package/dist/cjs/Scatter/index.d.ts +2 -3
- package/dist/cjs/Scatter/index.js +52 -6
- package/dist/cjs/Treemap/index.d.ts +2 -3
- package/dist/cjs/Treemap/index.js +23 -3
- package/dist/cjs/Venn/index.d.ts +32 -0
- package/dist/cjs/Venn/index.js +87 -0
- package/dist/cjs/Violin/index.d.ts +10 -0
- package/dist/cjs/Violin/index.js +185 -0
- package/dist/cjs/WordCloud/index.d.ts +2 -3
- package/dist/cjs/WordCloud/index.js +34 -7
- package/dist/cjs/export.d.ts +7 -1
- package/dist/cjs/export.js +38 -8
- package/dist/cjs/theme.d.ts +2 -0
- package/dist/cjs/theme.js +133 -0
- package/dist/cjs/types/chart.d.ts +17 -0
- package/dist/cjs/types/chart.js +6 -0
- package/dist/cjs/utils/palette.d.ts +2 -0
- package/dist/cjs/utils/palette.js +54 -0
- package/dist/cjs/utils/plot.d.ts +1 -0
- package/dist/cjs/utils/plot.js +15 -0
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/esm/Area/index.d.ts +2 -3
- package/dist/esm/Area/index.js +80 -6
- package/dist/esm/Bar/index.d.ts +5 -2
- package/dist/esm/Bar/index.js +66 -9
- package/dist/esm/Boxplot/index.d.ts +13 -0
- package/dist/esm/Boxplot/index.js +83 -0
- package/dist/esm/ChartCodeRender/VisChart.d.ts +7 -1
- package/dist/esm/ChartCodeRender/VisChart.js +144 -34
- package/dist/esm/ChartCodeRender/index.js +15 -1
- package/dist/esm/ChartCodeRender/type.d.ts +104 -5
- package/dist/esm/Column/index.d.ts +5 -3
- package/dist/esm/Column/index.js +67 -9
- package/dist/esm/ConfigProvider/hooks/useConfig.js +9 -1
- package/dist/esm/DualAxes/index.d.ts +1 -1
- package/dist/esm/DualAxes/index.js +35 -12
- package/dist/esm/FishboneDiagram/index.d.ts +1 -0
- package/dist/esm/FishboneDiagram/index.js +23 -7
- package/dist/esm/Funnel/index.d.ts +12 -0
- package/dist/esm/Funnel/index.js +171 -0
- package/dist/esm/Histogram/index.d.ts +4 -3
- package/dist/esm/Histogram/index.js +55 -5
- package/dist/esm/IndentedTree/index.d.ts +1 -0
- package/dist/esm/IndentedTree/index.js +36 -29
- package/dist/esm/Line/index.d.ts +2 -3
- package/dist/esm/Line/index.js +63 -4
- package/dist/esm/Liquid/index.d.ts +11 -0
- package/dist/esm/Liquid/index.js +100 -0
- package/dist/esm/MindMap/index.d.ts +1 -0
- package/dist/esm/MindMap/index.js +37 -30
- package/dist/esm/Pie/index.d.ts +2 -2
- package/dist/esm/Pie/index.js +37 -4
- package/dist/esm/Radar/index.d.ts +5 -3
- package/dist/esm/Radar/index.js +138 -42
- package/dist/esm/Sankey/index.d.ts +12 -0
- package/dist/esm/Sankey/index.js +88 -0
- package/dist/esm/Scatter/index.d.ts +2 -3
- package/dist/esm/Scatter/index.js +76 -11
- package/dist/esm/Treemap/index.d.ts +2 -3
- package/dist/esm/Treemap/index.js +39 -4
- package/dist/esm/Venn/index.d.ts +32 -0
- package/dist/esm/Venn/index.js +69 -0
- package/dist/esm/Violin/index.d.ts +10 -0
- package/dist/esm/Violin/index.js +192 -0
- package/dist/esm/WordCloud/index.d.ts +2 -3
- package/dist/esm/WordCloud/index.js +51 -9
- package/dist/esm/export.d.ts +7 -1
- package/dist/esm/export.js +8 -2
- package/dist/esm/theme.d.ts +2 -0
- package/dist/esm/theme.js +103 -0
- package/dist/esm/types/chart.d.ts +17 -0
- package/dist/esm/types/chart.js +6 -0
- package/dist/esm/utils/palette.d.ts +2 -0
- package/dist/esm/utils/palette.js +2 -0
- package/dist/esm/utils/plot.d.ts +1 -0
- package/dist/esm/utils/plot.js +10 -0
- package/dist/esm/version.d.ts +1 -1
- package/dist/esm/version.js +1 -1
- package/dist/umd/373.async.js +1 -0
- package/dist/umd/index.min.js +1 -1
- package/package.json +2 -1
- package/dist/umd/962.async.js +0 -1
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
import { Chart } from '@antv/g2';
|
|
8
|
+
import React, { useEffect, useRef } from 'react';
|
|
9
|
+
import { THEME_MAP } from "../theme";
|
|
10
|
+
var defaultConfig = function defaultConfig(props) {
|
|
11
|
+
var title = props.title,
|
|
12
|
+
data = props.data,
|
|
13
|
+
_props$theme = props.theme,
|
|
14
|
+
theme = _props$theme === void 0 ? 'default' : _props$theme,
|
|
15
|
+
_props$nodeAlign = props.nodeAlign,
|
|
16
|
+
nodeAlign = _props$nodeAlign === void 0 ? 'center' : _props$nodeAlign,
|
|
17
|
+
_props$style = props.style,
|
|
18
|
+
style = _props$style === void 0 ? {} : _props$style;
|
|
19
|
+
var backgroundColor = style.backgroundColor,
|
|
20
|
+
palette = style.palette;
|
|
21
|
+
var hasPalette = !!(palette !== null && palette !== void 0 && palette[0]);
|
|
22
|
+
var paletteConfig = {};
|
|
23
|
+
if (hasPalette) {
|
|
24
|
+
paletteConfig = {
|
|
25
|
+
color: {
|
|
26
|
+
range: palette
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
return _objectSpread({
|
|
31
|
+
title: title,
|
|
32
|
+
type: 'sankey',
|
|
33
|
+
theme: THEME_MAP[theme],
|
|
34
|
+
layout: {
|
|
35
|
+
nodeAlign: nodeAlign,
|
|
36
|
+
nodePadding: 0.01
|
|
37
|
+
},
|
|
38
|
+
data: {
|
|
39
|
+
type: 'inline',
|
|
40
|
+
value: data,
|
|
41
|
+
transform: [{
|
|
42
|
+
type: 'custom',
|
|
43
|
+
callback: function callback(data) {
|
|
44
|
+
return {
|
|
45
|
+
links: data
|
|
46
|
+
};
|
|
47
|
+
}
|
|
48
|
+
}]
|
|
49
|
+
},
|
|
50
|
+
scale: _objectSpread({}, paletteConfig),
|
|
51
|
+
style: {
|
|
52
|
+
labelSpacing: 2,
|
|
53
|
+
nodeLineWidth: 1,
|
|
54
|
+
linkFillOpacity: 0.3
|
|
55
|
+
},
|
|
56
|
+
viewStyle: {
|
|
57
|
+
viewFill: 'red'
|
|
58
|
+
}
|
|
59
|
+
}, backgroundColor ? {
|
|
60
|
+
viewStyle: {
|
|
61
|
+
viewFill: backgroundColor
|
|
62
|
+
}
|
|
63
|
+
} : {});
|
|
64
|
+
};
|
|
65
|
+
var Sankey = function Sankey(props) {
|
|
66
|
+
var containerRef = useRef(null);
|
|
67
|
+
var chartRef = useRef(null);
|
|
68
|
+
useEffect(function () {
|
|
69
|
+
if (!containerRef.current) return;
|
|
70
|
+
var chart = new Chart({
|
|
71
|
+
container: containerRef.current,
|
|
72
|
+
autoFit: true,
|
|
73
|
+
padding: 'auto'
|
|
74
|
+
});
|
|
75
|
+
var config = defaultConfig(props);
|
|
76
|
+
chart.options(config);
|
|
77
|
+
chart.render();
|
|
78
|
+
chartRef.current = chart;
|
|
79
|
+
return function () {
|
|
80
|
+
chart.destroy();
|
|
81
|
+
chartRef.current = null;
|
|
82
|
+
};
|
|
83
|
+
}, [props]);
|
|
84
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
85
|
+
ref: containerRef
|
|
86
|
+
});
|
|
87
|
+
};
|
|
88
|
+
export default Sankey;
|
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import type { ScatterConfig } from '@ant-design/plots';
|
|
2
1
|
import React from 'react';
|
|
3
|
-
import type { BasePlotProps } from '../types';
|
|
2
|
+
import type { BasePlotProps, Style, Theme } from '../types';
|
|
4
3
|
type ScatterDataItem = {
|
|
5
4
|
x: number;
|
|
6
5
|
y: number;
|
|
7
6
|
[key: string]: string | number;
|
|
8
7
|
};
|
|
9
|
-
export type ScatterProps = BasePlotProps<ScatterDataItem> &
|
|
8
|
+
export type ScatterProps = BasePlotProps<ScatterDataItem> & Theme & Style;
|
|
10
9
|
declare const Scatter: (props: ScatterProps) => React.JSX.Element;
|
|
11
10
|
export default Scatter;
|
|
@@ -1,30 +1,95 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
1
7
|
import { Scatter as ADCScatter } from '@ant-design/plots';
|
|
2
8
|
import { get } from 'lodash';
|
|
3
9
|
import React from 'react';
|
|
4
10
|
import { usePlotConfig } from "../ConfigProvider/hooks";
|
|
11
|
+
import { THEME_MAP } from "../theme";
|
|
5
12
|
var defaultConfig = function defaultConfig(props) {
|
|
13
|
+
var _;
|
|
6
14
|
var data = props.data,
|
|
7
15
|
_props$xField = props.xField,
|
|
8
16
|
xField = _props$xField === void 0 ? 'x' : _props$xField,
|
|
9
17
|
_props$yField = props.yField,
|
|
10
|
-
yField = _props$yField === void 0 ? 'y' : _props$yField
|
|
18
|
+
yField = _props$yField === void 0 ? 'y' : _props$yField,
|
|
19
|
+
_props$style = props.style,
|
|
20
|
+
style = _props$style === void 0 ? {} : _props$style;
|
|
21
|
+
var backgroundColor = style.backgroundColor,
|
|
22
|
+
palette = style.palette;
|
|
11
23
|
var axisXTitle = get(props, 'axis.x.title');
|
|
12
24
|
var axisYTitle = get(props, 'axis.y.title');
|
|
13
|
-
|
|
25
|
+
var hasGroupField = ((_ = (data || [])[0]) === null || _ === void 0 ? void 0 : _.group) !== undefined;
|
|
26
|
+
var hasPalette = !!(palette !== null && palette !== void 0 && palette[0]);
|
|
27
|
+
var paletteConfig = {
|
|
28
|
+
color: undefined
|
|
29
|
+
};
|
|
30
|
+
var encode = {};
|
|
31
|
+
if (hasPalette) {
|
|
32
|
+
paletteConfig = {
|
|
33
|
+
color: {
|
|
34
|
+
range: palette
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
}
|
|
38
|
+
if (hasGroupField) {
|
|
39
|
+
encode = {
|
|
40
|
+
x: xField,
|
|
41
|
+
y: yField,
|
|
42
|
+
color: 'group'
|
|
43
|
+
};
|
|
44
|
+
} else {
|
|
45
|
+
encode = {
|
|
46
|
+
x: xField,
|
|
47
|
+
y: yField,
|
|
48
|
+
color: function color() {
|
|
49
|
+
return 'all';
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
}
|
|
53
|
+
return _objectSpread({
|
|
14
54
|
data: data,
|
|
15
55
|
xField: xField,
|
|
16
56
|
yField: yField,
|
|
17
|
-
tooltip:
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
57
|
+
tooltip: {
|
|
58
|
+
title: function title(d) {
|
|
59
|
+
return d !== null && d !== void 0 && d.group ? d.group : false;
|
|
60
|
+
},
|
|
61
|
+
items: [{
|
|
62
|
+
channel: 'x',
|
|
63
|
+
name: axisXTitle || 'x'
|
|
64
|
+
}, {
|
|
65
|
+
channel: 'y',
|
|
66
|
+
name: axisYTitle || 'y'
|
|
67
|
+
}]
|
|
68
|
+
},
|
|
69
|
+
legend: hasGroupField ? {} : false,
|
|
70
|
+
encode: encode,
|
|
71
|
+
scale: _objectSpread({
|
|
72
|
+
y: {
|
|
73
|
+
nice: true
|
|
74
|
+
}
|
|
75
|
+
}, paletteConfig),
|
|
76
|
+
style: {
|
|
77
|
+
lineWidth: 1
|
|
78
|
+
}
|
|
79
|
+
}, backgroundColor ? {
|
|
80
|
+
viewStyle: {
|
|
81
|
+
viewFill: backgroundColor
|
|
82
|
+
}
|
|
83
|
+
} : {
|
|
84
|
+
viewStyle: undefined
|
|
85
|
+
});
|
|
25
86
|
};
|
|
26
87
|
var Scatter = function Scatter(props) {
|
|
27
|
-
var
|
|
88
|
+
var _props$theme;
|
|
89
|
+
var themeConfig = THEME_MAP[(_props$theme = props.theme) !== null && _props$theme !== void 0 ? _props$theme : 'default'];
|
|
90
|
+
var config = usePlotConfig('Scatter', defaultConfig, _objectSpread(_objectSpread({}, props), {}, {
|
|
91
|
+
theme: themeConfig
|
|
92
|
+
}));
|
|
28
93
|
return /*#__PURE__*/React.createElement(ADCScatter, config);
|
|
29
94
|
};
|
|
30
95
|
export default Scatter;
|
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import type { TreemapConfig } from '@ant-design/plots';
|
|
2
1
|
import React from 'react';
|
|
3
|
-
import type { BasePlotProps } from '../types';
|
|
2
|
+
import type { BasePlotProps, Style, Theme } from '../types';
|
|
4
3
|
type TreeNode = {
|
|
5
4
|
name: string;
|
|
6
5
|
value: number;
|
|
7
6
|
children?: TreeNode[];
|
|
8
7
|
};
|
|
9
|
-
export type TreemapProps = BasePlotProps<TreeNode> &
|
|
8
|
+
export type TreemapProps = BasePlotProps<TreeNode> & Theme & Style;
|
|
10
9
|
declare const Treemap: (props: TreemapProps) => React.JSX.Element;
|
|
11
10
|
export default Treemap;
|
|
@@ -1,17 +1,39 @@
|
|
|
1
1
|
var _excluded = ["data"];
|
|
2
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
3
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
4
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
4
5
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
6
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
7
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
8
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
9
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
10
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
5
11
|
import { Treemap as ADCTreemap } from '@ant-design/plots';
|
|
6
12
|
import React, { useMemo } from 'react';
|
|
7
13
|
import { usePlotConfig } from "../ConfigProvider/hooks";
|
|
14
|
+
import { THEME_MAP } from "../theme";
|
|
8
15
|
|
|
9
16
|
// binNumber和binWidth为互斥属性,选其一即可
|
|
10
17
|
|
|
11
18
|
var defaultConfig = function defaultConfig(props) {
|
|
12
19
|
var _props$valueField = props.valueField,
|
|
13
|
-
valueField = _props$valueField === void 0 ? 'value' : _props$valueField
|
|
14
|
-
|
|
20
|
+
valueField = _props$valueField === void 0 ? 'value' : _props$valueField,
|
|
21
|
+
_props$style = props.style,
|
|
22
|
+
style = _props$style === void 0 ? {} : _props$style;
|
|
23
|
+
var backgroundColor = style.backgroundColor,
|
|
24
|
+
palette = style.palette;
|
|
25
|
+
var hasPalette = !!(palette !== null && palette !== void 0 && palette[0]);
|
|
26
|
+
var paletteConfig = {
|
|
27
|
+
color: undefined
|
|
28
|
+
};
|
|
29
|
+
if (hasPalette) {
|
|
30
|
+
paletteConfig = {
|
|
31
|
+
color: {
|
|
32
|
+
range: palette
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
return _objectSpread(_objectSpread({
|
|
15
37
|
legend: false,
|
|
16
38
|
layout: {
|
|
17
39
|
tile: 'treemapBinary',
|
|
@@ -31,7 +53,15 @@ var defaultConfig = function defaultConfig(props) {
|
|
|
31
53
|
fillOpacity: 0.8,
|
|
32
54
|
labelFontSize: 12
|
|
33
55
|
}
|
|
34
|
-
}
|
|
56
|
+
}, backgroundColor ? {
|
|
57
|
+
viewStyle: {
|
|
58
|
+
viewFill: backgroundColor
|
|
59
|
+
}
|
|
60
|
+
} : {
|
|
61
|
+
viewStyle: undefined
|
|
62
|
+
}), {}, {
|
|
63
|
+
scale: _objectSpread({}, paletteConfig)
|
|
64
|
+
});
|
|
35
65
|
};
|
|
36
66
|
var transform = function transform(data) {
|
|
37
67
|
return {
|
|
@@ -40,12 +70,17 @@ var transform = function transform(data) {
|
|
|
40
70
|
};
|
|
41
71
|
};
|
|
42
72
|
var Treemap = function Treemap(props) {
|
|
43
|
-
var
|
|
73
|
+
var _props$theme;
|
|
74
|
+
var themeConfig = THEME_MAP[(_props$theme = props.theme) !== null && _props$theme !== void 0 ? _props$theme : 'default'];
|
|
75
|
+
var config = usePlotConfig('Treemap', defaultConfig, _objectSpread(_objectSpread({}, props), {}, {
|
|
76
|
+
theme: themeConfig
|
|
77
|
+
}));
|
|
44
78
|
var data = config.data,
|
|
45
79
|
others = _objectWithoutProperties(config, _excluded);
|
|
46
80
|
var transformData = useMemo(function () {
|
|
47
81
|
return transform(data);
|
|
48
82
|
}, [data]);
|
|
83
|
+
console.log('treemap config:', config, props);
|
|
49
84
|
return /*#__PURE__*/React.createElement(ADCTreemap, _extends({}, others, {
|
|
50
85
|
data: transformData
|
|
51
86
|
}));
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
|
+
type VennDatum = {
|
|
4
|
+
/**
|
|
5
|
+
* Label for the venn chart segment.
|
|
6
|
+
* This should be a string that describes the segment.
|
|
7
|
+
* For example, "A", "B", or "A ∩ B" for intersections.
|
|
8
|
+
* It is used to identify the segment in the chart.
|
|
9
|
+
*/
|
|
10
|
+
label?: string;
|
|
11
|
+
/**
|
|
12
|
+
* Value for the venn chart segment.
|
|
13
|
+
* This should be a number that represents the size or count of the segment.
|
|
14
|
+
* For example, if the segment represents a set of items, this could be the number of items in that set.
|
|
15
|
+
* It is used to determine the size of the segment in the chart.
|
|
16
|
+
* For intersections, this value should represent the count of items that belong to the intersection of sets.
|
|
17
|
+
* For example, if "A ∩ B" represents the intersection of sets A and B, this value should be the count of items that are in both sets.
|
|
18
|
+
*/
|
|
19
|
+
value: number;
|
|
20
|
+
/**
|
|
21
|
+
* Sets that the segment belongs to.
|
|
22
|
+
* This should be an array of strings representing the sets that the segment is part of.
|
|
23
|
+
* For example, if the segment represents items that belong to both set A and set B, this could be ['A', 'B'].
|
|
24
|
+
* It is used to determine how the segment is displayed in the venn chart.
|
|
25
|
+
* For intersections, this array should include the sets that contribute to the intersection.
|
|
26
|
+
* For example, if "A ∩ B" represents the intersection of sets A and B, this array should be ['A', 'B'].
|
|
27
|
+
*/
|
|
28
|
+
sets: string[] | number[];
|
|
29
|
+
};
|
|
30
|
+
export type VennProps = BasePlotProps<VennDatum> & Theme & Style;
|
|
31
|
+
declare const Venn: (props: VennProps) => React.JSX.Element;
|
|
32
|
+
export default Venn;
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
import { Venn as ADCVenn } from '@ant-design/plots';
|
|
8
|
+
import React from 'react';
|
|
9
|
+
import { usePlotConfig } from "../ConfigProvider/hooks";
|
|
10
|
+
import { THEME_MAP } from "../theme";
|
|
11
|
+
var defaultConfig = function defaultConfig(props) {
|
|
12
|
+
var data = props.data,
|
|
13
|
+
_props$style = props.style,
|
|
14
|
+
style = _props$style === void 0 ? {} : _props$style;
|
|
15
|
+
var backgroundColor = style.backgroundColor,
|
|
16
|
+
palette = style.palette;
|
|
17
|
+
var paletteConfig = {
|
|
18
|
+
color: undefined
|
|
19
|
+
};
|
|
20
|
+
var hasPalette = !!(palette !== null && palette !== void 0 && palette[0]);
|
|
21
|
+
if (hasPalette) {
|
|
22
|
+
paletteConfig = {
|
|
23
|
+
color: {
|
|
24
|
+
range: palette
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
return _objectSpread(_objectSpread({
|
|
29
|
+
data: data,
|
|
30
|
+
sizeField: 'value'
|
|
31
|
+
}, backgroundColor ? {
|
|
32
|
+
viewStyle: {
|
|
33
|
+
viewFill: backgroundColor
|
|
34
|
+
}
|
|
35
|
+
} : {}), {}, {
|
|
36
|
+
labels: [{
|
|
37
|
+
position: 'inside',
|
|
38
|
+
text: function text(d) {
|
|
39
|
+
return d.label || '';
|
|
40
|
+
},
|
|
41
|
+
transform: [{
|
|
42
|
+
type: 'contrastReverse'
|
|
43
|
+
}],
|
|
44
|
+
fill: '#000',
|
|
45
|
+
fillOpacity: 0.85,
|
|
46
|
+
fontSize: 10
|
|
47
|
+
}],
|
|
48
|
+
scale: _objectSpread({}, paletteConfig),
|
|
49
|
+
tooltip: {
|
|
50
|
+
title: false,
|
|
51
|
+
items: [function (d) {
|
|
52
|
+
return {
|
|
53
|
+
name: d.key,
|
|
54
|
+
value: d.size
|
|
55
|
+
};
|
|
56
|
+
}]
|
|
57
|
+
},
|
|
58
|
+
legend: false
|
|
59
|
+
});
|
|
60
|
+
};
|
|
61
|
+
var Venn = function Venn(props) {
|
|
62
|
+
var _props$theme;
|
|
63
|
+
var themeConfig = THEME_MAP[(_props$theme = props.theme) !== null && _props$theme !== void 0 ? _props$theme : 'default'];
|
|
64
|
+
var config = usePlotConfig('Venn', defaultConfig, _objectSpread(_objectSpread({}, props), {}, {
|
|
65
|
+
theme: themeConfig
|
|
66
|
+
}));
|
|
67
|
+
return /*#__PURE__*/React.createElement(ADCVenn, config);
|
|
68
|
+
};
|
|
69
|
+
export default Venn;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
|
+
type ViolinDatum = {
|
|
4
|
+
category: string;
|
|
5
|
+
value: number;
|
|
6
|
+
group?: string;
|
|
7
|
+
};
|
|
8
|
+
export type ViolinProps = BasePlotProps<ViolinDatum> & Theme & Style;
|
|
9
|
+
declare const Violin: (props: ViolinProps) => React.JSX.Element;
|
|
10
|
+
export default Violin;
|
|
@@ -0,0 +1,192 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
import { Chart } from '@antv/g2';
|
|
8
|
+
import React, { useEffect, useRef } from 'react';
|
|
9
|
+
import { THEME_MAP } from "../theme";
|
|
10
|
+
var defaultConfig = function defaultConfig(props) {
|
|
11
|
+
var _;
|
|
12
|
+
var data = props.data,
|
|
13
|
+
title = props.title,
|
|
14
|
+
axisYTitle = props.axisYTitle,
|
|
15
|
+
axisXTitle = props.axisXTitle,
|
|
16
|
+
_props$theme = props.theme,
|
|
17
|
+
theme = _props$theme === void 0 ? 'default' : _props$theme,
|
|
18
|
+
_props$style = props.style,
|
|
19
|
+
style = _props$style === void 0 ? {} : _props$style;
|
|
20
|
+
var backgroundColor = style.backgroundColor,
|
|
21
|
+
palette = style.palette;
|
|
22
|
+
var hasGroupField = ((_ = (data || [])[0]) === null || _ === void 0 ? void 0 : _.group) !== undefined;
|
|
23
|
+
var encode = {};
|
|
24
|
+
var children = [];
|
|
25
|
+
if (hasGroupField) {
|
|
26
|
+
encode = {
|
|
27
|
+
x: 'category',
|
|
28
|
+
y: 'y',
|
|
29
|
+
color: 'group',
|
|
30
|
+
series: 'group',
|
|
31
|
+
size: 'size'
|
|
32
|
+
};
|
|
33
|
+
children = [_objectSpread({
|
|
34
|
+
type: 'density',
|
|
35
|
+
data: {
|
|
36
|
+
transform: [{
|
|
37
|
+
type: 'kde',
|
|
38
|
+
field: 'value',
|
|
39
|
+
groupBy: ['category', 'group']
|
|
40
|
+
}]
|
|
41
|
+
},
|
|
42
|
+
encode: encode,
|
|
43
|
+
scale: _objectSpread({
|
|
44
|
+
y: {
|
|
45
|
+
nice: true
|
|
46
|
+
}
|
|
47
|
+
}, palette !== null && palette !== void 0 && palette[0] ? {
|
|
48
|
+
color: {
|
|
49
|
+
range: palette
|
|
50
|
+
}
|
|
51
|
+
} : {})
|
|
52
|
+
}, backgroundColor ? {
|
|
53
|
+
viewStyle: {
|
|
54
|
+
viewFill: backgroundColor
|
|
55
|
+
}
|
|
56
|
+
} : {}), _objectSpread(_objectSpread({
|
|
57
|
+
type: 'boxplot',
|
|
58
|
+
encode: {
|
|
59
|
+
x: 'category',
|
|
60
|
+
y: 'value',
|
|
61
|
+
series: 'group',
|
|
62
|
+
color: 'group',
|
|
63
|
+
shape: 'violin'
|
|
64
|
+
},
|
|
65
|
+
style: {
|
|
66
|
+
opacity: 0.5,
|
|
67
|
+
strokeOpacity: 0.5,
|
|
68
|
+
point: false
|
|
69
|
+
}
|
|
70
|
+
}, backgroundColor ? {
|
|
71
|
+
viewStyle: {
|
|
72
|
+
viewFill: backgroundColor
|
|
73
|
+
}
|
|
74
|
+
} : {}), {}, {
|
|
75
|
+
scale: _objectSpread({
|
|
76
|
+
y: {
|
|
77
|
+
nice: true
|
|
78
|
+
}
|
|
79
|
+
}, palette !== null && palette !== void 0 && palette[0] ? {
|
|
80
|
+
color: {
|
|
81
|
+
range: palette
|
|
82
|
+
}
|
|
83
|
+
} : {})
|
|
84
|
+
})];
|
|
85
|
+
} else {
|
|
86
|
+
encode = {
|
|
87
|
+
x: 'category',
|
|
88
|
+
y: 'y',
|
|
89
|
+
color: 'category',
|
|
90
|
+
size: 'size'
|
|
91
|
+
};
|
|
92
|
+
children = [_objectSpread(_objectSpread({
|
|
93
|
+
type: 'density',
|
|
94
|
+
data: {
|
|
95
|
+
transform: [{
|
|
96
|
+
type: 'kde',
|
|
97
|
+
field: 'value',
|
|
98
|
+
groupBy: ['category'],
|
|
99
|
+
size: 20
|
|
100
|
+
}]
|
|
101
|
+
},
|
|
102
|
+
encode: encode,
|
|
103
|
+
scale: {
|
|
104
|
+
y: {
|
|
105
|
+
nice: true
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
}, backgroundColor ? {
|
|
109
|
+
viewStyle: {
|
|
110
|
+
viewFill: backgroundColor
|
|
111
|
+
}
|
|
112
|
+
} : {}), {}, {
|
|
113
|
+
tooltip: false
|
|
114
|
+
}), _objectSpread(_objectSpread({
|
|
115
|
+
type: 'boxplot',
|
|
116
|
+
encode: {
|
|
117
|
+
x: 'category',
|
|
118
|
+
y: 'value',
|
|
119
|
+
color: 'category',
|
|
120
|
+
shape: 'violin'
|
|
121
|
+
},
|
|
122
|
+
style: {
|
|
123
|
+
opacity: 0.5,
|
|
124
|
+
strokeOpacity: 0.5,
|
|
125
|
+
point: false
|
|
126
|
+
}
|
|
127
|
+
}, backgroundColor ? {
|
|
128
|
+
viewStyle: {
|
|
129
|
+
viewFill: backgroundColor
|
|
130
|
+
}
|
|
131
|
+
} : {}), {}, {
|
|
132
|
+
scale: _objectSpread({
|
|
133
|
+
y: {
|
|
134
|
+
nice: true
|
|
135
|
+
}
|
|
136
|
+
}, palette !== null && palette !== void 0 && palette[0] ? {
|
|
137
|
+
color: {
|
|
138
|
+
range: palette
|
|
139
|
+
}
|
|
140
|
+
} : {})
|
|
141
|
+
})];
|
|
142
|
+
}
|
|
143
|
+
return _objectSpread({
|
|
144
|
+
type: 'view',
|
|
145
|
+
theme: THEME_MAP[theme],
|
|
146
|
+
title: title,
|
|
147
|
+
autoFit: true,
|
|
148
|
+
data: data,
|
|
149
|
+
axis: {
|
|
150
|
+
y: {
|
|
151
|
+
title: axisYTitle || false
|
|
152
|
+
},
|
|
153
|
+
x: {
|
|
154
|
+
title: axisXTitle || false
|
|
155
|
+
}
|
|
156
|
+
},
|
|
157
|
+
children: children,
|
|
158
|
+
scale: {
|
|
159
|
+
y: {
|
|
160
|
+
nice: true
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
}, backgroundColor ? {
|
|
164
|
+
viewStyle: {
|
|
165
|
+
viewFill: backgroundColor
|
|
166
|
+
}
|
|
167
|
+
} : {});
|
|
168
|
+
};
|
|
169
|
+
var Violin = function Violin(props) {
|
|
170
|
+
var containerRef = useRef(null);
|
|
171
|
+
var chartRef = useRef(null);
|
|
172
|
+
useEffect(function () {
|
|
173
|
+
if (!containerRef.current) return;
|
|
174
|
+
var chart = new Chart({
|
|
175
|
+
container: containerRef.current,
|
|
176
|
+
autoFit: true,
|
|
177
|
+
padding: 'auto'
|
|
178
|
+
});
|
|
179
|
+
var config = defaultConfig(props);
|
|
180
|
+
chart.options(config);
|
|
181
|
+
chart.render();
|
|
182
|
+
chartRef.current = chart;
|
|
183
|
+
return function () {
|
|
184
|
+
chart.destroy();
|
|
185
|
+
chartRef.current = null;
|
|
186
|
+
};
|
|
187
|
+
}, [props]);
|
|
188
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
189
|
+
ref: containerRef
|
|
190
|
+
});
|
|
191
|
+
};
|
|
192
|
+
export default Violin;
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import type { WordCloudConfig } from '@ant-design/plots';
|
|
2
1
|
import { type FC } from 'react';
|
|
3
|
-
import type { BasePlotProps } from '../types';
|
|
2
|
+
import type { BasePlotProps, Style, Theme } from '../types';
|
|
4
3
|
type WordCloudDataItem = {
|
|
5
4
|
text: string;
|
|
6
5
|
value: number;
|
|
7
6
|
};
|
|
8
|
-
export type WordCloudProps = BasePlotProps<WordCloudDataItem> &
|
|
7
|
+
export type WordCloudProps = BasePlotProps<WordCloudDataItem> & Theme & Style;
|
|
9
8
|
declare const WordCloud: FC<WordCloudProps>;
|
|
10
9
|
export default WordCloud;
|