@publishfx/publish-chart 1.4.4 → 1.4.6

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.
Files changed (8) hide show
  1. package/dist/components/composite/GroupBar.js +27 -13
  2. package/dist/components/composite/GroupBarLine.js +25 -9
  3. package/dist/components/composite/GroupCompare.js +66 -3
  4. package/dist/components/composite/GroupLine.js +17 -4
  5. package/dist/components/composite/GroupLineCompare.js +17 -4
  6. package/dist/components/composite/MultipleCompareLine.js +19 -5
  7. package/dist/components/composite/MultipleLine.js +19 -5
  8. package/package.json +4 -2
package/dist/components/composite/GroupBar.js CHANGED
@@ -123,14 +123,6 @@ const GroupBar = ({ height, data, x = 'groupName', y = '', legend = 'groupType',
123
123
  isDataTag,
124
124
  horPaddingRight
125
125
  ]);
126
- const scale = {
127
- [yAxis]: {
128
- min: 0,
129
- max: maxY,
130
- type: 'linear-strict',
131
- nice: true
132
- }
133
- };
134
126
  const topLabel = {};
135
127
  dv.rows.forEach((item)=>{
136
128
  const infos = [
@@ -180,11 +172,31 @@ const GroupBar = ({ height, data, x = 'groupName', y = '', legend = 'groupType',
180
172
  });
181
173
  return Array.from(uniqueMap.values());
182
174
  }, [
183
- transformData
175
+ transformData,
176
+ legend
184
177
  ]);
185
178
  const axisHorPadding = useMemo(()=>getAxisHorPaddingByText(maxY, indicatorMap, y) - 25, [
186
179
  maxY
187
180
  ]);
181
+ const finalXAxisValues = useMemo(()=>{
182
+ const allXValues = transformData.map((item)=>item[x]);
183
+ return Array.from(new Set(allXValues));
184
+ }, [
185
+ transformData,
186
+ x
187
+ ]);
188
+ const scale = {
189
+ [yAxis]: {
190
+ min: 0,
191
+ max: maxY,
192
+ type: 'linear-strict',
193
+ nice: true
194
+ },
195
+ [x]: {
196
+ type: 'cat',
197
+ values: finalXAxisValues
198
+ }
199
+ };
188
200
  return /*#__PURE__*/ jsxs(Chart, {
189
201
  height: height || 300,
190
202
  data: transformData,
@@ -397,10 +409,12 @@ const GroupBar = ({ height, data, x = 'groupName', y = '', legend = 'groupType',
397
409
  scale: {
398
410
  node: {
399
411
  min: 0,
400
- max: 1
412
+ max: 1,
413
+ nice: false
401
414
  },
402
- groupName: {
403
- type: 'cat'
415
+ [x]: {
416
+ type: 'cat',
417
+ values: finalXAxisValues
404
418
  }
405
419
  },
406
420
  children: [
@@ -409,7 +423,7 @@ const GroupBar = ({ height, data, x = 'groupName', y = '', legend = 'groupType',
409
423
  visible: false
410
424
  }),
411
425
  /*#__PURE__*/ jsx(Axis, {
412
- name: "groupName",
426
+ name: x,
413
427
  visible: false
414
428
  }),
415
429
  /*#__PURE__*/ jsx(Legend, {
package/dist/components/composite/GroupBarLine.js CHANGED
@@ -125,12 +125,28 @@ const GroupBarLine = ({ height = 300, data, x = "groupName", y = "", legend = "g
125
125
  const maxYLeft = Math.max(maxLeft, leftAuxi && Math.max(...leftAuxi.map((item)=>+item.value)) || 0);
126
126
  const maxYRightValue = Math.max(maxRight, rightAuxi && Math.max(...rightAuxi.map((item)=>+item.value)) || 0);
127
127
  const maxYRight = maxYRightValue !== maxRight && rightAuxi && rightAuxi.length > 0 ? 1.2 * Math.max(...rightAuxi.map((item)=>+item.value)) : maxYRightValue;
128
+ if (isDescend) {
129
+ leftData.sort((a, b)=>b["total"] - a["total"]);
130
+ rightData.sort((a, b)=>sortData.indexOf(a[x]) - sortData.indexOf(b[x]));
131
+ } else rightData.sort((a, b)=>sortData.indexOf(a[x]) - sortData.indexOf(b[x]));
132
+ const finalXAxisValues = useMemo(()=>{
133
+ const allXValues = leftData.map((item)=>item[x]);
134
+ return Array.from(new Set(allXValues));
135
+ }, [
136
+ leftData,
137
+ x,
138
+ isDescend
139
+ ]);
128
140
  const scale = {
129
141
  groupValue: {
130
142
  type: "linear-strict",
131
143
  min: 0,
132
144
  nice: true,
133
145
  max: maxYLeft
146
+ },
147
+ [x]: {
148
+ type: 'cat',
149
+ values: finalXAxisValues
134
150
  }
135
151
  };
136
152
  useEffect(()=>{
@@ -161,10 +177,6 @@ const GroupBarLine = ({ height = 300, data, x = "groupName", y = "", legend = "g
161
177
  }
162
178
  };
163
179
  let chartIns;
164
- if (isDescend) {
165
- leftData.sort((a, b)=>b["total"] - a["total"]);
166
- rightData.sort((a, b)=>sortData.indexOf(a[x]) - sortData.indexOf(b[x]));
167
- } else rightData.sort((a, b)=>sortData.indexOf(a[x]) - sortData.indexOf(b[x]));
168
180
  const legendValues = Array.from(new Set(leftData.map((v)=>v.groupType)));
169
181
  const legendItem = legendValues.map((v, i)=>({
170
182
  id: `${v}_bar`,
@@ -216,7 +228,8 @@ const GroupBarLine = ({ height = 300, data, x = "groupName", y = "", legend = "g
216
228
  });
217
229
  return Array.from(uniqueMap.values());
218
230
  }, [
219
- transformData
231
+ transformData,
232
+ legend
220
233
  ]);
221
234
  return /*#__PURE__*/ jsxs(Chart, {
222
235
  height: height,
@@ -551,19 +564,22 @@ const GroupBarLine = ({ height = 300, data, x = "groupName", y = "", legend = "g
551
564
  scale: {
552
565
  node: {
553
566
  min: 0,
554
- max: 1
567
+ max: 1,
568
+ nice: false
555
569
  },
556
- groupName: {
557
- type: 'cat'
570
+ [x]: {
571
+ type: 'cat',
572
+ values: finalXAxisValues
558
573
  }
559
574
  },
575
+ padding: 0,
560
576
  children: [
561
577
  /*#__PURE__*/ jsx(Axis, {
562
578
  name: "node",
563
579
  visible: false
564
580
  }),
565
581
  /*#__PURE__*/ jsx(Axis, {
566
- name: "groupName",
582
+ name: x,
567
583
  visible: false
568
584
  }),
569
585
  /*#__PURE__*/ jsx(Legend, {
package/dist/components/composite/GroupCompare.js CHANGED
@@ -26,6 +26,8 @@ const GroupCompare = ({ height = 300, data, x = "", y = "", indicatorMap, onChar
26
26
  const BAR_PADDING_RIGHT = mergedConfig.layout.barPaddingRight || 10;
27
27
  const HOR_BAR_PADDING_RIGHT = mergedConfig.layout.horBarPaddingRight || 50;
28
28
  const { isDescend = false, isLegend = true, isHorizontal = false, isDataTag = false, isHighlight = true } = config || {};
29
+ console.log('isLegend', isLegend);
30
+ console.log('config', config);
29
31
  const [chartInsWidth, setChartInsWidth] = useState(0);
30
32
  const [mainBarSize, setMainBarSize] = useState(void 0);
31
33
  const [backgroundHeight, setBackgroundHeight] = useState(1000);
@@ -201,6 +203,30 @@ const GroupCompare = ({ height = 300, data, x = "", y = "", indicatorMap, onChar
201
203
  const axisHorPadding = useMemo(()=>getAxisHorPaddingByText(maxY, indicatorMap, y) - 22, [
202
204
  maxY
203
205
  ]);
206
+ const nodeViewData = useMemo(()=>{
207
+ const uniqueMap = new Map();
208
+ transformData.forEach((item)=>{
209
+ const hasNode = (item?.nodeInfos?.info?.length || 0) > 0 || (item?.nodeInfos?.infosCompare?.length || 0) > 0;
210
+ if (hasNode && !uniqueMap.has(item.groupName)) uniqueMap.set(item.groupName, {
211
+ groupName: item.groupName,
212
+ node: 0,
213
+ nodeInfos: item.nodeInfos,
214
+ color: item.color,
215
+ [legend]: 'NodeEvent'
216
+ });
217
+ });
218
+ return Array.from(uniqueMap.values());
219
+ }, [
220
+ transformData,
221
+ legend
222
+ ]);
223
+ const finalXAxisValues = useMemo(()=>{
224
+ const allXValues = transformData.map((item)=>item[x]);
225
+ return Array.from(new Set(allXValues));
226
+ }, [
227
+ transformData,
228
+ x
229
+ ]);
204
230
  return /*#__PURE__*/ jsxs(Chart, {
205
231
  height: height,
206
232
  data: transformData,
@@ -241,6 +267,10 @@ const GroupCompare = ({ height = 300, data, x = "", y = "", indicatorMap, onChar
241
267
  type: "linear-strict",
242
268
  max: maxY,
243
269
  nice: true
270
+ },
271
+ [x]: {
272
+ type: 'cat',
273
+ values: finalXAxisValues
244
274
  }
245
275
  },
246
276
  children: [
@@ -590,10 +620,43 @@ const GroupCompare = ({ height = 300, data, x = "", y = "", indicatorMap, onChar
590
620
  } catch (error) {}
591
621
  }
592
622
  }),
623
+ /*#__PURE__*/ jsx(Legend, {
624
+ name: "color",
625
+ visible: false
626
+ }),
593
627
  transformData.some((item)=>item?.nodeInfos?.info?.length > 0 || item?.nodeInfos?.infosCompare?.length > 0) ? /*#__PURE__*/ jsx(Fragment, {
594
- children: 1 == nodeSetting.showType && NodeGeom ? /*#__PURE__*/ jsx(NodeGeom, {
595
- pointData: pointData,
596
- pointP: pointP
628
+ children: 1 == nodeSetting.showType && NodeGeom ? /*#__PURE__*/ jsxs(View, {
629
+ data: nodeViewData,
630
+ scale: {
631
+ node: {
632
+ min: 0,
633
+ max: 1,
634
+ nice: false
635
+ },
636
+ [x]: {
637
+ type: 'cat',
638
+ values: finalXAxisValues
639
+ }
640
+ },
641
+ children: [
642
+ /*#__PURE__*/ jsx(Axis, {
643
+ name: "node",
644
+ visible: false
645
+ }),
646
+ /*#__PURE__*/ jsx(Axis, {
647
+ name: x,
648
+ visible: false
649
+ }),
650
+ /*#__PURE__*/ jsx(Legend, {
651
+ name: "color",
652
+ visible: false
653
+ }),
654
+ /*#__PURE__*/ jsx(NodeGeom, {
655
+ pointData: pointData,
656
+ pointP: pointP,
657
+ isLegend: isLegend
658
+ })
659
+ ]
597
660
  }) : 2 == nodeSetting.showType && NodeDetail ? 0 == chartOffset || chartOffset ? /*#__PURE__*/ jsx(NodeDetail, {
598
661
  chartWidth: chartWidth,
599
662
  chartOffset: chartOffset,
package/dist/components/composite/GroupLine.js CHANGED
@@ -103,11 +103,19 @@ const GroupLine = ({ height, data, x = 'groupName', y = '', legend = 'groupType'
103
103
  });
104
104
  return Array.from(uniqueMap.values());
105
105
  }, [
106
- transformData
106
+ transformData,
107
+ legend
107
108
  ]);
108
109
  const axisHorPadding = useMemo(()=>getAxisHorPaddingByText(maxY, indicatorMap, y) - 22, [
109
110
  maxY
110
111
  ]);
112
+ const finalXAxisValues = useMemo(()=>{
113
+ const allXValues = transformData.map((item)=>item[x]);
114
+ return Array.from(new Set(allXValues));
115
+ }, [
116
+ transformData,
117
+ x
118
+ ]);
111
119
  return /*#__PURE__*/ jsxs(Chart, {
112
120
  height: height || 300,
113
121
  data: transformData,
@@ -118,6 +126,10 @@ const GroupLine = ({ height, data, x = 'groupName', y = '', legend = 'groupType'
118
126
  type: 'linear',
119
127
  max: maxY,
120
128
  nice: true
129
+ },
130
+ [x]: {
131
+ type: 'cat',
132
+ values: finalXAxisValues
121
133
  }
122
134
  },
123
135
  onPointMouseover: (e)=>{
@@ -284,8 +296,9 @@ const GroupLine = ({ height, data, x = 'groupName', y = '', legend = 'groupType'
284
296
  min: 0,
285
297
  max: 1
286
298
  },
287
- groupName: {
288
- type: 'cat'
299
+ [x]: {
300
+ type: 'cat',
301
+ values: finalXAxisValues
289
302
  }
290
303
  },
291
304
  children: [
@@ -294,7 +307,7 @@ const GroupLine = ({ height, data, x = 'groupName', y = '', legend = 'groupType'
294
307
  visible: false
295
308
  }),
296
309
  /*#__PURE__*/ jsx(Axis, {
297
- name: "groupName",
310
+ name: x,
298
311
  visible: false
299
312
  }),
300
313
  /*#__PURE__*/ jsx(Legend, {
package/dist/components/composite/GroupLineCompare.js CHANGED
@@ -207,11 +207,19 @@ const GroupLineCompare = ({ height, data, x = 'groupName', y = '', legend = 'gro
207
207
  });
208
208
  return Array.from(uniqueMap.values());
209
209
  }, [
210
- transformData
210
+ transformData,
211
+ legend
211
212
  ]);
212
213
  const axisHorPadding = useMemo(()=>getAxisHorPaddingByText(maxY, indicatorMap, y) - 22, [
213
214
  maxY
214
215
  ]);
216
+ const finalXAxisValues = useMemo(()=>{
217
+ const allXValues = transformData.map((item)=>item[x]);
218
+ return Array.from(new Set(allXValues));
219
+ }, [
220
+ transformData,
221
+ x
222
+ ]);
215
223
  return /*#__PURE__*/ jsxs(Chart, {
216
224
  height: height || 300,
217
225
  data: transformData,
@@ -222,6 +230,10 @@ const GroupLineCompare = ({ height, data, x = 'groupName', y = '', legend = 'gro
222
230
  type: 'linear',
223
231
  max: maxY,
224
232
  nice: true
233
+ },
234
+ [x]: {
235
+ type: 'cat',
236
+ values: finalXAxisValues
225
237
  }
226
238
  },
227
239
  onPointMouseover: (e)=>{
@@ -470,8 +482,9 @@ const GroupLineCompare = ({ height, data, x = 'groupName', y = '', legend = 'gro
470
482
  min: 0,
471
483
  max: 1
472
484
  },
473
- groupName: {
474
- type: 'cat'
485
+ [x]: {
486
+ type: 'cat',
487
+ values: finalXAxisValues
475
488
  }
476
489
  },
477
490
  children: [
@@ -480,7 +493,7 @@ const GroupLineCompare = ({ height, data, x = 'groupName', y = '', legend = 'gro
480
493
  visible: false
481
494
  }),
482
495
  /*#__PURE__*/ jsx(Axis, {
483
- name: "groupName",
496
+ name: x,
484
497
  visible: false
485
498
  }),
486
499
  /*#__PURE__*/ jsx(Legend, {
package/dist/components/composite/MultipleCompareLine.js CHANGED
@@ -96,11 +96,19 @@ const MultipleCompareLine = ({ height, data, x = 'groupName', legend = 'groupTyp
96
96
  });
97
97
  return Array.from(uniqueMap.values());
98
98
  }, [
99
- transformData
99
+ transformData,
100
+ legend
100
101
  ]);
101
102
  const axisHorPadding = useMemo(()=>getAxisHorPaddingByText(maxY, indicatorMap, '') - 22, [
102
103
  maxY
103
104
  ]);
105
+ const finalXAxisValues = useMemo(()=>{
106
+ const allXValues = transformData.map((item)=>item[x]);
107
+ return Array.from(new Set(allXValues));
108
+ }, [
109
+ transformData,
110
+ x
111
+ ]);
104
112
  return /*#__PURE__*/ jsxs(Chart, {
105
113
  height: height || 300,
106
114
  data: transformData,
@@ -109,6 +117,10 @@ const MultipleCompareLine = ({ height, data, x = 'groupName', legend = 'groupTyp
109
117
  type: 'linear',
110
118
  max: maxY,
111
119
  nice: true
120
+ },
121
+ [x]: {
122
+ type: 'cat',
123
+ values: finalXAxisValues
112
124
  }
113
125
  },
114
126
  ...defaultChartConfig.baseChartConfig,
@@ -328,10 +340,12 @@ const MultipleCompareLine = ({ height, data, x = 'groupName', legend = 'groupTyp
328
340
  scale: {
329
341
  node: {
330
342
  min: 0,
331
- max: 1
343
+ max: 1,
344
+ nice: false
332
345
  },
333
- groupName: {
334
- type: 'cat'
346
+ [x]: {
347
+ type: 'cat',
348
+ values: finalXAxisValues
335
349
  }
336
350
  },
337
351
  children: [
@@ -340,7 +354,7 @@ const MultipleCompareLine = ({ height, data, x = 'groupName', legend = 'groupTyp
340
354
  visible: false
341
355
  }),
342
356
  /*#__PURE__*/ jsx(Axis, {
343
- name: "groupName",
357
+ name: x,
344
358
  visible: false
345
359
  }),
346
360
  /*#__PURE__*/ jsx(Legend, {
package/dist/components/composite/MultipleLine.js CHANGED
@@ -96,11 +96,19 @@ const MultipleLine = ({ height, data, x = 'groupName', legend = 'groupType', ind
96
96
  });
97
97
  return Array.from(uniqueMap.values());
98
98
  }, [
99
- transformData
99
+ transformData,
100
+ legend
100
101
  ]);
101
102
  const axisHorPadding = useMemo(()=>getAxisHorPaddingByText(maxY, indicatorMap, '') - 22, [
102
103
  maxY
103
104
  ]);
105
+ const finalXAxisValues = useMemo(()=>{
106
+ const allXValues = transformData.map((item)=>item[x]);
107
+ return Array.from(new Set(allXValues));
108
+ }, [
109
+ transformData,
110
+ x
111
+ ]);
104
112
  return /*#__PURE__*/ jsxs(Chart, {
105
113
  height: height || 300,
106
114
  data: transformData,
@@ -109,6 +117,10 @@ const MultipleLine = ({ height, data, x = 'groupName', legend = 'groupType', ind
109
117
  type: 'linear',
110
118
  max: maxY,
111
119
  nice: true
120
+ },
121
+ [x]: {
122
+ type: 'cat',
123
+ values: finalXAxisValues
112
124
  }
113
125
  },
114
126
  ...defaultChartConfig.baseChartConfig,
@@ -285,10 +297,12 @@ const MultipleLine = ({ height, data, x = 'groupName', legend = 'groupType', ind
285
297
  scale: {
286
298
  node: {
287
299
  min: 0,
288
- max: 1
300
+ max: 1,
301
+ nice: false
289
302
  },
290
- groupName: {
291
- type: 'cat'
303
+ [x]: {
304
+ type: 'cat',
305
+ values: finalXAxisValues
292
306
  }
293
307
  },
294
308
  children: [
@@ -297,7 +311,7 @@ const MultipleLine = ({ height, data, x = 'groupName', legend = 'groupType', ind
297
311
  visible: false
298
312
  }),
299
313
  /*#__PURE__*/ jsx(Axis, {
300
- name: "groupName",
314
+ name: x,
301
315
  visible: false
302
316
  }),
303
317
  /*#__PURE__*/ jsx(Legend, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@publishfx/publish-chart",
3
- "version": "1.4.4",
3
+ "version": "1.4.6",
4
4
  "description": "A React chart component library for the Publish platform, including BarChart, LineChart, BarLineChart and other visualization components",
5
5
  "type": "module",
6
6
  "keywords": [
@@ -20,7 +20,9 @@
20
20
  },
21
21
  "types": "./dist/index.d.ts",
22
22
  "files": [
23
- "dist"
23
+ "dist",
24
+ "CHANGELOG.md",
25
+ "README.md"
24
26
  ],
25
27
  "devDependencies": {
26
28
  "@antv/data-set": "^0.11.8",