visualifyjs 2.5.3-2.dev → 2.5.3-9-dev

Sign up to get free protection for your applications and to get access to all the features.

Potentially problematic release.


This version of visualifyjs might be problematic. Click here for more details.

Files changed (139) hide show
  1. package/.github/workflows/{static.yml.bak → build.yaml} +51 -51
  2. package/LICENSE +674 -674
  3. package/README.md +40 -58
  4. package/config-overrides.js +31 -31
  5. package/dist/visualify.js +3 -3
  6. package/docs/CLI.md +15 -0
  7. package/docs/{docs/README.md → README.md} +41 -65
  8. package/docs/{docs/Rechart → Rechart}/bar.md +190 -190
  9. package/docs/{docs/Rechart → Rechart}/funnel.md +193 -241
  10. package/docs/{docs/Rechart → Rechart}/line.md +355 -355
  11. package/docs/{docs/Rechart → Rechart}/pie.md +225 -225
  12. package/docs/{docs/Rechart → Rechart}/radar.md +253 -253
  13. package/docs/{docs/_404.md → _404.md} +51 -51
  14. package/docs/{docs/_coverpage.md → _coverpage.md} +11 -11
  15. package/docs/{docs/_sidebar.md → _sidebar.md} +42 -44
  16. package/docs/{docs/components → components}/dotBio.md +34 -34
  17. package/docs/{docs/components → components}/echart.md +82 -82
  18. package/docs/{docs/components → components}/html.md +34 -34
  19. package/docs/{docs/components → components}/macaron.md +145 -145
  20. package/docs/components/markdown.md +0 -0
  21. package/docs/{docs/components → components}/more.md +142 -142
  22. package/docs/{docs/components → components}/plotly.md +62 -62
  23. package/docs/{docs/components → components}/scatterL.md +70 -70
  24. package/docs/{docs/components → components}/visium.md +56 -56
  25. package/docs/{docs/configuration.md → configuration.md} +123 -121
  26. package/docs/{docs/deploy.md → deploy.md} +23 -31
  27. package/docs/index.html +70 -70
  28. package/docs/log.md +1 -0
  29. package/docs/manifest.json +23 -23
  30. package/docs/{docs/more-pages.md → more-pages.md} +23 -23
  31. package/docs/{docs/quickstart.md → quickstart.md} +115 -124
  32. package/docs/{docs/rechart-attributes.md → rechart-attributes.md} +74 -74
  33. package/docs/{docs/rechart-basic-usage.md → rechart-basic-usage.md} +162 -162
  34. package/docs/static/css/fluff-stuff.css +169 -169
  35. package/docs/static/css/font-awesome.min.css +4 -4
  36. package/docs/static/css/visualify.css +25 -25
  37. package/docs/static/js/configuration.js +448 -448
  38. package/docs/static/js/visualify.js +24 -23
  39. package/docs/theme.md +3 -0
  40. package/package.json +74 -83
  41. package/rollup.config.mjs +75 -75
  42. package/src/_css/404.css +115 -115
  43. package/src/_css/App.css +37 -37
  44. package/src/_css/autoSuggestion.css +26 -26
  45. package/src/_css/circular-progress.css +32 -32
  46. package/src/_css/index.css +36 -36
  47. package/src/_css/modern.css +24 -24
  48. package/src/_media/corner.svg +8 -8
  49. package/src/_media/download.svg +3 -3
  50. package/src/_media/logo.svg +14 -14
  51. package/src/_test/App.test.js +15 -15
  52. package/src/_utils/reportWebVitals.js +13 -13
  53. package/src/core/appContext.js +27 -27
  54. package/src/core/components/Scatter.js +188 -188
  55. package/src/core/components/ScatterBio.js +572 -572
  56. package/src/core/components/VisiumPlot.js +165 -165
  57. package/src/core/components/browser.js +42 -42
  58. package/src/core/components/dotplot.js +413 -413
  59. package/src/core/components/html.js +29 -29
  60. package/src/core/components/list.js +178 -178
  61. package/src/core/components/macaron.js +201 -201
  62. package/src/core/components/markdown.js +56 -56
  63. package/src/core/components/parser.scatterBio.js +579 -587
  64. package/src/core/components/ratio.js +80 -80
  65. package/src/core/components/scatterL.js +173 -173
  66. package/src/core/components/searchbar.js +131 -131
  67. package/src/core/components/selection.js +193 -193
  68. package/src/core/components/timeline.js +281 -281
  69. package/src/core/components/visium.js +97 -97
  70. package/src/core/fetch/condfetch.js +82 -82
  71. package/src/core/fetch/fetch.js +92 -92
  72. package/src/core/fetch/json.js +29 -29
  73. package/src/core/fetch/vfetch.js +42 -42
  74. package/src/core/liveEditor.js +44 -44
  75. package/src/core/modules/codeEditorWithPreview.js +104 -104
  76. package/src/core/modules/echarts/common.js +20 -20
  77. package/src/core/modules/echarts/presetHandler.js +41 -41
  78. package/src/core/modules/echarts/presets/esodev.chromium.js +172 -172
  79. package/src/core/modules/echarts/presets/esodev.codex.js +130 -130
  80. package/src/core/modules/echarts/presets/esodev.visium.js +123 -123
  81. package/src/core/modules/echarts/presets/mmtrbc.js +186 -186
  82. package/src/core/modules/echarts.js +71 -71
  83. package/src/core/modules/echartsUtils.js +43 -43
  84. package/src/core/modules/echartswitcher.js +152 -152
  85. package/src/core/modules/replotly/presetHandler.js +24 -24
  86. package/src/core/modules/replotly/presets/minimum.js +18 -18
  87. package/src/core/modules/replotly/presets/mmtrbc.dot.js +114 -114
  88. package/src/core/modules/replotly/presets/mmtrbc.violin.js +100 -100
  89. package/src/core/modules/replotly.js +71 -71
  90. package/src/core/pages/404.js +50 -50
  91. package/src/core/pages/error.js +27 -27
  92. package/src/core/pages/jsonPage.js +62 -62
  93. package/src/core/pages/loading.js +44 -44
  94. package/src/core/parser/echart.data.js +183 -183
  95. package/src/core/parser/echart.features.js +125 -125
  96. package/src/core/parser/echart.general.js +143 -147
  97. package/src/core/parser/echart.hilbert.js +57 -57
  98. package/src/core/parser/echart.parser.js +210 -210
  99. package/src/core/parser/echart.series.js +67 -67
  100. package/src/core/parser/echart.types.js +76 -76
  101. package/src/core/parser/plotly.config.js +10 -10
  102. package/src/core/parser/plotly.data.js +132 -132
  103. package/src/core/parser/plotly.layout.js +9 -9
  104. package/src/core/parser/plotly.violin.js +18 -18
  105. package/src/core/recharts.js +62 -62
  106. package/src/core/router/alias.js +49 -49
  107. package/src/core/router/jsonRouter.js +31 -31
  108. package/src/core/themes/modern.js +32 -32
  109. package/src/core/themes/themeSelector.js +33 -33
  110. package/src/core/visualify.js +47 -47
  111. package/src/core/widgets/circularProgress.js +23 -23
  112. package/src/core/widgets/controller.js +83 -83
  113. package/src/core/widgets/errorBoundary.js +36 -36
  114. package/src/core/widgets/footer.js +177 -177
  115. package/src/core/widgets/header.js +234 -234
  116. package/src/core/widgets/layout/Grid.js +31 -31
  117. package/src/core/widgets/layout.js +36 -36
  118. package/src/core/widgets/mapping.js +42 -42
  119. package/src/index.js +62 -62
  120. package/src/setupTests.js +5 -5
  121. package/docs/docs/CLI.md +0 -34
  122. package/docs/docs/Rechart/scatter.md +0 -298
  123. package/docs/docs/log.md +0 -9
  124. package/docs/docs/static/logo/favicon.ico +0 -0
  125. package/docs/docs/static/logo/logo_128x128.png +0 -0
  126. package/docs/docs/static/logo/logo_192x192.png +0 -0
  127. package/docs/docs/static/logo/logo_256x256.png +0 -0
  128. package/docs/docs/static/logo/logo_512x512.png +0 -0
  129. package/docs/docs/static/logo/logo_64x64.png +0 -0
  130. package/docs/docs/theme.md +0 -5
  131. /package/docs/{docs/Rechart → Rechart}/geo.md +0 -0
  132. /package/docs/{docs/Rechart → Rechart}/liquidfill.md +0 -0
  133. /package/docs/{docs/Rechart → Rechart}/polar.md +0 -0
  134. /package/docs/{docs/Rechart → Rechart}/sankey.md +0 -0
  135. /package/docs/{docs/Rechart/sunburst.md → Rechart/scatter.md} +0 -0
  136. /package/docs/{docs/Rechart/tree.md → Rechart/sunburst.md} +0 -0
  137. /package/docs/{docs/Rechart/wordcloud.md → Rechart/tree.md} +0 -0
  138. /package/docs/{docs/components/markdown.md → Rechart/wordcloud.md} +0 -0
  139. /package/docs/{docs/static → static}/_images/deploy-github-pages.png +0 -0
