@antv/gpt-vis 0.2.0 → 0.2.1
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/README.md +22 -4
- package/README.zh-CN.md +20 -4
- package/dist/cjs/FishboneDiagram/index.d.ts +6 -0
- package/dist/cjs/FishboneDiagram/index.js +49 -0
- package/dist/cjs/Text/VisText.js +4 -1
- package/dist/cjs/Text/config.js +14 -14
- package/dist/cjs/Text/mini-charts/hooks/getElementFontSize.js +2 -2
- package/dist/cjs/Text/mini-charts/hooks/useSvgWrapper.js +3 -3
- package/dist/cjs/Text/mini-charts/line/SingleLineChart.js +2 -2
- package/dist/cjs/Text/mini-charts/line/useLineCompute.js +2 -2
- package/dist/cjs/Text/mini-charts/proportion/index.js +2 -3
- package/dist/cjs/Text/theme.d.ts +24 -0
- package/dist/cjs/Text/{constants.js → theme.js} +25 -10
- package/dist/cjs/Text/utils/getThemeColor.d.ts +11 -0
- package/dist/cjs/Text/utils/getThemeColor.js +46 -0
- package/dist/cjs/Text/utils/index.d.ts +2 -0
- package/dist/cjs/Text/utils/index.js +25 -0
- package/dist/cjs/Text/utils/useAntdDarkAlgorithm.d.ts +2 -0
- package/dist/cjs/Text/utils/useAntdDarkAlgorithm.js +40 -0
- package/dist/cjs/export.d.ts +5 -4
- package/dist/cjs/export.js +9 -5
- package/dist/cjs/types/chart.d.ts +3 -2
- package/dist/cjs/types/chart.js +3 -2
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/esm/FishboneDiagram/index.d.ts +6 -0
- package/dist/esm/FishboneDiagram/index.js +23 -0
- package/dist/esm/Text/VisText.js +9 -2
- package/dist/esm/Text/config.js +14 -14
- package/dist/esm/Text/mini-charts/hooks/getElementFontSize.js +1 -1
- package/dist/esm/Text/mini-charts/hooks/useSvgWrapper.js +1 -1
- package/dist/esm/Text/mini-charts/line/SingleLineChart.js +3 -3
- package/dist/esm/Text/mini-charts/line/useLineCompute.js +1 -1
- package/dist/esm/Text/mini-charts/proportion/index.js +4 -5
- package/dist/esm/Text/theme.d.ts +24 -0
- package/dist/esm/Text/theme.js +24 -0
- package/dist/esm/Text/utils/getThemeColor.d.ts +11 -0
- package/dist/esm/Text/utils/getThemeColor.js +29 -0
- package/dist/esm/Text/utils/index.d.ts +2 -0
- package/dist/esm/Text/utils/index.js +2 -0
- package/dist/esm/Text/utils/useAntdDarkAlgorithm.d.ts +2 -0
- package/dist/esm/Text/utils/useAntdDarkAlgorithm.js +13 -0
- package/dist/esm/export.d.ts +5 -4
- package/dist/esm/export.js +8 -6
- package/dist/esm/types/chart.d.ts +3 -2
- package/dist/esm/types/chart.js +3 -2
- package/dist/esm/version.d.ts +1 -1
- package/dist/esm/version.js +1 -1
- package/dist/umd/558.async.js +1 -0
- package/dist/umd/index.min.js +1 -1
- package/package.json +2 -2
- package/dist/cjs/Text/constants.d.ts +0 -9
- package/dist/esm/Text/constants.d.ts +0 -9
- package/dist/esm/Text/constants.js +0 -9
- package/dist/umd/895.async.js +0 -1
package/dist/cjs/export.js
CHANGED
|
@@ -34,6 +34,7 @@ __export(export_exports, {
|
|
|
34
34
|
Column: () => import_Column.default,
|
|
35
35
|
DEFAULT_CHART_COMPONENTS: () => DEFAULT_CHART_COMPONENTS,
|
|
36
36
|
DualAxes: () => import_DualAxes.default,
|
|
37
|
+
FishboneDiagram: () => import_FishboneDiagram.default,
|
|
37
38
|
FlowDiagram: () => import_FlowDiagram.default,
|
|
38
39
|
HeatMap: () => import_HeatMap.default,
|
|
39
40
|
Histogram: () => import_Histogram.default,
|
|
@@ -53,6 +54,7 @@ __export(export_exports, {
|
|
|
53
54
|
WordCloud: () => import_WordCloud.default
|
|
54
55
|
});
|
|
55
56
|
module.exports = __toCommonJS(export_exports);
|
|
57
|
+
var import_types = require("./types");
|
|
56
58
|
var import_Area = __toESM(require("./Area"));
|
|
57
59
|
var import_Bar = __toESM(require("./Bar"));
|
|
58
60
|
var import_Column = __toESM(require("./Column"));
|
|
@@ -65,15 +67,15 @@ var import_Radar = __toESM(require("./Radar"));
|
|
|
65
67
|
var import_Scatter = __toESM(require("./Scatter"));
|
|
66
68
|
var import_Treemap = __toESM(require("./Treemap"));
|
|
67
69
|
var import_WordCloud = __toESM(require("./WordCloud"));
|
|
70
|
+
var import_FishboneDiagram = __toESM(require("./FishboneDiagram"));
|
|
68
71
|
var import_FlowDiagram = __toESM(require("./FlowDiagram"));
|
|
69
72
|
var import_MindMap = __toESM(require("./MindMap"));
|
|
70
73
|
var import_NetworkGraph = __toESM(require("./NetworkGraph"));
|
|
71
|
-
var import_PathMap = __toESM(require("./PathMap"));
|
|
72
|
-
var import_PinMap = __toESM(require("./PinMap"));
|
|
73
|
-
var import_types = require("./types");
|
|
74
74
|
var import_IndentedTree = __toESM(require("./IndentedTree"));
|
|
75
|
-
var import_OrganizationChart = __toESM(require("./OrganizationChart"));
|
|
76
75
|
var import_Map = __toESM(require("./Map"));
|
|
76
|
+
var import_OrganizationChart = __toESM(require("./OrganizationChart"));
|
|
77
|
+
var import_PathMap = __toESM(require("./PathMap"));
|
|
78
|
+
var import_PinMap = __toESM(require("./PinMap"));
|
|
77
79
|
var import_Text = require("./Text");
|
|
78
80
|
var DEFAULT_CHART_COMPONENTS = {
|
|
79
81
|
[import_types.ChartType.Line]: import_Line.default,
|
|
@@ -87,7 +89,8 @@ var DEFAULT_CHART_COMPONENTS = {
|
|
|
87
89
|
[import_types.ChartType.HeatMap]: import_HeatMap.default,
|
|
88
90
|
[import_types.ChartType.MindMap]: import_MindMap.default,
|
|
89
91
|
[import_types.ChartType.FlowDiagram]: import_FlowDiagram.default,
|
|
90
|
-
[import_types.ChartType.NetworkGraph]: import_NetworkGraph.default
|
|
92
|
+
[import_types.ChartType.NetworkGraph]: import_NetworkGraph.default,
|
|
93
|
+
[import_types.ChartType.FishboneDiagram]: import_FishboneDiagram.default
|
|
91
94
|
};
|
|
92
95
|
// Annotate the CommonJS export names for ESM import in node:
|
|
93
96
|
0 && (module.exports = {
|
|
@@ -96,6 +99,7 @@ var DEFAULT_CHART_COMPONENTS = {
|
|
|
96
99
|
Column,
|
|
97
100
|
DEFAULT_CHART_COMPONENTS,
|
|
98
101
|
DualAxes,
|
|
102
|
+
FishboneDiagram,
|
|
99
103
|
FlowDiagram,
|
|
100
104
|
HeatMap,
|
|
101
105
|
Histogram,
|
|
@@ -18,10 +18,11 @@ export declare enum ChartType {
|
|
|
18
18
|
PathMap = "path-map",
|
|
19
19
|
HeatMap = "heat-map",
|
|
20
20
|
MindMap = "mind-map",
|
|
21
|
-
|
|
21
|
+
FishboneDiagram = "fishbone-diagram",
|
|
22
22
|
FlowDiagram = "flow-diagram",
|
|
23
|
-
OrganizationChart = "organization-chart",
|
|
24
23
|
IndentedTree = "indented-tree",
|
|
24
|
+
NetworkGraph = "network-graph",
|
|
25
|
+
OrganizationChart = "organization-chart",
|
|
25
26
|
VisText = "vis-text"
|
|
26
27
|
}
|
|
27
28
|
export type Charts = keyof typeof ChartType;
|
package/dist/cjs/types/chart.js
CHANGED
|
@@ -38,10 +38,11 @@ var ChartType = /* @__PURE__ */ ((ChartType2) => {
|
|
|
38
38
|
ChartType2["PathMap"] = "path-map";
|
|
39
39
|
ChartType2["HeatMap"] = "heat-map";
|
|
40
40
|
ChartType2["MindMap"] = "mind-map";
|
|
41
|
-
ChartType2["
|
|
41
|
+
ChartType2["FishboneDiagram"] = "fishbone-diagram";
|
|
42
42
|
ChartType2["FlowDiagram"] = "flow-diagram";
|
|
43
|
-
ChartType2["OrganizationChart"] = "organization-chart";
|
|
44
43
|
ChartType2["IndentedTree"] = "indented-tree";
|
|
44
|
+
ChartType2["NetworkGraph"] = "network-graph";
|
|
45
|
+
ChartType2["OrganizationChart"] = "organization-chart";
|
|
45
46
|
ChartType2["VisText"] = "vis-text";
|
|
46
47
|
return ChartType2;
|
|
47
48
|
})(ChartType || {});
|
package/dist/cjs/version.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: "0.2.
|
|
1
|
+
declare const _default: "0.2.1";
|
|
2
2
|
export default _default;
|
package/dist/cjs/version.js
CHANGED
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
+
var _excluded = ["data"];
|
|
4
|
+
import { Fishbone as ADCFishbone } from '@ant-design/graphs';
|
|
5
|
+
import React, { useMemo } from 'react';
|
|
6
|
+
import { useGraphConfig } from "../ConfigProvider/hooks";
|
|
7
|
+
import { visTreeData2GraphData } from "../utils/graph";
|
|
8
|
+
var defaultConfig = {
|
|
9
|
+
autoFit: 'view',
|
|
10
|
+
autoResize: true
|
|
11
|
+
};
|
|
12
|
+
var FishboneDiagram = function FishboneDiagram(props) {
|
|
13
|
+
var propsData = props.data,
|
|
14
|
+
restProps = _objectWithoutProperties(props, _excluded);
|
|
15
|
+
var data = useMemo(function () {
|
|
16
|
+
return visTreeData2GraphData(propsData);
|
|
17
|
+
}, [propsData]);
|
|
18
|
+
var config = useGraphConfig('FishboneDiagram', defaultConfig, restProps);
|
|
19
|
+
return /*#__PURE__*/React.createElement(ADCFishbone, _extends({
|
|
20
|
+
data: data
|
|
21
|
+
}, config));
|
|
22
|
+
};
|
|
23
|
+
export default FishboneDiagram;
|
package/dist/esm/Text/VisText.js
CHANGED
|
@@ -4,6 +4,7 @@ import { pick, toString } from 'lodash';
|
|
|
4
4
|
import React from 'react';
|
|
5
5
|
import { useComponentGlobalConfig } from "../ConfigProvider/hooks";
|
|
6
6
|
import { STATICS_KEY } from "./config";
|
|
7
|
+
import { getThemeColor, useAntdDarkAlgorithm } from "./utils";
|
|
7
8
|
var Text = Typography.Text;
|
|
8
9
|
function renderPrefixSuffix(symbol, staticsConfig, props) {
|
|
9
10
|
if (!symbol) return null;
|
|
@@ -17,6 +18,7 @@ var VisText = function VisText(props) {
|
|
|
17
18
|
style = props.style,
|
|
18
19
|
type = props.type,
|
|
19
20
|
origin = props.origin;
|
|
21
|
+
var isDark = useAntdDarkAlgorithm();
|
|
20
22
|
var textConfig = useComponentGlobalConfig('VisText');
|
|
21
23
|
var encoding = type ? textConfig === null || textConfig === void 0 ? void 0 : textConfig[type] : {};
|
|
22
24
|
var staticsConfig = textConfig === null || textConfig === void 0 ? void 0 : textConfig[STATICS_KEY];
|
|
@@ -30,8 +32,13 @@ var VisText = function VisText(props) {
|
|
|
30
32
|
style: _objectSpread(_objectSpread({
|
|
31
33
|
// antd Text 组件写死了 14px,在段落定义了 font-size 的情况下,显示很突兀,这里不设置,跟随上级容器字体大小改变。
|
|
32
34
|
// TODO @羽熙 之后看能否通过 antd ConfigProvider 统一配置
|
|
33
|
-
fontSize: 'unset'
|
|
34
|
-
|
|
35
|
+
fontSize: 'unset',
|
|
36
|
+
color: getThemeColor({
|
|
37
|
+
type: type,
|
|
38
|
+
color: encoding === null || encoding === void 0 ? void 0 : encoding.color,
|
|
39
|
+
theme: isDark ? 'dark' : 'light'
|
|
40
|
+
})
|
|
41
|
+
}, style), pick(encoding, ['backgroundColor', 'fontWeight']))
|
|
35
42
|
}, renderPrefixSuffix(encoding === null || encoding === void 0 ? void 0 : encoding.prefix, staticsConfig, props), children, renderPrefixSuffix(encoding === null || encoding === void 0 ? void 0 : encoding.suffix, staticsConfig, props)))
|
|
36
43
|
);
|
|
37
44
|
};
|
package/dist/esm/Text/config.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
var _DEFAULT_VIS_TEXT_CON;
|
|
3
|
-
import { TEXT_THEME } from "./constants";
|
|
4
3
|
import { ArrowDown, ArrowUp } from "./custom-icons";
|
|
5
4
|
import { ProportionChart, SingleLineChart } from "./mini-charts";
|
|
5
|
+
import { TEXT_THEME } from "./theme";
|
|
6
6
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
7
7
|
var INNER_ENTITY_TYPES = ['metric_name',
|
|
8
8
|
// 指标名
|
|
@@ -43,37 +43,37 @@ export var DEFAULT_VIS_TEXT_CONFIG = (_DEFAULT_VIS_TEXT_CON = {}, _definePropert
|
|
|
43
43
|
// TODO @羽熙 当前仅支持单折线图,之后可以考虑支持多折线图,在组件内实现分支判断
|
|
44
44
|
'mini-chart:line': SingleLineChart
|
|
45
45
|
}), "metric_name", {
|
|
46
|
-
color: TEXT_THEME.
|
|
46
|
+
color: TEXT_THEME.light.default88Color,
|
|
47
47
|
fontWeight: 500
|
|
48
48
|
}), "metric_value", {
|
|
49
|
-
color: TEXT_THEME.primaryColor
|
|
49
|
+
color: TEXT_THEME.light.primaryColor
|
|
50
50
|
}), "other_metric_value", {
|
|
51
|
-
color: TEXT_THEME.
|
|
51
|
+
color: TEXT_THEME.light.default65Color
|
|
52
52
|
}), "delta_value", {
|
|
53
|
-
color: TEXT_THEME.
|
|
53
|
+
color: TEXT_THEME.light.default65Color
|
|
54
54
|
}), "ratio_value", {
|
|
55
|
-
color: TEXT_THEME.
|
|
55
|
+
color: TEXT_THEME.light.default65Color
|
|
56
56
|
}), "delta_value_pos", {
|
|
57
|
-
color: TEXT_THEME.posColor,
|
|
57
|
+
color: TEXT_THEME.light.posColor,
|
|
58
58
|
prefix: '+'
|
|
59
59
|
}), "delta_value_neg", {
|
|
60
|
-
color: TEXT_THEME.negColor,
|
|
60
|
+
color: TEXT_THEME.light.negColor,
|
|
61
61
|
prefix: '-'
|
|
62
62
|
}), "ratio_value_pos", {
|
|
63
|
-
color: TEXT_THEME.posColor,
|
|
63
|
+
color: TEXT_THEME.light.posColor,
|
|
64
64
|
prefix: 'icon:arrow-up'
|
|
65
65
|
}), "ratio_value_neg", {
|
|
66
|
-
color: TEXT_THEME.negColor,
|
|
66
|
+
color: TEXT_THEME.light.negColor,
|
|
67
67
|
prefix: 'icon:arrow-down'
|
|
68
68
|
}), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_DEFAULT_VIS_TEXT_CON, "contribute_ratio", {
|
|
69
|
-
color: TEXT_THEME.
|
|
69
|
+
color: TEXT_THEME.light.conclusionColor
|
|
70
70
|
}), "trend_desc", {
|
|
71
|
-
color: TEXT_THEME.
|
|
71
|
+
color: TEXT_THEME.light.conclusionColor,
|
|
72
72
|
suffix: 'mini-chart:line'
|
|
73
73
|
}), "dim_value", {
|
|
74
|
-
color: TEXT_THEME.
|
|
74
|
+
color: TEXT_THEME.light.default88Color
|
|
75
75
|
}), "time_desc", {
|
|
76
|
-
color: TEXT_THEME.
|
|
76
|
+
color: TEXT_THEME.light.default88Color
|
|
77
77
|
}), "proportion", {
|
|
78
78
|
suffix: 'mini-chart:proportion'
|
|
79
79
|
}));
|
|
@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
|
|
|
3
3
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
4
4
|
var _excluded = ["children"];
|
|
5
5
|
import React, { useLayoutEffect, useRef, useState } from 'react';
|
|
6
|
-
import { TEXT_THEME } from "../../
|
|
6
|
+
import { TEXT_THEME } from "../../theme";
|
|
7
7
|
import { getElementFontSize } from "./getElementFontSize";
|
|
8
8
|
export var useSvgWrapper = function useSvgWrapper() {
|
|
9
9
|
var ele = useRef(null);
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
2
|
import { isArray, isString, size } from 'lodash';
|
|
3
3
|
import React, { useMemo } from 'react';
|
|
4
|
+
import { TEXT_THEME } from "../../theme";
|
|
4
5
|
import { useSvgWrapper } from "../hooks";
|
|
5
6
|
import { useLineCompute } from "./useLineCompute";
|
|
6
7
|
var LINEAR_FILL_COLOR_ID = 'wsc-line-fill';
|
|
7
|
-
var LINE_STROKE_COLOR = '#5B8FF9';
|
|
8
8
|
function getLineChartData(origin) {
|
|
9
9
|
if (isArray(origin)) return origin;
|
|
10
10
|
if (isString(origin)) {
|
|
@@ -40,7 +40,7 @@ export var SingleLineChart = function SingleLineChart(_ref) {
|
|
|
40
40
|
y2: "122.389541%",
|
|
41
41
|
id: LINEAR_FILL_COLOR_ID
|
|
42
42
|
}, /*#__PURE__*/React.createElement("stop", {
|
|
43
|
-
stopColor:
|
|
43
|
+
stopColor: TEXT_THEME.chart.lineStrokeColor,
|
|
44
44
|
offset: "0%"
|
|
45
45
|
}), /*#__PURE__*/React.createElement("stop", {
|
|
46
46
|
stopColor: "#FFFFFF",
|
|
@@ -48,7 +48,7 @@ export var SingleLineChart = function SingleLineChart(_ref) {
|
|
|
48
48
|
offset: "100%"
|
|
49
49
|
}))), linePath && /*#__PURE__*/React.createElement("path", {
|
|
50
50
|
d: linePath,
|
|
51
|
-
stroke:
|
|
51
|
+
stroke: TEXT_THEME.chart.lineStrokeColor,
|
|
52
52
|
fill: "transparent"
|
|
53
53
|
}), polygonPath && /*#__PURE__*/React.createElement("polygon", {
|
|
54
54
|
points: polygonPath,
|
|
@@ -4,7 +4,7 @@ import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
|
4
4
|
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
5
5
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
6
6
|
import { useEffect, useState } from 'react';
|
|
7
|
-
import { TEXT_THEME } from "../../
|
|
7
|
+
import { TEXT_THEME } from "../../theme";
|
|
8
8
|
import { scaleLinear } from "./scaleLinear";
|
|
9
9
|
|
|
10
10
|
// adjust to draw line width
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
2
|
import { isNaN, isString, toNumber } from 'lodash';
|
|
3
3
|
import React, { useMemo } from 'react';
|
|
4
|
+
import { TEXT_THEME } from "../../theme";
|
|
4
5
|
import { useSvgWrapper } from "../hooks/useSvgWrapper";
|
|
5
6
|
import { getArcPath } from "./getArcPath";
|
|
6
|
-
var SHADOW_COLOR = '#CDDDFD';
|
|
7
|
-
var FILL_COLOR = '#3471F9';
|
|
8
7
|
function getProportionNumber(children,
|
|
9
8
|
// markdown 中传入的 children 文本为 string[]
|
|
10
9
|
origin) {
|
|
@@ -47,14 +46,14 @@ export var ProportionChart = function ProportionChart(_ref) {
|
|
|
47
46
|
cx: r,
|
|
48
47
|
cy: r,
|
|
49
48
|
r: r,
|
|
50
|
-
fill:
|
|
49
|
+
fill: TEXT_THEME.chart.proportionShadowColor
|
|
51
50
|
}), data >= 1 ? /*#__PURE__*/React.createElement("circle", {
|
|
52
51
|
cx: r,
|
|
53
52
|
cy: r,
|
|
54
53
|
r: r,
|
|
55
|
-
fill:
|
|
54
|
+
fill: TEXT_THEME.chart.proportionFillColor
|
|
56
55
|
}) : /*#__PURE__*/React.createElement("path", {
|
|
57
56
|
d: getArcPath(fontSize, data),
|
|
58
|
-
fill:
|
|
57
|
+
fill: TEXT_THEME.chart.proportionFillColor
|
|
59
58
|
}));
|
|
60
59
|
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
export declare const TEXT_THEME: {
|
|
2
|
+
fontSizeBase: number;
|
|
3
|
+
chart: {
|
|
4
|
+
proportionShadowColor: string;
|
|
5
|
+
proportionFillColor: string;
|
|
6
|
+
lineStrokeColor: string;
|
|
7
|
+
};
|
|
8
|
+
light: {
|
|
9
|
+
primaryColor: string;
|
|
10
|
+
default88Color: string;
|
|
11
|
+
default65Color: string;
|
|
12
|
+
posColor: string;
|
|
13
|
+
negColor: string;
|
|
14
|
+
conclusionColor: string;
|
|
15
|
+
};
|
|
16
|
+
dark: {
|
|
17
|
+
primaryColor: string;
|
|
18
|
+
default88Color: string;
|
|
19
|
+
default65Color: string;
|
|
20
|
+
posColor: string;
|
|
21
|
+
negColor: string;
|
|
22
|
+
conclusionColor: string;
|
|
23
|
+
};
|
|
24
|
+
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
export var TEXT_THEME = {
|
|
2
|
+
fontSizeBase: 14,
|
|
3
|
+
chart: {
|
|
4
|
+
proportionShadowColor: '#CDDDFD',
|
|
5
|
+
proportionFillColor: '#3471F9',
|
|
6
|
+
lineStrokeColor: '#5B8FF9'
|
|
7
|
+
},
|
|
8
|
+
light: {
|
|
9
|
+
primaryColor: '#1677FF',
|
|
10
|
+
default88Color: 'rgba(0, 0, 0, 0.88)',
|
|
11
|
+
default65Color: 'rgba(0, 0, 0, 0.65)',
|
|
12
|
+
posColor: '#FA541C',
|
|
13
|
+
negColor: '#13A8A8',
|
|
14
|
+
conclusionColor: '#1F0352'
|
|
15
|
+
},
|
|
16
|
+
dark: {
|
|
17
|
+
primaryColor: '#4B91FF',
|
|
18
|
+
default88Color: 'rgba(255, 255, 255, 0.88)',
|
|
19
|
+
default65Color: 'rgba(255, 255, 255, 0.65)',
|
|
20
|
+
posColor: '#FA541C',
|
|
21
|
+
negColor: '#13A8A8',
|
|
22
|
+
conclusionColor: '#D8C3F3'
|
|
23
|
+
}
|
|
24
|
+
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* 自动适配暗黑模式
|
|
3
|
+
* @params type 类型
|
|
4
|
+
* @params color 当前颜色
|
|
5
|
+
* @params theme 当前主题
|
|
6
|
+
*/
|
|
7
|
+
export declare const getThemeColor: ({ type, color, theme, }: {
|
|
8
|
+
type?: string | undefined;
|
|
9
|
+
color: string | undefined;
|
|
10
|
+
theme: 'dark' | 'light';
|
|
11
|
+
}) => string | undefined;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { findKey, get } from 'lodash';
|
|
2
|
+
import { DEFAULT_VIS_TEXT_CONFIG } from "../config";
|
|
3
|
+
import { TEXT_THEME } from "../theme";
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* 自动适配暗黑模式
|
|
7
|
+
* @params type 类型
|
|
8
|
+
* @params color 当前颜色
|
|
9
|
+
* @params theme 当前主题
|
|
10
|
+
*/
|
|
11
|
+
export var getThemeColor = function getThemeColor(_ref) {
|
|
12
|
+
var type = _ref.type,
|
|
13
|
+
color = _ref.color,
|
|
14
|
+
theme = _ref.theme;
|
|
15
|
+
// 仅暗黑主题才处理
|
|
16
|
+
if (type && color && theme === 'dark') {
|
|
17
|
+
var defaultLightColor = get(DEFAULT_VIS_TEXT_CONFIG, [type, 'color']);
|
|
18
|
+
// 仅当前颜色为默认的浅色主题时才处理
|
|
19
|
+
if (color === defaultLightColor) {
|
|
20
|
+
// 找到浅色主题的 token
|
|
21
|
+
var token = findKey(TEXT_THEME.light, function (i) {
|
|
22
|
+
return i === color;
|
|
23
|
+
});
|
|
24
|
+
// 返回暗黑主题的对应 token 的颜色
|
|
25
|
+
if (token) return TEXT_THEME.dark[token];
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
return color;
|
|
29
|
+
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ConfigProvider, theme as antdTheme } from 'antd';
|
|
2
|
+
import { isArray } from 'lodash';
|
|
3
|
+
import { useContext } from 'react';
|
|
4
|
+
var darkAlgorithm = antdTheme.darkAlgorithm;
|
|
5
|
+
|
|
6
|
+
/** 判断是否运用了 antd dark algorithm */
|
|
7
|
+
export var useAntdDarkAlgorithm = function useAntdDarkAlgorithm() {
|
|
8
|
+
var _config$theme;
|
|
9
|
+
var config = useContext(ConfigProvider.ConfigContext);
|
|
10
|
+
var currentAlgorithm = (_config$theme = config.theme) === null || _config$theme === void 0 ? void 0 : _config$theme.algorithm;
|
|
11
|
+
if (isArray(currentAlgorithm) && currentAlgorithm.includes(darkAlgorithm)) return true;
|
|
12
|
+
return currentAlgorithm === darkAlgorithm;
|
|
13
|
+
};
|
package/dist/esm/export.d.ts
CHANGED
|
@@ -13,16 +13,17 @@ import { default as Scatter, type ScatterProps } from './Scatter';
|
|
|
13
13
|
import { default as Treemap, type TreemapProps } from './Treemap';
|
|
14
14
|
import { default as WordCloud, type WordCloudProps } from './WordCloud';
|
|
15
15
|
/********** graph chart **********/
|
|
16
|
+
import { default as FishboneDiagram, type FishboneDiagramProps } from './FishboneDiagram';
|
|
16
17
|
import { default as FlowDiagram, type FlowDiagramProps } from './FlowDiagram';
|
|
17
18
|
import { default as MindMap, type MindMapProps } from './MindMap';
|
|
18
19
|
import { default as NetworkGraph, type NetworkGraphProps } from './NetworkGraph';
|
|
19
|
-
import { default as PathMap, type PathMapProps } from './PathMap';
|
|
20
|
-
import { default as PinMap, type PinMapProps } from './PinMap';
|
|
21
20
|
export { default as IndentedTree, type IndentedTreeProps } from './IndentedTree';
|
|
21
|
+
export { default as Map, type MapProps } from './Map';
|
|
22
22
|
export { default as OrganizationChart, type OrganizationChartProps } from './OrganizationChart';
|
|
23
23
|
/********** map chart **********/
|
|
24
|
-
|
|
24
|
+
import { default as PathMap, type PathMapProps } from './PathMap';
|
|
25
|
+
import { default as PinMap, type PinMapProps } from './PinMap';
|
|
25
26
|
/********** NTV **********/
|
|
26
27
|
export { VisText, type VisTextProps } from './Text';
|
|
27
|
-
export { Area, Bar, Column, DualAxes, FlowDiagram, HeatMap, Histogram, Line, MindMap, NetworkGraph, PathMap, Pie, PinMap, Radar, Scatter, Treemap, WordCloud, type AreaProps, type BarProps, type ColumnProps, type DualAxesProps, type FlowDiagramProps, type HeatMapProps, type HistogramProps, type LineProps, type MindMapProps, type NetworkGraphProps, type PathMapProps, type PieProps, type PinMapProps, type RadarProps, type ScatterProps, type TreemapProps, type WordCloudProps, };
|
|
28
|
+
export { Area, Bar, Column, DualAxes, FishboneDiagram, FlowDiagram, HeatMap, Histogram, Line, MindMap, NetworkGraph, PathMap, Pie, PinMap, Radar, Scatter, Treemap, WordCloud, type AreaProps, type BarProps, type ColumnProps, type DualAxesProps, type FishboneDiagramProps, type FlowDiagramProps, type HeatMapProps, type HistogramProps, type LineProps, type MindMapProps, type NetworkGraphProps, type PathMapProps, type PieProps, type PinMapProps, type RadarProps, type ScatterProps, type TreemapProps, type WordCloudProps, };
|
|
28
29
|
export declare const DEFAULT_CHART_COMPONENTS: Record<string, React.FC<any>>;
|
package/dist/esm/export.js
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
var _DEFAULT_CHART_COMPON;
|
|
3
|
+
import { ChartType } from "./types";
|
|
4
|
+
|
|
3
5
|
/********** plot chart **********/
|
|
4
6
|
import { default as Area } from "./Area";
|
|
5
7
|
import { default as Bar } from "./Bar";
|
|
@@ -15,19 +17,19 @@ import { default as Treemap } from "./Treemap";
|
|
|
15
17
|
import { default as WordCloud } from "./WordCloud";
|
|
16
18
|
|
|
17
19
|
/********** graph chart **********/
|
|
20
|
+
import { default as FishboneDiagram } from "./FishboneDiagram";
|
|
18
21
|
import { default as FlowDiagram } from "./FlowDiagram";
|
|
19
22
|
import { default as MindMap } from "./MindMap";
|
|
20
23
|
import { default as NetworkGraph } from "./NetworkGraph";
|
|
21
|
-
import { default as PathMap } from "./PathMap";
|
|
22
|
-
import { default as PinMap } from "./PinMap";
|
|
23
|
-
import { ChartType } from "./types";
|
|
24
24
|
export { default as IndentedTree } from "./IndentedTree";
|
|
25
|
+
export { default as Map } from "./Map";
|
|
25
26
|
export { default as OrganizationChart } from "./OrganizationChart";
|
|
26
27
|
|
|
27
28
|
/********** map chart **********/
|
|
28
|
-
|
|
29
|
+
import { default as PathMap } from "./PathMap";
|
|
30
|
+
import { default as PinMap } from "./PinMap";
|
|
29
31
|
|
|
30
32
|
/********** NTV **********/
|
|
31
33
|
export { VisText } from "./Text";
|
|
32
|
-
export { Area, Bar, Column, DualAxes, FlowDiagram, HeatMap, Histogram, Line, MindMap, NetworkGraph, PathMap, Pie, PinMap, Radar, Scatter, Treemap, WordCloud };
|
|
33
|
-
export var DEFAULT_CHART_COMPONENTS = (_DEFAULT_CHART_COMPON = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_DEFAULT_CHART_COMPON, ChartType.Line, Line), ChartType.Column, Column), ChartType.Pie, Pie), ChartType.Bar, Bar), ChartType.Area, Area), ChartType.Scatter, Scatter), ChartType.PinMap, PinMap), ChartType.PathMap, PathMap), ChartType.HeatMap, HeatMap), ChartType.MindMap, MindMap), _defineProperty(_defineProperty(_DEFAULT_CHART_COMPON, ChartType.FlowDiagram, FlowDiagram), ChartType.NetworkGraph, NetworkGraph));
|
|
34
|
+
export { Area, Bar, Column, DualAxes, FishboneDiagram, FlowDiagram, HeatMap, Histogram, Line, MindMap, NetworkGraph, PathMap, Pie, PinMap, Radar, Scatter, Treemap, WordCloud };
|
|
35
|
+
export var DEFAULT_CHART_COMPONENTS = (_DEFAULT_CHART_COMPON = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_DEFAULT_CHART_COMPON, ChartType.Line, Line), ChartType.Column, Column), ChartType.Pie, Pie), ChartType.Bar, Bar), ChartType.Area, Area), ChartType.Scatter, Scatter), ChartType.PinMap, PinMap), ChartType.PathMap, PathMap), ChartType.HeatMap, HeatMap), ChartType.MindMap, MindMap), _defineProperty(_defineProperty(_defineProperty(_DEFAULT_CHART_COMPON, ChartType.FlowDiagram, FlowDiagram), ChartType.NetworkGraph, NetworkGraph), ChartType.FishboneDiagram, FishboneDiagram));
|
|
@@ -18,10 +18,11 @@ export declare enum ChartType {
|
|
|
18
18
|
PathMap = "path-map",
|
|
19
19
|
HeatMap = "heat-map",
|
|
20
20
|
MindMap = "mind-map",
|
|
21
|
-
|
|
21
|
+
FishboneDiagram = "fishbone-diagram",
|
|
22
22
|
FlowDiagram = "flow-diagram",
|
|
23
|
-
OrganizationChart = "organization-chart",
|
|
24
23
|
IndentedTree = "indented-tree",
|
|
24
|
+
NetworkGraph = "network-graph",
|
|
25
|
+
OrganizationChart = "organization-chart",
|
|
25
26
|
VisText = "vis-text"
|
|
26
27
|
}
|
|
27
28
|
export type Charts = keyof typeof ChartType;
|
package/dist/esm/types/chart.js
CHANGED
|
@@ -14,10 +14,11 @@ export var ChartType = /*#__PURE__*/function (ChartType) {
|
|
|
14
14
|
ChartType["PathMap"] = "path-map";
|
|
15
15
|
ChartType["HeatMap"] = "heat-map";
|
|
16
16
|
ChartType["MindMap"] = "mind-map";
|
|
17
|
-
ChartType["
|
|
17
|
+
ChartType["FishboneDiagram"] = "fishbone-diagram";
|
|
18
18
|
ChartType["FlowDiagram"] = "flow-diagram";
|
|
19
|
-
ChartType["OrganizationChart"] = "organization-chart";
|
|
20
19
|
ChartType["IndentedTree"] = "indented-tree";
|
|
20
|
+
ChartType["NetworkGraph"] = "network-graph";
|
|
21
|
+
ChartType["OrganizationChart"] = "organization-chart";
|
|
21
22
|
ChartType["VisText"] = "vis-text";
|
|
22
23
|
return ChartType;
|
|
23
24
|
}({});
|
package/dist/esm/version.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: "0.2.
|
|
1
|
+
declare const _default: "0.2.1";
|
|
2
2
|
export default _default;
|
package/dist/esm/version.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export default '0.2.
|
|
1
|
+
export default '0.2.1';
|