@antv/gpt-vis 0.5.10 → 0.5.11
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 -1
- package/dist/cjs/Boxplot/index.d.ts +2 -4
- package/dist/cjs/Boxplot/index.js +2 -2
- package/dist/cjs/Column/index.d.ts +2 -1
- package/dist/cjs/DualAxes/index.d.ts +5 -0
- package/dist/cjs/DualAxes/index.js +3 -2
- package/dist/cjs/DualAxes/util.d.ts +1 -1
- package/dist/cjs/DualAxes/util.js +2 -1
- package/dist/cjs/Funnel/index.js +2 -2
- package/dist/cjs/Histogram/index.d.ts +1 -0
- package/dist/cjs/Line/index.d.ts +2 -1
- package/dist/cjs/Line/index.js +3 -2
- package/dist/cjs/Scatter/index.d.ts +4 -1
- package/dist/cjs/Violin/index.js +11 -6
- package/dist/cjs/Waterfall/index.d.ts +22 -0
- package/dist/cjs/Waterfall/index.js +194 -0
- package/dist/cjs/export.d.ts +3 -1
- package/dist/cjs/export.js +4 -0
- package/dist/cjs/types/chart.d.ts +2 -0
- package/dist/cjs/types/chart.js +1 -0
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/esm/Area/index.d.ts +2 -1
- package/dist/esm/Boxplot/index.d.ts +2 -4
- package/dist/esm/Boxplot/index.js +5 -2
- package/dist/esm/Column/index.d.ts +2 -1
- package/dist/esm/DualAxes/index.d.ts +5 -0
- package/dist/esm/DualAxes/index.js +6 -2
- package/dist/esm/DualAxes/util.d.ts +1 -1
- package/dist/esm/DualAxes/util.js +7 -0
- package/dist/esm/Funnel/index.js +2 -2
- package/dist/esm/Histogram/index.d.ts +1 -0
- package/dist/esm/Line/index.d.ts +2 -1
- package/dist/esm/Line/index.js +5 -2
- package/dist/esm/Scatter/index.d.ts +4 -1
- package/dist/esm/Violin/index.js +13 -6
- package/dist/esm/Waterfall/index.d.ts +22 -0
- package/dist/esm/Waterfall/index.js +186 -0
- package/dist/esm/export.d.ts +3 -1
- package/dist/esm/export.js +3 -2
- package/dist/esm/types/chart.d.ts +2 -0
- package/dist/esm/types/chart.js +1 -0
- package/dist/esm/version.d.ts +1 -1
- package/dist/esm/version.js +1 -1
- package/dist/umd/134.async.js +1 -0
- package/dist/umd/index.min.js +1 -1
- package/package.json +1 -1
- package/dist/cjs/Pie/index.text.d.ts +0 -0
- package/dist/cjs/Pie/index.text.js +0 -0
- package/dist/esm/Pie/index.text.d.ts +0 -0
- package/dist/esm/Pie/index.text.js +0 -0
- package/dist/umd/208.async.js +0 -1
package/dist/cjs/Area/index.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { AreaConfig } from '@ant-design/plots';
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
4
|
type AreaDataItem = {
|
|
@@ -5,6 +6,6 @@ type AreaDataItem = {
|
|
|
5
6
|
value: number;
|
|
6
7
|
[key: string]: string | number;
|
|
7
8
|
};
|
|
8
|
-
export type AreaProps = BasePlotProps<AreaDataItem> & Theme & Style;
|
|
9
|
+
export type AreaProps = BasePlotProps<AreaDataItem> & Partial<AreaConfig> & Theme & Style;
|
|
9
10
|
declare const Area: (props: AreaProps) => React.JSX.Element;
|
|
10
11
|
export default Area;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { BoxConfig } from '@ant-design/plots';
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
4
|
type BoxplotDatum = {
|
|
@@ -5,9 +6,6 @@ type BoxplotDatum = {
|
|
|
5
6
|
value: number;
|
|
6
7
|
group?: string;
|
|
7
8
|
};
|
|
8
|
-
export type BoxplotProps = BasePlotProps<BoxplotDatum> &
|
|
9
|
-
xField?: string;
|
|
10
|
-
yField?: string;
|
|
11
|
-
};
|
|
9
|
+
export type BoxplotProps = BasePlotProps<BoxplotDatum> & Partial<BoxConfig> & Theme & Style;
|
|
12
10
|
declare const Boxplot: (props: BoxplotProps) => React.JSX.Element;
|
|
13
11
|
export default Boxplot;
|
|
@@ -39,7 +39,7 @@ var import_theme = require("../theme");
|
|
|
39
39
|
var defaultConfig = (props) => {
|
|
40
40
|
var _a;
|
|
41
41
|
const { data, style = {}, axisYTitle, axisXTitle, xField = "category", yField = "value" } = props;
|
|
42
|
-
const { backgroundColor, palette } = style;
|
|
42
|
+
const { backgroundColor, palette, startAtZero = false } = style;
|
|
43
43
|
const hasGroupField = ((_a = (data || [])[0]) == null ? void 0 : _a.group) !== void 0;
|
|
44
44
|
let paletteConfig = { color: void 0 };
|
|
45
45
|
const hasPalette = !!(palette == null ? void 0 : palette[0]);
|
|
@@ -70,7 +70,7 @@ var defaultConfig = (props) => {
|
|
|
70
70
|
scale: {
|
|
71
71
|
x: { paddingInner: 0.6, paddingOuter: 0.3 },
|
|
72
72
|
series: { paddingInner: 0.3, paddingOuter: 0.1 },
|
|
73
|
-
y: { nice: true },
|
|
73
|
+
y: { nice: true, zero: startAtZero },
|
|
74
74
|
...paletteConfig
|
|
75
75
|
},
|
|
76
76
|
style: { stroke: "black" },
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { ColumnConfig } from '@ant-design/plots';
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
4
|
export type ColumnDataItem = {
|
|
@@ -5,7 +6,7 @@ export type ColumnDataItem = {
|
|
|
5
6
|
value: number;
|
|
6
7
|
[key: string]: string | number;
|
|
7
8
|
};
|
|
8
|
-
export type ColumnProps = BasePlotProps<ColumnDataItem> & Theme & Style & {
|
|
9
|
+
export type ColumnProps = BasePlotProps<ColumnDataItem> & Partial<ColumnConfig> & Theme & Style & {
|
|
9
10
|
group?: boolean;
|
|
10
11
|
stack?: boolean;
|
|
11
12
|
};
|
|
@@ -5,6 +5,11 @@ export type DualAxesProps = Partial<DualAxesConfig> & {
|
|
|
5
5
|
axisXTitle?: string;
|
|
6
6
|
series: DualAxesSeriesItem[];
|
|
7
7
|
legendTypeList?: string[];
|
|
8
|
+
style?: {
|
|
9
|
+
palette?: string[];
|
|
10
|
+
backgroundColor?: string;
|
|
11
|
+
startAtZero?: boolean;
|
|
12
|
+
};
|
|
8
13
|
};
|
|
9
14
|
export type DualAxesSeriesItem = {
|
|
10
15
|
type: string;
|
|
@@ -70,9 +70,10 @@ var defaultConfig = (props) => {
|
|
|
70
70
|
};
|
|
71
71
|
};
|
|
72
72
|
var DualAxes = (props) => {
|
|
73
|
-
const { categories, series, theme = "default", ...others } = props;
|
|
73
|
+
const { categories, series, theme = "default", style = {}, ...others } = props;
|
|
74
|
+
const { startAtZero = false } = style;
|
|
74
75
|
const themeConfig = import_theme.THEME_MAP[theme];
|
|
75
|
-
const transformData = (0, import_react.useMemo)(() => (0, import_util.transform)(series, categories), [props]);
|
|
76
|
+
const transformData = (0, import_react.useMemo)(() => (0, import_util.transform)(series, categories, startAtZero), [props]);
|
|
76
77
|
const config = (0, import_hooks.usePlotConfig)("DualAxes", defaultConfig, {
|
|
77
78
|
...others,
|
|
78
79
|
...transformData,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { DualAxesSeriesItem } from '.';
|
|
2
|
-
export declare function transform(series: DualAxesSeriesItem[], categories: string[]): {
|
|
2
|
+
export declare function transform(series: DualAxesSeriesItem[], categories: string[], startAtZero?: boolean): {
|
|
3
3
|
children: any[];
|
|
4
4
|
data: {
|
|
5
5
|
[key: string]: any;
|
|
@@ -23,7 +23,7 @@ __export(util_exports, {
|
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(util_exports);
|
|
25
25
|
var import_types = require("../types");
|
|
26
|
-
function transform(series, categories) {
|
|
26
|
+
function transform(series, categories, startAtZero = false) {
|
|
27
27
|
const newChildren = series.sort((a, b) => {
|
|
28
28
|
const ORDER = ["column", "line"];
|
|
29
29
|
return ORDER.indexOf(a.type) - ORDER.indexOf(b.type);
|
|
@@ -34,6 +34,7 @@ function transform(series, categories) {
|
|
|
34
34
|
...others,
|
|
35
35
|
yField: defaultYField,
|
|
36
36
|
axis: { y: { title: axisYTitle } },
|
|
37
|
+
scale: { y: { nice: true, zero: startAtZero } },
|
|
37
38
|
// data放在最外层
|
|
38
39
|
data: void 0
|
|
39
40
|
};
|
package/dist/cjs/Funnel/index.js
CHANGED
|
@@ -2,6 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
3
|
export type HistogramProps = BasePlotProps<number> & Theme & Style & {
|
|
4
4
|
binNumber: number;
|
|
5
|
+
binField?: (d: number) => number;
|
|
5
6
|
};
|
|
6
7
|
declare const Histogram: (props: HistogramProps) => React.JSX.Element;
|
|
7
8
|
export default Histogram;
|
package/dist/cjs/Line/index.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { LineConfig } from '@ant-design/plots';
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
4
|
export type LineDataItem = {
|
|
@@ -5,6 +6,6 @@ export type LineDataItem = {
|
|
|
5
6
|
value: number;
|
|
6
7
|
[key: string]: string | number;
|
|
7
8
|
};
|
|
8
|
-
export type LineProps = BasePlotProps<LineDataItem> & Theme & Style;
|
|
9
|
+
export type LineProps = BasePlotProps<LineDataItem> & Partial<LineConfig> & Theme & Style;
|
|
9
10
|
declare const Line: (props: LineProps) => React.JSX.Element;
|
|
10
11
|
export default Line;
|
package/dist/cjs/Line/index.js
CHANGED
|
@@ -39,7 +39,7 @@ var import_hooks = require("../ConfigProvider/hooks");
|
|
|
39
39
|
var import_theme = require("../theme");
|
|
40
40
|
var defaultConfig = (props) => {
|
|
41
41
|
const { data, xField = "time", yField = "value", style = {} } = props;
|
|
42
|
-
const { palette, lineWidth, backgroundColor } = style;
|
|
42
|
+
const { palette, lineWidth, backgroundColor, startAtZero = false } = style;
|
|
43
43
|
const hasGroupField = (0, import_lodash.get)(data, "[0].group") !== void 0;
|
|
44
44
|
const axisYTitle = (0, import_lodash.get)(props, "axis.y.title");
|
|
45
45
|
const hasPalette = !!(palette == null ? void 0 : palette[0]);
|
|
@@ -72,7 +72,8 @@ var defaultConfig = (props) => {
|
|
|
72
72
|
},
|
|
73
73
|
scale: {
|
|
74
74
|
y: {
|
|
75
|
-
nice: true
|
|
75
|
+
nice: true,
|
|
76
|
+
zero: startAtZero
|
|
76
77
|
},
|
|
77
78
|
...paletteConfig
|
|
78
79
|
},
|
|
@@ -5,6 +5,9 @@ type ScatterDataItem = {
|
|
|
5
5
|
y: number;
|
|
6
6
|
[key: string]: string | number;
|
|
7
7
|
};
|
|
8
|
-
export type ScatterProps = BasePlotProps<ScatterDataItem> & Theme & Style
|
|
8
|
+
export type ScatterProps = BasePlotProps<ScatterDataItem> & Theme & Style & {
|
|
9
|
+
xField?: string;
|
|
10
|
+
yField?: string;
|
|
11
|
+
};
|
|
9
12
|
declare const Scatter: (props: ScatterProps) => React.JSX.Element;
|
|
10
13
|
export default Scatter;
|
package/dist/cjs/Violin/index.js
CHANGED
|
@@ -38,7 +38,7 @@ var import_theme = require("../theme");
|
|
|
38
38
|
var defaultConfig = (props) => {
|
|
39
39
|
var _a;
|
|
40
40
|
const { data, title, axisYTitle, axisXTitle, theme = "default", style = {} } = props;
|
|
41
|
-
const { backgroundColor, palette } = style;
|
|
41
|
+
const { backgroundColor, palette, startAtZero = false } = style;
|
|
42
42
|
const hasGroupField = ((_a = (data || [])[0]) == null ? void 0 : _a.group) !== void 0;
|
|
43
43
|
let encode = {};
|
|
44
44
|
let children = [];
|
|
@@ -59,7 +59,8 @@ var defaultConfig = (props) => {
|
|
|
59
59
|
encode,
|
|
60
60
|
scale: {
|
|
61
61
|
y: {
|
|
62
|
-
nice: true
|
|
62
|
+
nice: true,
|
|
63
|
+
zero: startAtZero
|
|
63
64
|
},
|
|
64
65
|
...(palette == null ? void 0 : palette[0]) ? {
|
|
65
66
|
color: {
|
|
@@ -82,7 +83,8 @@ var defaultConfig = (props) => {
|
|
|
82
83
|
...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {},
|
|
83
84
|
scale: {
|
|
84
85
|
y: {
|
|
85
|
-
nice: true
|
|
86
|
+
nice: true,
|
|
87
|
+
zero: startAtZero
|
|
86
88
|
},
|
|
87
89
|
...(palette == null ? void 0 : palette[0]) ? {
|
|
88
90
|
color: {
|
|
@@ -108,7 +110,8 @@ var defaultConfig = (props) => {
|
|
|
108
110
|
encode,
|
|
109
111
|
scale: {
|
|
110
112
|
y: {
|
|
111
|
-
nice: true
|
|
113
|
+
nice: true,
|
|
114
|
+
zero: startAtZero
|
|
112
115
|
}
|
|
113
116
|
},
|
|
114
117
|
...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {},
|
|
@@ -126,7 +129,8 @@ var defaultConfig = (props) => {
|
|
|
126
129
|
...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {},
|
|
127
130
|
scale: {
|
|
128
131
|
y: {
|
|
129
|
-
nice: true
|
|
132
|
+
nice: true,
|
|
133
|
+
zero: startAtZero
|
|
130
134
|
},
|
|
131
135
|
...(palette == null ? void 0 : palette[0]) ? {
|
|
132
136
|
color: {
|
|
@@ -154,7 +158,8 @@ var defaultConfig = (props) => {
|
|
|
154
158
|
children,
|
|
155
159
|
scale: {
|
|
156
160
|
y: {
|
|
157
|
-
nice: true
|
|
161
|
+
nice: true,
|
|
162
|
+
zero: startAtZero
|
|
158
163
|
}
|
|
159
164
|
},
|
|
160
165
|
...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
|
+
type WaterfallDataItem = {
|
|
4
|
+
category: string;
|
|
5
|
+
value?: number;
|
|
6
|
+
isTotal?: boolean;
|
|
7
|
+
isIntermediateTotal?: boolean;
|
|
8
|
+
[key: string]: string | number | boolean | undefined;
|
|
9
|
+
};
|
|
10
|
+
type WaterfallStyle = {
|
|
11
|
+
backgroundColor?: string;
|
|
12
|
+
} & Style;
|
|
13
|
+
export type WaterfallProps = BasePlotProps<WaterfallDataItem> & Theme & {
|
|
14
|
+
style?: WaterfallStyle;
|
|
15
|
+
positiveColor?: string;
|
|
16
|
+
negativeColor?: string;
|
|
17
|
+
totalColor?: string;
|
|
18
|
+
axisXTitle?: string;
|
|
19
|
+
axisYTitle?: string;
|
|
20
|
+
};
|
|
21
|
+
declare const Waterfall: (props: WaterfallProps) => React.JSX.Element;
|
|
22
|
+
export default Waterfall;
|
|
@@ -0,0 +1,194 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
25
|
+
mod
|
|
26
|
+
));
|
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
28
|
+
|
|
29
|
+
// src/Waterfall/index.tsx
|
|
30
|
+
var Waterfall_exports = {};
|
|
31
|
+
__export(Waterfall_exports, {
|
|
32
|
+
default: () => Waterfall_default
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(Waterfall_exports);
|
|
35
|
+
var import_g2 = require("@antv/g2");
|
|
36
|
+
var import_react = __toESM(require("react"));
|
|
37
|
+
var import_theme = require("../theme");
|
|
38
|
+
var DEFAULT_POSITIVE_COLOR = "#FF4D4F";
|
|
39
|
+
var DEFAULT_NEGATIVE_COLOR = "#2EBB59";
|
|
40
|
+
var DEFAULT_TOTAL_COLOR = "#1783FF";
|
|
41
|
+
function transformWaterfallData(data) {
|
|
42
|
+
let cumulative = 0;
|
|
43
|
+
let lastIntermediateTotalEnd = 0;
|
|
44
|
+
let totalSum = 0;
|
|
45
|
+
return data.map((item) => {
|
|
46
|
+
const value = item.value || 0;
|
|
47
|
+
let start;
|
|
48
|
+
let end;
|
|
49
|
+
if (item.isTotal) {
|
|
50
|
+
start = 0;
|
|
51
|
+
end = totalSum;
|
|
52
|
+
} else if (item.isIntermediateTotal) {
|
|
53
|
+
start = lastIntermediateTotalEnd;
|
|
54
|
+
end = cumulative;
|
|
55
|
+
lastIntermediateTotalEnd = end;
|
|
56
|
+
} else {
|
|
57
|
+
start = cumulative;
|
|
58
|
+
end = cumulative + value;
|
|
59
|
+
cumulative = end;
|
|
60
|
+
totalSum += value;
|
|
61
|
+
}
|
|
62
|
+
return {
|
|
63
|
+
...item,
|
|
64
|
+
__start__: start,
|
|
65
|
+
__end__: end,
|
|
66
|
+
__value__: item.isTotal ? totalSum : item.isIntermediateTotal ? end - start : value
|
|
67
|
+
};
|
|
68
|
+
});
|
|
69
|
+
}
|
|
70
|
+
function generateLinkData(data) {
|
|
71
|
+
return data.reduce((result, current, index) => {
|
|
72
|
+
if (index > 0) {
|
|
73
|
+
const previous = data[index - 1];
|
|
74
|
+
result.push({
|
|
75
|
+
x: [previous.category, current.category],
|
|
76
|
+
y: current.isTotal || current.isIntermediateTotal ? current.__end__ : current.__start__
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
return result;
|
|
80
|
+
}, []);
|
|
81
|
+
}
|
|
82
|
+
var defaultConfig = (props) => {
|
|
83
|
+
const {
|
|
84
|
+
data = [],
|
|
85
|
+
title,
|
|
86
|
+
style = {},
|
|
87
|
+
positiveColor: customPositiveColor,
|
|
88
|
+
negativeColor: customNegativeColor,
|
|
89
|
+
totalColor: customTotalColor,
|
|
90
|
+
axisXTitle,
|
|
91
|
+
axisYTitle,
|
|
92
|
+
theme = "default"
|
|
93
|
+
} = props;
|
|
94
|
+
const { backgroundColor } = style;
|
|
95
|
+
const positiveColor = customPositiveColor || DEFAULT_POSITIVE_COLOR;
|
|
96
|
+
const negativeColor = customNegativeColor || DEFAULT_NEGATIVE_COLOR;
|
|
97
|
+
const totalColor = customTotalColor || DEFAULT_TOTAL_COLOR;
|
|
98
|
+
const transformedData = transformWaterfallData(data);
|
|
99
|
+
const linkData = generateLinkData(transformedData);
|
|
100
|
+
return {
|
|
101
|
+
type: "view",
|
|
102
|
+
theme: import_theme.THEME_MAP[theme],
|
|
103
|
+
title,
|
|
104
|
+
data: transformedData,
|
|
105
|
+
axis: {
|
|
106
|
+
y: {
|
|
107
|
+
labelFormatter: "~s",
|
|
108
|
+
title: axisYTitle || false
|
|
109
|
+
},
|
|
110
|
+
x: {
|
|
111
|
+
title: axisXTitle || false
|
|
112
|
+
}
|
|
113
|
+
},
|
|
114
|
+
children: [
|
|
115
|
+
{
|
|
116
|
+
type: "interval",
|
|
117
|
+
data: transformedData,
|
|
118
|
+
encode: { x: "category", y: ["__start__", "__end__"], color: "category" },
|
|
119
|
+
style: {
|
|
120
|
+
maxWidth: 60,
|
|
121
|
+
stroke: "#666",
|
|
122
|
+
radius: 4,
|
|
123
|
+
fill: (d) => {
|
|
124
|
+
return d.isTotal || d.isIntermediateTotal ? totalColor : d.__value__ > 0 ? positiveColor : negativeColor;
|
|
125
|
+
}
|
|
126
|
+
},
|
|
127
|
+
labels: [
|
|
128
|
+
{
|
|
129
|
+
text: "__value__",
|
|
130
|
+
position: "inside",
|
|
131
|
+
fontSize: 10,
|
|
132
|
+
transform: [{ type: "overflowHide" }],
|
|
133
|
+
formatter: "~s",
|
|
134
|
+
fill: "#000",
|
|
135
|
+
fontWeight: 600,
|
|
136
|
+
stroke: "#fff"
|
|
137
|
+
}
|
|
138
|
+
],
|
|
139
|
+
tooltip: (d) => {
|
|
140
|
+
const tooltipName = axisYTitle || d["category"];
|
|
141
|
+
return {
|
|
142
|
+
name: tooltipName,
|
|
143
|
+
value: d["__value__"]
|
|
144
|
+
};
|
|
145
|
+
}
|
|
146
|
+
},
|
|
147
|
+
{
|
|
148
|
+
type: "link",
|
|
149
|
+
data: linkData,
|
|
150
|
+
encode: {
|
|
151
|
+
x: "x",
|
|
152
|
+
y: "y"
|
|
153
|
+
},
|
|
154
|
+
zIndex: -1,
|
|
155
|
+
style: {
|
|
156
|
+
stroke: "#ccc",
|
|
157
|
+
lineDash: [4, 2],
|
|
158
|
+
lineWidth: 1
|
|
159
|
+
},
|
|
160
|
+
tooltip: false
|
|
161
|
+
}
|
|
162
|
+
],
|
|
163
|
+
scale: {
|
|
164
|
+
y: {
|
|
165
|
+
nice: true
|
|
166
|
+
}
|
|
167
|
+
},
|
|
168
|
+
legend: false,
|
|
169
|
+
...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {}
|
|
170
|
+
};
|
|
171
|
+
};
|
|
172
|
+
var Waterfall = (props) => {
|
|
173
|
+
const containerRef = (0, import_react.useRef)(null);
|
|
174
|
+
const chartRef = (0, import_react.useRef)(null);
|
|
175
|
+
(0, import_react.useEffect)(() => {
|
|
176
|
+
if (!containerRef.current)
|
|
177
|
+
return;
|
|
178
|
+
const chart = new import_g2.Chart({
|
|
179
|
+
container: containerRef.current,
|
|
180
|
+
autoFit: true,
|
|
181
|
+
padding: "auto"
|
|
182
|
+
});
|
|
183
|
+
const config = defaultConfig(props);
|
|
184
|
+
chart.options(config);
|
|
185
|
+
chart.render();
|
|
186
|
+
chartRef.current = chart;
|
|
187
|
+
return () => {
|
|
188
|
+
chart.destroy();
|
|
189
|
+
chartRef.current = null;
|
|
190
|
+
};
|
|
191
|
+
}, [props]);
|
|
192
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { ref: containerRef });
|
|
193
|
+
};
|
|
194
|
+
var Waterfall_default = Waterfall;
|
package/dist/cjs/export.d.ts
CHANGED
|
@@ -17,6 +17,7 @@ import { default as Scatter, type ScatterProps } from './Scatter';
|
|
|
17
17
|
import { default as Treemap, type TreemapProps } from './Treemap';
|
|
18
18
|
import { default as Venn, type VennProps } from './Venn';
|
|
19
19
|
import { default as Violin, type ViolinProps } from './Violin';
|
|
20
|
+
import { default as Waterfall, type WaterfallProps } from './Waterfall';
|
|
20
21
|
import { default as WordCloud, type WordCloudProps } from './WordCloud';
|
|
21
22
|
/********** graph chart **********/
|
|
22
23
|
import { default as FishboneDiagram, type FishboneDiagramProps } from './FishboneDiagram';
|
|
@@ -31,7 +32,7 @@ import { PinMap, type PinMapProps, HeatMap, type HeatMapProps, PathMap, type Pat
|
|
|
31
32
|
/********** NTV **********/
|
|
32
33
|
import { default as Table, type TableProps } from './Table';
|
|
33
34
|
export { VisText, type VisTextProps } from './Text';
|
|
34
|
-
export { Area, Bar, Boxplot, Column, DualAxes, FishboneDiagram, FlowDiagram, Funnel, HeatMap, Histogram, IndentedTree, Line, Liquid, MindMap, NetworkGraph, OrganizationChart, PathMap, Pie, PinMap, Radar, Sankey, Scatter, Treemap, Venn, Violin, Table, WordCloud, type AreaProps, type BarProps, type BoxplotProps, type ColumnProps, type DualAxesProps, type FishboneDiagramProps, type FlowDiagramProps, type FunnelProps, type HeatMapProps, type HistogramProps, type IndentedTreeProps, type LineProps, type LiquidProps, type MindMapProps, type NetworkGraphProps, type OrganizationChartProps, type PathMapProps, type PieProps, type PinMapProps, type RadarProps, type SankeyProps, type ScatterProps, type TreemapProps, type VennProps, type ViolinProps, type TableProps, type WordCloudProps, };
|
|
35
|
+
export { Area, Bar, Boxplot, Column, DualAxes, FishboneDiagram, FlowDiagram, Funnel, HeatMap, Histogram, IndentedTree, Line, Liquid, MindMap, NetworkGraph, OrganizationChart, PathMap, Pie, PinMap, Radar, Sankey, Scatter, Treemap, Venn, Violin, Waterfall, Table, WordCloud, type AreaProps, type BarProps, type BoxplotProps, type ColumnProps, type DualAxesProps, type FishboneDiagramProps, type FlowDiagramProps, type FunnelProps, type HeatMapProps, type HistogramProps, type IndentedTreeProps, type LineProps, type LiquidProps, type MindMapProps, type NetworkGraphProps, type OrganizationChartProps, type PathMapProps, type PieProps, type PinMapProps, type RadarProps, type SankeyProps, type ScatterProps, type TreemapProps, type VennProps, type ViolinProps, type WaterfallProps, type TableProps, type WordCloudProps, };
|
|
35
36
|
export type VisOptionMap = {
|
|
36
37
|
[ChartType.Area]: AreaProps;
|
|
37
38
|
[ChartType.Bar]: BarProps;
|
|
@@ -59,6 +60,7 @@ export type VisOptionMap = {
|
|
|
59
60
|
[ChartType.Treemap]: TreemapProps;
|
|
60
61
|
[ChartType.Venn]: VennProps;
|
|
61
62
|
[ChartType.Violin]: ViolinProps;
|
|
63
|
+
[ChartType.Waterfall]: WaterfallProps;
|
|
62
64
|
[ChartType.WordCloud]: WordCloudProps;
|
|
63
65
|
};
|
|
64
66
|
/**
|
package/dist/cjs/export.js
CHANGED
|
@@ -58,6 +58,7 @@ __export(export_exports, {
|
|
|
58
58
|
Venn: () => import_Venn.default,
|
|
59
59
|
Violin: () => import_Violin.default,
|
|
60
60
|
VisText: () => import_Text.VisText,
|
|
61
|
+
Waterfall: () => import_Waterfall.default,
|
|
61
62
|
WordCloud: () => import_WordCloud.default
|
|
62
63
|
});
|
|
63
64
|
module.exports = __toCommonJS(export_exports);
|
|
@@ -78,6 +79,7 @@ var import_Scatter = __toESM(require("./Scatter"));
|
|
|
78
79
|
var import_Treemap = __toESM(require("./Treemap"));
|
|
79
80
|
var import_Venn = __toESM(require("./Venn"));
|
|
80
81
|
var import_Violin = __toESM(require("./Violin"));
|
|
82
|
+
var import_Waterfall = __toESM(require("./Waterfall"));
|
|
81
83
|
var import_WordCloud = __toESM(require("./WordCloud"));
|
|
82
84
|
var import_FishboneDiagram = __toESM(require("./FishboneDiagram"));
|
|
83
85
|
var import_FlowDiagram = __toESM(require("./FlowDiagram"));
|
|
@@ -113,6 +115,7 @@ var DEFAULT_CHART_COMPONENTS = {
|
|
|
113
115
|
[import_types.ChartType.Treemap]: import_Treemap.default,
|
|
114
116
|
[import_types.ChartType.Venn]: import_Venn.default,
|
|
115
117
|
[import_types.ChartType.Violin]: import_Violin.default,
|
|
118
|
+
[import_types.ChartType.Waterfall]: import_Waterfall.default,
|
|
116
119
|
[import_types.ChartType.Table]: import_Table.default,
|
|
117
120
|
[import_types.ChartType.WordCloud]: import_WordCloud.default,
|
|
118
121
|
[import_types.ChartType.OrganizationChart]: import_OrganizationChart.default
|
|
@@ -148,5 +151,6 @@ var DEFAULT_CHART_COMPONENTS = {
|
|
|
148
151
|
Venn,
|
|
149
152
|
Violin,
|
|
150
153
|
VisText,
|
|
154
|
+
Waterfall,
|
|
151
155
|
WordCloud
|
|
152
156
|
});
|
|
@@ -28,6 +28,7 @@ export declare enum ChartType {
|
|
|
28
28
|
Treemap = "treemap",
|
|
29
29
|
Venn = "venn",
|
|
30
30
|
Violin = "violin",
|
|
31
|
+
Waterfall = "waterfall",
|
|
31
32
|
Table = "table",
|
|
32
33
|
VisText = "vis-text",
|
|
33
34
|
WordCloud = "word-cloud"
|
|
@@ -81,5 +82,6 @@ export interface Style {
|
|
|
81
82
|
lineWidth?: number;
|
|
82
83
|
backgroundColor?: string;
|
|
83
84
|
palette?: string[];
|
|
85
|
+
startAtZero?: boolean;
|
|
84
86
|
};
|
|
85
87
|
}
|
package/dist/cjs/types/chart.js
CHANGED
|
@@ -48,6 +48,7 @@ var ChartType = /* @__PURE__ */ ((ChartType2) => {
|
|
|
48
48
|
ChartType2["Treemap"] = "treemap";
|
|
49
49
|
ChartType2["Venn"] = "venn";
|
|
50
50
|
ChartType2["Violin"] = "violin";
|
|
51
|
+
ChartType2["Waterfall"] = "waterfall";
|
|
51
52
|
ChartType2["Table"] = "table";
|
|
52
53
|
ChartType2["VisText"] = "vis-text";
|
|
53
54
|
ChartType2["WordCloud"] = "word-cloud";
|
package/dist/cjs/version.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: "0.5.
|
|
1
|
+
declare const _default: "0.5.11";
|
|
2
2
|
export default _default;
|
package/dist/cjs/version.js
CHANGED
package/dist/esm/Area/index.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { AreaConfig } from '@ant-design/plots';
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
4
|
type AreaDataItem = {
|
|
@@ -5,6 +6,6 @@ type AreaDataItem = {
|
|
|
5
6
|
value: number;
|
|
6
7
|
[key: string]: string | number;
|
|
7
8
|
};
|
|
8
|
-
export type AreaProps = BasePlotProps<AreaDataItem> & Theme & Style;
|
|
9
|
+
export type AreaProps = BasePlotProps<AreaDataItem> & Partial<AreaConfig> & Theme & Style;
|
|
9
10
|
declare const Area: (props: AreaProps) => React.JSX.Element;
|
|
10
11
|
export default Area;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { BoxConfig } from '@ant-design/plots';
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
4
|
type BoxplotDatum = {
|
|
@@ -5,9 +6,6 @@ type BoxplotDatum = {
|
|
|
5
6
|
value: number;
|
|
6
7
|
group?: string;
|
|
7
8
|
};
|
|
8
|
-
export type BoxplotProps = BasePlotProps<BoxplotDatum> &
|
|
9
|
-
xField?: string;
|
|
10
|
-
yField?: string;
|
|
11
|
-
};
|
|
9
|
+
export type BoxplotProps = BasePlotProps<BoxplotDatum> & Partial<BoxConfig> & Theme & Style;
|
|
12
10
|
declare const Boxplot: (props: BoxplotProps) => React.JSX.Element;
|
|
13
11
|
export default Boxplot;
|
|
@@ -20,7 +20,9 @@ var defaultConfig = function defaultConfig(props) {
|
|
|
20
20
|
_props$yField = props.yField,
|
|
21
21
|
yField = _props$yField === void 0 ? 'value' : _props$yField;
|
|
22
22
|
var backgroundColor = style.backgroundColor,
|
|
23
|
-
palette = style.palette
|
|
23
|
+
palette = style.palette,
|
|
24
|
+
_style$startAtZero = style.startAtZero,
|
|
25
|
+
startAtZero = _style$startAtZero === void 0 ? false : _style$startAtZero;
|
|
24
26
|
var hasGroupField = ((_ = (data || [])[0]) === null || _ === void 0 ? void 0 : _.group) !== undefined;
|
|
25
27
|
var paletteConfig = {
|
|
26
28
|
color: undefined
|
|
@@ -60,7 +62,8 @@ var defaultConfig = function defaultConfig(props) {
|
|
|
60
62
|
paddingOuter: 0.1
|
|
61
63
|
},
|
|
62
64
|
y: {
|
|
63
|
-
nice: true
|
|
65
|
+
nice: true,
|
|
66
|
+
zero: startAtZero
|
|
64
67
|
}
|
|
65
68
|
}, paletteConfig),
|
|
66
69
|
style: {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { ColumnConfig } from '@ant-design/plots';
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import type { BasePlotProps, Style, Theme } from '../types';
|
|
3
4
|
export type ColumnDataItem = {
|
|
@@ -5,7 +6,7 @@ export type ColumnDataItem = {
|
|
|
5
6
|
value: number;
|
|
6
7
|
[key: string]: string | number;
|
|
7
8
|
};
|
|
8
|
-
export type ColumnProps = BasePlotProps<ColumnDataItem> & Theme & Style & {
|
|
9
|
+
export type ColumnProps = BasePlotProps<ColumnDataItem> & Partial<ColumnConfig> & Theme & Style & {
|
|
9
10
|
group?: boolean;
|
|
10
11
|
stack?: boolean;
|
|
11
12
|
};
|
|
@@ -5,6 +5,11 @@ export type DualAxesProps = Partial<DualAxesConfig> & {
|
|
|
5
5
|
axisXTitle?: string;
|
|
6
6
|
series: DualAxesSeriesItem[];
|
|
7
7
|
legendTypeList?: string[];
|
|
8
|
+
style?: {
|
|
9
|
+
palette?: string[];
|
|
10
|
+
backgroundColor?: string;
|
|
11
|
+
startAtZero?: boolean;
|
|
12
|
+
};
|
|
8
13
|
};
|
|
9
14
|
export type DualAxesSeriesItem = {
|
|
10
15
|
type: string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var _excluded = ["categories", "series", "theme"];
|
|
1
|
+
var _excluded = ["categories", "series", "theme", "style"];
|
|
2
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); }
|
|
3
3
|
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
4
|
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; }
|
|
@@ -60,10 +60,14 @@ var DualAxes = function DualAxes(props) {
|
|
|
60
60
|
series = props.series,
|
|
61
61
|
_props$theme = props.theme,
|
|
62
62
|
theme = _props$theme === void 0 ? 'default' : _props$theme,
|
|
63
|
+
_props$style2 = props.style,
|
|
64
|
+
style = _props$style2 === void 0 ? {} : _props$style2,
|
|
63
65
|
others = _objectWithoutProperties(props, _excluded);
|
|
66
|
+
var _style$startAtZero = style.startAtZero,
|
|
67
|
+
startAtZero = _style$startAtZero === void 0 ? false : _style$startAtZero;
|
|
64
68
|
var themeConfig = THEME_MAP[theme];
|
|
65
69
|
var transformData = useMemo(function () {
|
|
66
|
-
return transform(series, categories);
|
|
70
|
+
return transform(series, categories, startAtZero);
|
|
67
71
|
}, [props]);
|
|
68
72
|
var config = usePlotConfig('DualAxes', defaultConfig, _objectSpread(_objectSpread(_objectSpread({}, others), transformData), {}, {
|
|
69
73
|
theme: themeConfig
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { DualAxesSeriesItem } from '.';
|
|
2
|
-
export declare function transform(series: DualAxesSeriesItem[], categories: string[]): {
|
|
2
|
+
export declare function transform(series: DualAxesSeriesItem[], categories: string[], startAtZero?: boolean): {
|
|
3
3
|
children: any[];
|
|
4
4
|
data: {
|
|
5
5
|
[key: string]: any;
|