@@ -1,27 +1,27 @@
1
- /*
2
- * @Author : Lihao leolihao@arizona.edu
3
- * @Date : 2023-12-23 13:22:50
4
- * @FilePath : /visualifyjs/src/core/pages/error.js
5
- * @Description :
6
- * Copyright (c) 2023 by Lihao (leolihao@arizona.edu), All Rights Reserved.
7
- */
8
- import React from 'react';
9
-
10
- function Error({ message, style }) {
11
- return (
12
- <div
13
- style={{
14
- display: 'flex',
15
- alignItems: 'center',
16
- justifyContent: 'center',
17
- height: '100%',
18
- color: 'red',
19
- ...style,
20
- }}>
21
- {/* Display the error message */}
22
- <p>{message}</p>
23
- </div>
24
- );
25
- }
26
-
27
- export default Error;
1
+ /*
2
+ * @Author : Lihao leolihao@arizona.edu
3
+ * @Date : 2023-12-23 13:22:50
4
+ * @FilePath : /visualifyjs/src/core/pages/error.js
5
+ * @Description :
6
+ * Copyright (c) 2023 by Lihao (leolihao@arizona.edu), All Rights Reserved.
7
+ */
8
+ import React from 'react';
9
+
10
+ function Error({ message, style }) {
11
+ return (
12
+ <div
13
+ style={{
14
+ display: 'flex',
15
+ alignItems: 'center',
16
+ justifyContent: 'center',
17
+ height: '100%',
18
+ color: 'red',
19
+ ...style,
20
+ }}>
21
+ {/* Display the error message */}
22
+ <p>{message}</p>
23
+ </div>
24
+ );
25
+ }
26
+
27
+ export default Error;
@@ -1,62 +1,62 @@
1
- /*
2
- * @Author : Lihao leolihao@arizona.edu
3
- * @Date : 2023-11-29 21:20:55
4
- * @FilePath : /visualifyjs/src/core/pages/jsonPage.js
5
- * @Description :
6
- * Copyright (c) 2023 by Lihao (leolihao@arizona.edu), All Rights Reserved.
7
- */
8
- import React, { useEffect, useState } from 'react';
9
- import { useLocation } from 'react-router-dom';
10
- import NotFoundPage from './404';
11
- import fetchJson from '../fetch/json';
12
- import LayoutParser from '../widgets/layout';
13
- import Vcontroller from '../widgets/controller';
14
-
15
- const JsonPage = () => {
16
- const [jsonData, setJsonData] = useState(null);
17
- const [loading, setLoading] = useState(true);
18
- const [error, setError] = useState(null);
19
- const location = useLocation();
20
-
21
- useEffect(() => {
22
- const routerpath = location.pathname.replace(/^\/|\.json$/g, '');
23
- const jsonurl =
24
- routerpath === ''
25
- ? 'home'
26
- : routerpath.endsWith('/')
27
- ? routerpath + 'home'
28
- : routerpath;
29
- //console.log('JsonPage jsonurl:', jsonurl);
30
- if (jsonurl) {
31
- setLoading(true);
32
- setError(null);
33
-
34
- fetchJson(jsonurl)
35
- .then((data) => {
36
- setJsonData(data);
37
- setLoading(false);
38
- })
39
- .catch((err) => {
40
- setError(err);
41
- setLoading(false);
42
- });
43
- }
44
- }, [location.pathname]); // React to changes in pathname
45
-
46
- if (loading) {
47
- return <div>Loading...</div>;
48
- }
49
- if (error || !jsonData) {
50
- return <NotFoundPage page={location.pathname} />;
51
- }
52
-
53
- return (
54
- <>
55
- <LayoutParser config={jsonData.layout}>
56
- <Vcontroller components={jsonData.components} />
57
- </LayoutParser>
58
- </>
59
- );
60
- };
61
-
62
- export default JsonPage;
1
+ /*
2
+ * @Author : Lihao leolihao@arizona.edu
3
+ * @Date : 2023-11-29 21:20:55
4
+ * @FilePath : /visualifyjs/src/core/pages/jsonPage.js
5
+ * @Description :
6
+ * Copyright (c) 2023 by Lihao (leolihao@arizona.edu), All Rights Reserved.
7
+ */
8
+ import React, { useEffect, useState } from 'react';
9
+ import { useLocation } from 'react-router-dom';
10
+ import NotFoundPage from './404';
11
+ import fetchJson from '../fetch/json';
12
+ import LayoutParser from '../widgets/layout';
13
+ import Vcontroller from '../widgets/controller';
14
+
15
+ const JsonPage = () => {
16
+ const [jsonData, setJsonData] = useState(null);
17
+ const [loading, setLoading] = useState(true);
18
+ const [error, setError] = useState(null);
19
+ const location = useLocation();
20
+
21
+ useEffect(() => {
22
+ const routerpath = location.pathname.replace(/^\/|\.json$/g, '');
23
+ const jsonurl =
24
+ routerpath === ''
25
+ ? 'home'
26
+ : routerpath.endsWith('/')
27
+ ? routerpath + 'home'
28
+ : routerpath;
29
+ //console.log('JsonPage jsonurl:', jsonurl);
30
+ if (jsonurl) {
31
+ setLoading(true);
32
+ setError(null);
33
+
34
+ fetchJson(jsonurl)
35
+ .then((data) => {
36
+ setJsonData(data);
37
+ setLoading(false);
38
+ })
39
+ .catch((err) => {
40
+ setError(err);
41
+ setLoading(false);
42
+ });
43
+ }
44
+ }, [location.pathname]); // React to changes in pathname
45
+
46
+ if (loading) {
47
+ return <div>Loading...</div>;
48
+ }
49
+ if (error || !jsonData) {
50
+ return <NotFoundPage page={location.pathname} />;
51
+ }
52
+
53
+ return (
54
+ <>
55
+ <LayoutParser config={jsonData.layout}>
56
+ <Vcontroller components={jsonData.components} />
57
+ </LayoutParser>
58
+ </>
59
+ );
60
+ };
61
+
62
+ export default JsonPage;
@@ -1,44 +1,44 @@
1
- /*
2
- * @Author : Lihao leolihao@arizona.edu
3
- * @Date : 2023-12-23 13:22:33
4
- * @FilePath : /visualifyjs/src/core/pages/Loading.js
5
- * @Description :
6
- * Copyright (c) 2023 by Lihao (leolihao@arizona.edu), All Rights Reserved.
7
- */
8
- import React from 'react';
9
- import Error from './error';
10
- import CircularProgress from '../widgets/circularProgress';
11
-
12
- function Loading({
13
- message,
14
- style,
15
- msgStyle,
16
- ProgressColor = 'primary',
17
- error = false,
18
- }) {
19
- return (
20
- <div
21
- style={{
22
- display: 'flex',
23
- flexDirection: 'column', // Added to stack elements vertically
24
- alignItems: 'center',
25
- justifyContent: 'center',
26
- height: '100%',
27
- ...style,
28
- }}>
29
- <CircularProgress color={ProgressColor} />
30
- <div style={{ marginTop: '10px', ...msgStyle }}>
31
- {error ? (
32
- <Error
33
- message={message}
34
- style={msgStyle}
35
- />
36
- ) : (
37
- <p>{message}</p>
38
- )}
39
- </div>
40
- </div>
41
- );
42
- }
43
-
44
- export default Loading;
1
+ /*
2
+ * @Author : Lihao leolihao@arizona.edu
3
+ * @Date : 2023-12-23 13:22:33
4
+ * @FilePath : /visualifyjs/src/core/pages/Loading.js
5
+ * @Description :
6
+ * Copyright (c) 2023 by Lihao (leolihao@arizona.edu), All Rights Reserved.
7
+ */
8
+ import React from 'react';
9
+ import Error from './error';
10
+ import CircularProgress from '../widgets/circularProgress';
11
+
12
+ function Loading({
13
+ message,
14
+ style,
15
+ msgStyle,
16
+ ProgressColor = 'primary',
17
+ error = false,
18
+ }) {
19
+ return (
20
+ <div
21
+ style={{
22
+ display: 'flex',
23
+ flexDirection: 'column', // Added to stack elements vertically
24
+ alignItems: 'center',
25
+ justifyContent: 'center',
26
+ height: '100%',
27
+ ...style,
28
+ }}>
29
+ <CircularProgress color={ProgressColor} />
30
+ <div style={{ marginTop: '10px', ...msgStyle }}>
31
+ {error ? (
32
+ <Error
33
+ message={message}
34
+ style={msgStyle}
35
+ />
36
+ ) : (
37
+ <p>{message}</p>
38
+ )}
39
+ </div>
40
+ </div>
41
+ );
42
+ }
43
+
44
+ export default Loading;
@@ -1,183 +1,183 @@
1
- /*
2
- * @Author : Lihao leolihao@arizona.edu
3
- * @Date : 2023-12-02 16:52:58
4
- * @FilePath : /visualifyjs/src/core/parser/echart.data.js
5
- * @Description :
6
- * Copyright (c) 2023 by Lihao (leolihao@arizona.edu), All Rights Reserved.
7
- */
8
- import { getArrayEl, _handleSeries } from './echart.series';
9
- import {
10
- _parsePeakvalley,
11
- _parseMarkArea,
12
- _parseMarkLine,
13
- } from './echart.features';
14
-
15
- const _parser_data = (options = {}, preset = {}) => {
16
- // Parse the custom options
17
- const parsedOptions = {
18
- ...preset,
19
- yAxis: { ...preset.yAxis },
20
- xAxis: { ...preset.xAxis },
21
- legend: { ...preset.legend },
22
- title: { ...preset.title },
23
- tooltip: { ...preset.tooltip },
24
- // ... other default settings for charts
25
- series: [],
26
- };
27
-
28
- // Initialize totalValues array if percentage mode is active
29
- let totalValues = options.percentage
30
- ? new Array(options.xAxis.length).fill(0)
31
- : [];
32
-
33
- // calculate total values if in percentage mode
34
- if (options.percentage && options.data) {
35
- Object.entries(options.data).forEach(([_, data]) => {
36
- data.forEach((value, idx) => {
37
- totalValues[idx] += value;
38
- });
39
- });
40
- }
41
-
42
- if (options.data && typeof options.data === 'object') {
43
- parsedOptions.series = Object.entries(options.data).map(
44
- ([name, data], index) => {
45
- let seriesObject = {
46
- name,
47
- type: getArrayEl(options.type, index),
48
- data,
49
- ...(options.markArea && {
50
- markArea: _parseMarkArea(options.markArea, index),
51
- }),
52
- ...(options.markLine && {
53
- markLine: _parseMarkLine(options.markLine, index),
54
- }),
55
- ...(options.symbol && {
56
- symbol: getArrayEl(options.symbol, index),
57
- }),
58
- ...(options.symbolSize && {
59
- symbolSize: getArrayEl(options.symbolSize, index),
60
- }),
61
- ...(options.stack && {
62
- stack: options.stack.includes(name)
63
- ? 'total'
64
- : getArrayEl(options.stack, index),
65
- }),
66
- ...(options.emphasis && {
67
- emphasis: getArrayEl(options.emphasis, index),
68
- }),
69
- };
70
-
71
- if (
72
- options.percentage &&
73
- (options.type === 'bar' || options.type === 'line')
74
- ) {
75
- seriesObject.data = seriesObject.data.map(
76
- (value, idx) => (value / totalValues[idx]) * 100,
77
- );
78
- seriesObject.stack = 'total';
79
- }
80
-
81
- if (options.waterfall) {
82
- if (name === 'Placeholder' || name === options.waterfall) {
83
- seriesObject.itemStyle = {
84
- borderColor: 'transparent',
85
- color: 'transparent',
86
- };
87
- seriesObject = {
88
- ...seriesObject,
89
- emphasis: {
90
- ...seriesObject?.emphasis,
91
- itemStyle: {
92
- borderColor: 'transparent',
93
- color: 'transparent',
94
- },
95
- },
96
- };
97
- }
98
- }
99
-
100
- _parsePeakvalley(options, seriesObject);
101
-
102
- _handleSeries(options, seriesObject, index);
103
-
104
- return seriesObject;
105
- },
106
- );
107
- }
108
-
109
- if (
110
- (Array.isArray(options.type) && options.type.includes('radar')) ||
111
- options.type === 'radar'
112
- )
113
- parsedOptions.radar = options.radar;
114
-
115
- // Modify yAxis for percentage display
116
- if (options.percentage) {
117
- parsedOptions.yAxis = {
118
- ...parsedOptions.yAxis,
119
- axisLabel: { formatter: '{value}%' },
120
- max: 100,
121
- };
122
-
123
- parsedOptions.tooltip = {
124
- trigger: 'axis',
125
- formatter: percentageTooltipFormatter,
126
- };
127
- }
128
-
129
- if (options.markArea || options.markLine) {
130
- parsedOptions.tooltip = {
131
- trigger: 'axis',
132
- axisPointer: {
133
- type: 'cross',
134
- },
135
- };
136
- }
137
-
138
- if (options.waterfall) {
139
- parsedOptions.legend = {
140
- ...parsedOptions.legend,
141
- data: parsedOptions.series
142
- .map((series) => series.name)
143
- .filter((name) => name !== 'Placeholder'),
144
- };
145
- parsedOptions.xAxis = {
146
- ...parsedOptions.xAxis,
147
- splitLine: { show: false },
148
- };
149
-
150
- parsedOptions.tooltip = {
151
- trigger: 'axis',
152
- axisPointer: {
153
- type: 'shadow',
154
- },
155
- formatter: function (params) {
156
- var tar = params[1];
157
- return (
158
- tar.name +
159
- '<br/>' +
160
- tar.marker +
161
- tar.seriesName +
162
- ' : ' +
163
- tar.value
164
- );
165
- },
166
- };
167
- }
168
-
169
- return parsedOptions;
170
- };
171
-
172
- export default _parser_data;
173
-
174
- export function percentageTooltipFormatter(params) {
175
- let total = params.reduce((sum, item) => sum + item.value, 0);
176
- let tooltipContent = params
177
- .map((item) => {
178
- let percentage = ((item.value / total) * 100).toFixed(2);
179
- return `${item.marker}${item.seriesName}: ${percentage}%`;
180
- })
181
- .join('<br/>');
182
- return `${params[0].axisValueLabel}<br/>${tooltipContent}`;
183
- }
1
+ /*
2
+ * @Author : Lihao leolihao@arizona.edu
3
+ * @Date : 2023-12-02 16:52:58
4
+ * @FilePath : /visualifyjs/src/core/parser/echart.data.js
5
+ * @Description :
6
+ * Copyright (c) 2023 by Lihao (leolihao@arizona.edu), All Rights Reserved.
7
+ */
8
+ import { getArrayEl, _handleSeries } from './echart.series';
9
+ import {
10
+ _parsePeakvalley,
11
+ _parseMarkArea,
12
+ _parseMarkLine,
13
+ } from './echart.features';
14
+
15
+ const _parser_data = (options = {}, preset = {}) => {
16
+ // Parse the custom options
17
+ const parsedOptions = {
18
+ ...preset,
19
+ yAxis: { ...preset.yAxis },
20
+ xAxis: { ...preset.xAxis },
21
+ legend: { ...preset.legend },
22
+ title: { ...preset.title },
23
+ tooltip: { ...preset.tooltip },
24
+ // ... other default settings for charts
25
+ series: [],
26
+ };
27
+
28
+ // Initialize totalValues array if percentage mode is active
29
+ let totalValues = options.percentage
30
+ ? new Array(options.xAxis.length).fill(0)
31
+ : [];
32
+
33
+ // calculate total values if in percentage mode
34
+ if (options.percentage && options.data) {
35
+ Object.entries(options.data).forEach(([_, data]) => {
36
+ data.forEach((value, idx) => {
37
+ totalValues[idx] += value;
38
+ });
39
+ });
40
+ }
41
+
42
+ if (options.data && typeof options.data === 'object') {
43
+ parsedOptions.series = Object.entries(options.data).map(
44
+ ([name, data], index) => {
45
+ let seriesObject = {
46
+ name,
47
+ type: getArrayEl(options.type, index),
48
+ data,
49
+ ...(options.markArea && {
50
+ markArea: _parseMarkArea(options.markArea, index),
51
+ }),
52
+ ...(options.markLine && {
53
+ markLine: _parseMarkLine(options.markLine, index),
54
+ }),
55
+ ...(options.symbol && {
56
+ symbol: getArrayEl(options.symbol, index),
57
+ }),
58
+ ...(options.symbolSize && {
59
+ symbolSize: getArrayEl(options.symbolSize, index),
60
+ }),
61
+ ...(options.stack && {
62
+ stack: options.stack.includes(name)
63
+ ? 'total'
64
+ : getArrayEl(options.stack, index),
65
+ }),
66
+ ...(options.emphasis && {
67
+ emphasis: getArrayEl(options.emphasis, index),
68
+ }),
69
+ };
70
+
71
+ if (
72
+ options.percentage &&
73
+ (options.type === 'bar' || options.type === 'line')
74
+ ) {
75
+ seriesObject.data = seriesObject.data.map(
76
+ (value, idx) => (value / totalValues[idx]) * 100,
77
+ );
78
+ seriesObject.stack = 'total';
79
+ }
80
+
81
+ if (options.waterfall) {
82
+ if (name === 'Placeholder' || name === options.waterfall) {
83
+ seriesObject.itemStyle = {
84
+ borderColor: 'transparent',
85
+ color: 'transparent',
86
+ };
87
+ seriesObject = {
88
+ ...seriesObject,
89
+ emphasis: {
90
+ ...seriesObject?.emphasis,
91
+ itemStyle: {
92
+ borderColor: 'transparent',
93
+ color: 'transparent',
94
+ },
95
+ },
96
+ };
97
+ }
98
+ }
99
+
100
+ _parsePeakvalley(options, seriesObject);
101
+
102
+ _handleSeries(options, seriesObject, index);
103
+
104
+ return seriesObject;
105
+ },
106
+ );
107
+ }
108
+
109
+ if (
110
+ (Array.isArray(options.type) && options.type.includes('radar')) ||
111
+ options.type === 'radar'
112
+ )
113
+ parsedOptions.radar = options.radar;
114
+
115
+ // Modify yAxis for percentage display
116
+ if (options.percentage) {
117
+ parsedOptions.yAxis = {
118
+ ...parsedOptions.yAxis,
119
+ axisLabel: { formatter: '{value}%' },
120
+ max: 100,
121
+ };
122
+
123
+ parsedOptions.tooltip = {
124
+ trigger: 'axis',
125
+ formatter: percentageTooltipFormatter,
126
+ };
127
+ }
128
+
129
+ if (options.markArea || options.markLine) {
130
+ parsedOptions.tooltip = {
131
+ trigger: 'axis',
132
+ axisPointer: {
133
+ type: 'cross',
134
+ },
135
+ };
136
+ }
137
+
138
+ if (options.waterfall) {
139
+ parsedOptions.legend = {
140
+ ...parsedOptions.legend,
141
+ data: parsedOptions.series
142
+ .map((series) => series.name)
143
+ .filter((name) => name !== 'Placeholder'),
144
+ };
145
+ parsedOptions.xAxis = {
146
+ ...parsedOptions.xAxis,
147
+ splitLine: { show: false },
148
+ };
149
+
150
+ parsedOptions.tooltip = {
151
+ trigger: 'axis',
152
+ axisPointer: {
153
+ type: 'shadow',
154
+ },
155
+ formatter: function (params) {
156
+ var tar = params[1];
157
+ return (
158
+ tar.name +
159
+ '<br/>' +
160
+ tar.marker +
161
+ tar.seriesName +
162
+ ' : ' +
163
+ tar.value
164
+ );
165
+ },
166
+ };
167
+ }
168
+
169
+ return parsedOptions;
170
+ };
171
+
172
+ export default _parser_data;
173
+
174
+ export function percentageTooltipFormatter(params) {
175
+ let total = params.reduce((sum, item) => sum + item.value, 0);
176
+ let tooltipContent = params
177
+ .map((item) => {
178
+ let percentage = ((item.value / total) * 100).toFixed(2);
179
+ return `${item.marker}${item.seriesName}: ${percentage}%`;
180
+ })
181
+ .join('<br/>');
182
+ return `${params[0].axisValueLabel}<br/>${tooltipContent}`;
183
+ }