@visactor/vchart-extension 1.13.5-alpha.5 → 1.13.5-alpha.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/build/index.js +0 -674
  2. package/build/index.min.js +2 -2
  3. package/cjs/components/bar-link/index.js +1 -2
  4. package/cjs/components/series-label/type.js +2 -1
  5. package/cjs/index.d.ts +0 -1
  6. package/cjs/index.js +3 -3
  7. package/cjs/index.js.map +1 -1
  8. package/esm/components/bar-link/index.js +1 -2
  9. package/esm/components/series-label/type.js +2 -1
  10. package/esm/index.d.ts +0 -1
  11. package/esm/index.js +0 -2
  12. package/esm/index.js.map +1 -1
  13. package/package.json +2 -3
  14. package/cjs/charts/ranking-list/constant.d.ts +0 -2
  15. package/cjs/charts/ranking-list/constant.js +0 -74
  16. package/cjs/charts/ranking-list/constant.js.map +0 -1
  17. package/cjs/charts/ranking-list/interface.d.ts +0 -73
  18. package/cjs/charts/ranking-list/interface.js +0 -6
  19. package/cjs/charts/ranking-list/interface.js.map +0 -1
  20. package/cjs/charts/ranking-list/ranking-list-transformer.d.ts +0 -457
  21. package/cjs/charts/ranking-list/ranking-list-transformer.js +0 -374
  22. package/cjs/charts/ranking-list/ranking-list-transformer.js.map +0 -1
  23. package/cjs/charts/ranking-list/ranking-list.d.ts +0 -16
  24. package/cjs/charts/ranking-list/ranking-list.js +0 -34
  25. package/cjs/charts/ranking-list/ranking-list.js.map +0 -1
  26. package/cjs/charts/ranking-list/utils.d.ts +0 -7
  27. package/cjs/charts/ranking-list/utils.js +0 -51
  28. package/cjs/charts/ranking-list/utils.js.map +0 -1
  29. package/esm/charts/ranking-list/constant.d.ts +0 -2
  30. package/esm/charts/ranking-list/constant.js +0 -70
  31. package/esm/charts/ranking-list/constant.js.map +0 -1
  32. package/esm/charts/ranking-list/interface.d.ts +0 -73
  33. package/esm/charts/ranking-list/interface.js +0 -2
  34. package/esm/charts/ranking-list/interface.js.map +0 -1
  35. package/esm/charts/ranking-list/ranking-list-transformer.d.ts +0 -457
  36. package/esm/charts/ranking-list/ranking-list-transformer.js +0 -374
  37. package/esm/charts/ranking-list/ranking-list-transformer.js.map +0 -1
  38. package/esm/charts/ranking-list/ranking-list.d.ts +0 -16
  39. package/esm/charts/ranking-list/ranking-list.js +0 -27
  40. package/esm/charts/ranking-list/ranking-list.js.map +0 -1
  41. package/esm/charts/ranking-list/utils.d.ts +0 -7
  42. package/esm/charts/ranking-list/utils.js +0 -41
  43. package/esm/charts/ranking-list/utils.js.map +0 -1
package/build/index.js CHANGED
@@ -338,678 +338,6 @@
338
338
  }
339
339
  };
340
340
 
341
- const defaultSpec = {
342
- width: 400,
343
- height: 225,
344
- labelLayout: 'top',
345
- bar: {
346
- height: 100,
347
- style: {
348
- cornerRadius: 5
349
- }
350
- },
351
- barBackground: {
352
- type: 'rect',
353
- style: {
354
- fill: 'rgba(255,255,255,0.1)',
355
- cornerRadius: 5
356
- }
357
- },
358
- rankingIcon: {
359
- visible: true,
360
- style: {
361
- fill: 'rgba(253,253,253,0.5)',
362
- size: 12
363
- }
364
- },
365
- nameLabel: {
366
- visible: true,
367
- style: {
368
- fontSize: 20,
369
- fontWeight: 'normal',
370
- fill: 'rgba(255,255,255,0.7)',
371
- textBaseline: 'middle'
372
- }
373
- },
374
- orderLabel: {
375
- visible: true,
376
- style: {
377
- fontSize: 20,
378
- fontWeight: 'normal',
379
- fill: 'rgba(255,255,255,0.7)',
380
- textBaseline: 'middle'
381
- }
382
- },
383
- valueLabel: {
384
- visible: true,
385
- style: {
386
- fontSize: 14,
387
- fontWeight: 'normal',
388
- fill: 'rgba(255,255,255,1)',
389
- textBaseline: 'middle'
390
- }
391
- },
392
- pageSize: 5,
393
- scrollSize: 1,
394
- animationAppear: {
395
- enable: true,
396
- type: 'grow',
397
- duration: 1000,
398
- easing: 'linear'
399
- },
400
- animationUpdate: {
401
- enable: true,
402
- type: 'grow',
403
- duration: 1000,
404
- easing: 'linear'
405
- },
406
- animationNormal: {
407
- interval: 1000
408
- }
409
- };
410
-
411
- const applyVisible = (spec, keyList) => {
412
- keyList.forEach(key => {
413
- var _a, _b, _c, _d, _e, _f;
414
- if (vutils.isArray(spec[key])) {
415
- spec[key].forEach((s, i) => {
416
- var _a, _b, _c;
417
- spec[key][i] = Object.assign(Object.assign({}, s), { style: Object.assign(Object.assign({}, s === null || s === void 0 ? void 0 : s.style), { visible: (_c = (_b = (_a = s === null || s === void 0 ? void 0 : s.style) === null || _a === void 0 ? void 0 : _a.visible) !== null && _b !== void 0 ? _b : s === null || s === void 0 ? void 0 : s.visible) !== null && _c !== void 0 ? _c : true }) });
418
- });
419
- }
420
- else {
421
- spec[key] = Object.assign(Object.assign({}, spec[key]), { style: Object.assign(Object.assign({}, (_a = spec[key]) === null || _a === void 0 ? void 0 : _a.style), { visible: (_f = (_d = (_c = (_b = spec[key]) === null || _b === void 0 ? void 0 : _b.style) === null || _c === void 0 ? void 0 : _c.visible) !== null && _d !== void 0 ? _d : (_e = spec[key]) === null || _e === void 0 ? void 0 : _e.visible) !== null && _f !== void 0 ? _f : true }) });
422
- }
423
- });
424
- };
425
- const mergeObjects = (objA, objB) => {
426
- function recursiveMerge(target, source) {
427
- for (const key in source) {
428
- if (typeof source[key] === 'object' && source[key] !== null) {
429
- if (!target.hasOwnProperty(key)) {
430
- target[key] = Array.isArray(source[key]) ? [] : {};
431
- }
432
- recursiveMerge(target[key], source[key]);
433
- }
434
- else if (!target.hasOwnProperty(key) && typeof target === 'object') {
435
- target[key] = source[key];
436
- }
437
- }
438
- return target;
439
- }
440
- return recursiveMerge(objA, objB);
441
- };
442
- const computeDataRange = (data, field) => {
443
- let dataMin, dataMax;
444
- const datumX = data.map(d => d[field]).filter(d => typeof d !== 'undefined' && d !== null);
445
- if (datumX.length === 0) {
446
- dataMin = 0;
447
- dataMax = 1;
448
- }
449
- else {
450
- dataMin = Math.min(...datumX) - (Math.max(...datumX) - Math.min(...datumX)) / 3;
451
- dataMax = (Math.max(...datumX) - dataMin) / 0.8 + dataMin;
452
- const delta_value = 10;
453
- const data = dataMin;
454
- if (dataMin === dataMax) {
455
- dataMin = data - delta_value;
456
- dataMax = (4 * data + delta_value) / 4;
457
- }
458
- }
459
- return { min: dataMin, max: dataMax };
460
- };
461
-
462
- const DATA_KEY = 'dataKey';
463
- const ORDER_KEY = 'VCHART_ORDER';
464
- const SUPPLY_DATA_KEY = 'SUPPLY_DATA_KEY';
465
- const NAME_LABEL_PADDING_RIGHT = 10;
466
- const NAME_ORDER_PADDING_RIGHT = 5;
467
- const NAME_SYMBOL_PADDING_RIGHT = 8;
468
- const CHART_PADDING_LEFT = 5;
469
- const CHART_PADDING_RIGHT = 5;
470
- const VALUE_LABEL_PADDING_LEFT = 5;
471
- const LABEL_PADDING_BOTTOM = 5;
472
- class RankingListChartSpecTransformer extends vchart.CommonChartSpecTransformer {
473
- constructor() {
474
- super(...arguments);
475
- this.formatMap = {};
476
- this.paginateDataArr = (spec) => {
477
- const { scrollSize = 1, pageSize = 5 } = spec;
478
- const arr = this.originalData;
479
- const result = {};
480
- let pageOrder = 0;
481
- for (let i = 0; i < arr.length; i += scrollSize) {
482
- pageOrder++;
483
- result[`page${pageOrder}`] = arr.slice(i, i + pageSize);
484
- if (i + pageSize - 1 >= arr.length - 1) {
485
- arr.push(...Array.from({ length: i + pageSize - arr.length }, _ => {
486
- return {
487
- [spec.yField]: Math.random() * 100,
488
- [spec.xField]: null,
489
- [SUPPLY_DATA_KEY]: true
490
- };
491
- }));
492
- break;
493
- }
494
- }
495
- return {
496
- orderCount: pageOrder,
497
- result: result
498
- };
499
- };
500
- this.processRankingData = (spec) => {
501
- const result = [];
502
- spec.data.forEach((datum, index) => (datum[ORDER_KEY] = index + 1 < 10 ? `0${index + 1}` : index + 1));
503
- const pagerData = this.paginateDataArr(spec).result;
504
- const orderCount = this.paginateDataArr(spec).orderCount;
505
- const supplyCount = spec.pageSize - pagerData[`page${orderCount}`].length;
506
- pagerData[`page${orderCount}`].push(...Array.from({ length: supplyCount }, _ => {
507
- return {
508
- [spec.yField]: Math.random() * 100,
509
- [spec.xField]: null,
510
- [SUPPLY_DATA_KEY]: true
511
- };
512
- }));
513
- Object.keys(pagerData).forEach(order => {
514
- result.push({
515
- data: [
516
- {
517
- id: 'datas',
518
- values: pagerData[order].map(d => {
519
- return Object.assign(Object.assign({}, d), { [DATA_KEY]: d[spec.yField] });
520
- })
521
- },
522
- {
523
- id: 'order',
524
- values: [
525
- {
526
- order
527
- }
528
- ]
529
- }
530
- ]
531
- });
532
- });
533
- return result;
534
- };
535
- }
536
- transformSpec(spec) {
537
- super.transformSpec(spec);
538
- this.normalizeSpec(spec);
539
- this.upgradeTextMeasure(spec);
540
- this.upgradeFormatMap(spec);
541
- this.processData(spec);
542
- this.transformBaseSpec(spec);
543
- this.transformAnimationSpec(spec);
544
- this.transformAxesSpec(spec);
545
- spec.extensionMark = [
546
- this.generateBarBackground(spec),
547
- ...this.generateDecorateHaloIcons(spec),
548
- this.generateRankingIcon(spec),
549
- this.generateNameLabel(spec),
550
- this.generateOrderLabel(spec),
551
- this.generateValueLabel(spec)
552
- ];
553
- this.transformPaddingSpec(spec);
554
- super.transformSpec(spec);
555
- }
556
- normalizeSpec(spec) {
557
- mergeObjects(spec, defaultSpec);
558
- applyVisible(spec, [
559
- 'barBackground',
560
- 'rankingIcon',
561
- 'decorateHaloIcons',
562
- 'orderLabel',
563
- 'nameLabel',
564
- 'valueLabel'
565
- ]);
566
- }
567
- upgradeTextMeasure(spec) {
568
- var _a, _b, _c, _d, _e, _f, _g, _h, _j;
569
- (_a = this.nameLabelTextMeasure) === null || _a === void 0 ? void 0 : _a.release();
570
- (_b = this.valueLabelTextMeasure) === null || _b === void 0 ? void 0 : _b.release();
571
- (_c = this.orderLabelTextMeasure) === null || _c === void 0 ? void 0 : _c.release();
572
- this.nameLabelTextMeasure = new vutils.TextMeasure({
573
- defaultFontParams: (_e = (_d = spec.nameLabel) === null || _d === void 0 ? void 0 : _d.style) !== null && _e !== void 0 ? _e : {}
574
- });
575
- this.valueLabelTextMeasure = new vutils.TextMeasure({
576
- defaultFontParams: (_g = (_f = spec.valueLabel) === null || _f === void 0 ? void 0 : _f.style) !== null && _g !== void 0 ? _g : {}
577
- });
578
- this.orderLabelTextMeasure = new vutils.TextMeasure({
579
- defaultFontParams: (_j = (_h = spec.orderLabel) === null || _h === void 0 ? void 0 : _h.style) !== null && _j !== void 0 ? _j : {}
580
- });
581
- }
582
- upgradeFormatMap(spec) {
583
- this.formatMap[spec.yField] = spec.nameLabel.formatMethod;
584
- this.formatMap[spec.xField] = spec.valueLabel.formatMethod;
585
- this.formatMap[ORDER_KEY] = spec.orderLabel.formatMethod;
586
- }
587
- processData(spec) {
588
- var _a;
589
- if (!((_a = spec.data[0]) === null || _a === void 0 ? void 0 : _a.values)) {
590
- this.originalData = spec.data;
591
- this.originalSpec = vutils.cloneDeep(spec);
592
- this.dataSpecs = this.processRankingData(spec);
593
- spec.data = this.dataSpecs[0].data;
594
- }
595
- }
596
- transformBaseSpec(spec) {
597
- var _a, _b, _c;
598
- spec.type = 'common';
599
- spec.dataKey = DATA_KEY;
600
- spec.series = [
601
- {
602
- type: 'bar',
603
- direction: 'horizontal',
604
- xField: spec.xField,
605
- yField: spec.yField,
606
- barWidth: (_b = (_a = spec.bar) === null || _a === void 0 ? void 0 : _a.height) !== null && _b !== void 0 ? _b : 10,
607
- bar: Object.assign(Object.assign({}, spec.bar), { style: Object.assign(Object.assign({}, (_c = spec.bar) === null || _c === void 0 ? void 0 : _c.style), { x1: 0, visible: (datum) => {
608
- var _a, _b;
609
- if (datum[SUPPLY_DATA_KEY]) {
610
- return false;
611
- }
612
- return (_b = (_a = spec.bar) === null || _a === void 0 ? void 0 : _a.style) !== null && _b !== void 0 ? _b : true;
613
- } }) })
614
- }
615
- ];
616
- }
617
- transformAnimationSpec(spec) {
618
- var _a, _b, _c;
619
- if (spec.animationUpdate.enable) {
620
- spec.player = Object.assign(Object.assign({}, spec.player), { specs: this.dataSpecs, auto: true, visible: false, interval: ((_b = (_a = spec.animationNormal) === null || _a === void 0 ? void 0 : _a.interval) !== null && _b !== void 0 ? _b : 1000) + ((_c = spec.animationUpdate.duration) !== null && _c !== void 0 ? _c : 1000) / 2, loop: true });
621
- spec.animationExit = this.getAnimationExit(this.originalSpec);
622
- spec.animationEnter = this.getAnimationEnter(this.originalSpec);
623
- spec.animationUpdate = this.getAnimationUpdate(this.originalSpec);
624
- }
625
- spec.animationNormal = this.originalSpec.animationNormal;
626
- spec.animationAppear = this.getAnimationAppear(this.originalSpec, 'rect');
627
- }
628
- transformAxesSpec(spec) {
629
- const { min, max } = computeDataRange(this.originalData, spec.xField);
630
- spec.axes = [
631
- {
632
- orient: 'left',
633
- type: 'band',
634
- visible: false,
635
- inverse: true,
636
- paddingOuter: 0.5
637
- },
638
- {
639
- orient: 'bottom',
640
- label: { visible: true },
641
- type: 'linear',
642
- visible: false,
643
- min,
644
- max
645
- }
646
- ];
647
- }
648
- generateBarBackground(spec) {
649
- var _a;
650
- return {
651
- type: spec.barBackground.type,
652
- dataId: 'data',
653
- visible: true,
654
- dataKey: DATA_KEY,
655
- zIndex: -99,
656
- state: (_a = spec.barBackground) === null || _a === void 0 ? void 0 : _a.state,
657
- style: Object.assign(Object.assign({ x: (datum, ctx) => spec.barBackground.type === 'symbol' ? ctx.getRegion().getLayoutRect().width / 2 : 0, y: (datum, ctx) => {
658
- return (ctx.valueToY([datum[spec.yField]]) +
659
- ctx.yBandwidth() / 2 -
660
- (spec.barBackground.type === 'symbol' ? 0 : spec.bar.height / 2));
661
- }, size: (datum, ctx) => [ctx.getRegion().getLayoutRect().width, spec.bar.height], width: (datum, ctx) => ctx.getRegion().getLayoutRect().width, height: spec.bar.height }, spec.barBackground.style), { visible: (datum) => {
662
- if (datum[SUPPLY_DATA_KEY]) {
663
- return false;
664
- }
665
- return spec.barBackground.style.visible;
666
- } }),
667
- animation: true,
668
- animationEnter: this.getAnimationEnter(this.originalSpec),
669
- animationExit: this.getAnimationExit(this.originalSpec),
670
- animationAppear: this.getAnimationAppear(this.originalSpec, 'barBack'),
671
- animationUpdate: this.getAnimationUpdate(this.originalSpec)
672
- };
673
- }
674
- generateDecorateHaloIcons(spec) {
675
- var _a;
676
- return (_a = spec.decorateHaloIcons) === null || _a === void 0 ? void 0 : _a.map((decorateHaloIcon) => {
677
- return {
678
- type: 'symbol',
679
- dataId: 'data',
680
- visible: true,
681
- dataKey: DATA_KEY,
682
- state: decorateHaloIcon === null || decorateHaloIcon === void 0 ? void 0 : decorateHaloIcon.state,
683
- style: Object.assign(Object.assign({ x: (datum, ctx) => {
684
- if (datum[spec.xField] === undefined || datum[spec.xField] === null) {
685
- return undefined;
686
- }
687
- return ctx.valueToX([datum[spec.xField]]);
688
- }, y: (datum, ctx) => {
689
- return ctx.valueToY([datum[spec.yField]]) + ctx.yBandwidth() / 2;
690
- } }, decorateHaloIcon.style), { visible: (datum) => {
691
- if (datum[SUPPLY_DATA_KEY]) {
692
- return false;
693
- }
694
- return decorateHaloIcon.style.visible;
695
- } }),
696
- animation: true,
697
- animationEnter: this.getAnimationEnter(this.originalSpec),
698
- animationExit: this.getAnimationExit(this.originalSpec),
699
- animationAppear: this.getAnimationAppear(this.originalSpec, 'symbol'),
700
- animationUpdate: this.getAnimationUpdate(this.originalSpec)
701
- };
702
- });
703
- }
704
- generateRankingIcon(spec) {
705
- return {
706
- type: 'symbol',
707
- dataId: 'data',
708
- visible: true,
709
- dataKey: DATA_KEY,
710
- state: spec.rankingIcon.state,
711
- style: Object.assign(Object.assign({ x: (datum) => {
712
- if (spec.labelLayout === 'bothEnd') {
713
- return -(NAME_LABEL_PADDING_RIGHT +
714
- this.nameLabelTextMeasure.fullMeasure(this.formatDatum(spec.yField, datum)).width +
715
- (spec.orderLabel.style.visible
716
- ? NAME_ORDER_PADDING_RIGHT +
717
- this.orderLabelTextMeasure.fullMeasure(this.formatDatum(ORDER_KEY, datum)).width
718
- : 0) +
719
- NAME_SYMBOL_PADDING_RIGHT);
720
- }
721
- return CHART_PADDING_LEFT;
722
- }, y: (datum, ctx) => {
723
- if (spec.labelLayout === 'bothEnd') {
724
- return ctx.valueToY([datum[spec.yField]]) + ctx.yBandwidth() / 2;
725
- }
726
- return (ctx.valueToY([datum[spec.yField]]) +
727
- ctx.yBandwidth() / 2 -
728
- spec.bar.height / 2 -
729
- LABEL_PADDING_BOTTOM -
730
- Math.max(this.nameLabelTextMeasure.fullMeasure(this.formatDatum(spec.yField, datum)).height, this.orderLabelTextMeasure.fullMeasure(this.formatDatum(ORDER_KEY, datum)).height) /
731
- 2);
732
- } }, spec.rankingIcon.style), { lineWidth: 0, stroke: null, visible: (datum) => {
733
- if (datum[SUPPLY_DATA_KEY]) {
734
- return false;
735
- }
736
- return spec.rankingIcon.style.visible;
737
- } }),
738
- animation: true,
739
- animationEnter: this.getAnimationEnter(this.originalSpec),
740
- animationExit: this.getAnimationExit(this.originalSpec),
741
- animationAppear: this.getAnimationAppear(this.originalSpec, 'text'),
742
- animationUpdate: this.getAnimationUpdate(this.originalSpec)
743
- };
744
- }
745
- generateNameLabel(spec) {
746
- var _a;
747
- return {
748
- type: 'text',
749
- dataId: 'data',
750
- dataKey: DATA_KEY,
751
- state: (_a = spec.nameLabel) === null || _a === void 0 ? void 0 : _a.state,
752
- style: Object.assign(Object.assign({ text: (datum) => this.formatDatum(spec.yField, datum), x: () => {
753
- var _a;
754
- if (spec.labelLayout === 'bothEnd') {
755
- return -NAME_LABEL_PADDING_RIGHT;
756
- }
757
- return ((spec.rankingIcon.style.visible ? NAME_SYMBOL_PADDING_RIGHT + ((_a = spec.rankingIcon.style.size) !== null && _a !== void 0 ? _a : 10) : 0) +
758
- (spec.orderLabel.style.visible
759
- ? NAME_ORDER_PADDING_RIGHT + this.getMaxDataLabelLens(spec, ORDER_KEY, this.orderLabelTextMeasure)
760
- : 0));
761
- }, y: (datum, ctx) => {
762
- if (spec.labelLayout === 'bothEnd') {
763
- return ctx.valueToY([datum[spec.yField]]) + ctx.yBandwidth() / 2;
764
- }
765
- return ctx.valueToY([datum[spec.yField]]) + ctx.yBandwidth() / 2 - spec.bar.height / 2 - LABEL_PADDING_BOTTOM;
766
- } }, spec.nameLabel.style), { textAlign: spec.labelLayout === 'bothEnd' ? 'right' : 'left', textBaseline: spec.labelLayout === 'bothEnd' ? 'middle' : 'bottom', visible: (datum) => {
767
- if (datum[SUPPLY_DATA_KEY]) {
768
- return false;
769
- }
770
- return spec.nameLabel.style.visible;
771
- } }),
772
- animation: true,
773
- animationEnter: this.getAnimationEnter(this.originalSpec),
774
- animationExit: this.getAnimationExit(this.originalSpec),
775
- animationAppear: this.getAnimationAppear(this.originalSpec, 'text'),
776
- animationUpdate: this.getAnimationUpdate(this.originalSpec)
777
- };
778
- }
779
- generateOrderLabel(spec) {
780
- var _a;
781
- return {
782
- type: 'text',
783
- dataId: 'data',
784
- dataKey: DATA_KEY,
785
- state: (_a = spec.orderLabel) === null || _a === void 0 ? void 0 : _a.state,
786
- style: Object.assign(Object.assign({ text: (datum) => this.formatDatum(ORDER_KEY, datum), x: (datum) => {
787
- var _a;
788
- if (spec.labelLayout === 'bothEnd') {
789
- return -(NAME_LABEL_PADDING_RIGHT +
790
- this.nameLabelTextMeasure.fullMeasure(this.formatDatum(spec.yField, datum)).width +
791
- NAME_ORDER_PADDING_RIGHT);
792
- }
793
- else {
794
- return spec.rankingIcon.style.visible ? NAME_SYMBOL_PADDING_RIGHT + ((_a = spec.rankingIcon.style.size) !== null && _a !== void 0 ? _a : 10) : 0;
795
- }
796
- }, y: (datum, ctx) => {
797
- if (spec.labelLayout === 'bothEnd') {
798
- return ctx.valueToY([datum[spec.yField]]) + ctx.yBandwidth() / 2;
799
- }
800
- return ctx.valueToY([datum[spec.yField]]) + ctx.yBandwidth() / 2 - spec.bar.height / 2 - LABEL_PADDING_BOTTOM;
801
- } }, spec.orderLabel.style), { textAlign: spec.labelLayout === 'bothEnd' ? 'right' : 'left', textBaseline: spec.labelLayout === 'bothEnd' ? 'middle' : 'bottom', visible: (datum) => {
802
- if (datum[SUPPLY_DATA_KEY]) {
803
- return false;
804
- }
805
- return spec.orderLabel.style.visible;
806
- } }),
807
- animation: true,
808
- animationEnter: this.getAnimationEnter(this.originalSpec),
809
- animationExit: this.getAnimationExit(this.originalSpec),
810
- animationAppear: this.getAnimationAppear(this.originalSpec, 'text'),
811
- animationUpdate: this.getAnimationUpdate(this.originalSpec)
812
- };
813
- }
814
- generateValueLabel(spec) {
815
- var _a;
816
- return {
817
- type: 'text',
818
- dataId: 'data',
819
- visible: true,
820
- dataKey: DATA_KEY,
821
- state: (_a = spec.valueLabel) === null || _a === void 0 ? void 0 : _a.state,
822
- style: Object.assign(Object.assign({ text: (datum) => this.formatDatum(spec.xField, datum), x: (datum, ctx) => {
823
- if (spec.labelLayout === 'bothEnd') {
824
- return (ctx.getRegion().getLayoutRect().width +
825
- this.getMaxDataLabelLens(spec, spec.xField, this.nameLabelTextMeasure) +
826
- VALUE_LABEL_PADDING_LEFT);
827
- }
828
- else {
829
- return ctx.getRegion().getLayoutRect().width;
830
- }
831
- }, y: (datum, ctx) => {
832
- if (spec.labelLayout === 'bothEnd') {
833
- return ctx.valueToY([datum[spec.yField]]) + ctx.yBandwidth() / 2;
834
- }
835
- return ctx.valueToY([datum[spec.yField]]) + ctx.yBandwidth() / 2 - spec.bar.height / 2 - LABEL_PADDING_BOTTOM;
836
- } }, spec.valueLabel.style), { textAlign: spec.labelLayout === 'bothEnd' ? 'left' : 'right', textBaseline: spec.labelLayout === 'bothEnd' ? 'middle' : 'bottom', visible: (datum) => {
837
- if (datum[SUPPLY_DATA_KEY]) {
838
- return false;
839
- }
840
- return spec.valueLabel.style.visible;
841
- } }),
842
- animation: true,
843
- animationEnter: this.getAnimationEnter(this.originalSpec),
844
- animationExit: this.getAnimationExit(this.originalSpec),
845
- animationAppear: this.getAnimationAppear(this.originalSpec, 'text'),
846
- animationUpdate: this.getAnimationUpdate(this.originalSpec)
847
- };
848
- }
849
- transformPaddingSpec(spec) {
850
- var _a;
851
- const maxHaloIconSize = spec.decorateHaloIcons.length > 0
852
- ? Math.max(...spec.decorateHaloIcons.map((icon) => { var _a, _b; return (_b = (_a = icon.style) === null || _a === void 0 ? void 0 : _a.size) !== null && _b !== void 0 ? _b : 18; }))
853
- : 0;
854
- spec.padding = Object.assign({ left: spec.labelLayout === 'bothEnd'
855
- ? NAME_LABEL_PADDING_RIGHT +
856
- this.getMaxDataLabelLens(spec, spec.yField, this.nameLabelTextMeasure) +
857
- (spec.orderLabel.style.visible
858
- ? NAME_ORDER_PADDING_RIGHT + this.getMaxDataLabelLens(spec, ORDER_KEY, this.orderLabelTextMeasure)
859
- : 0) +
860
- (spec.rankingIcon.style.visible ? NAME_SYMBOL_PADDING_RIGHT + ((_a = spec.rankingIcon.style.size) !== null && _a !== void 0 ? _a : 10) : 0) +
861
- CHART_PADDING_LEFT
862
- : CHART_PADDING_LEFT + maxHaloIconSize / 2, right: spec.labelLayout === 'bothEnd'
863
- ? VALUE_LABEL_PADDING_LEFT +
864
- this.getMaxDataLabelLens(spec, spec.yField, this.valueLabelTextMeasure) +
865
- CHART_PADDING_RIGHT
866
- : CHART_PADDING_RIGHT + 10, top: 0, bottom: 0 }, spec.padding);
867
- }
868
- getMaxDataLabelLens(spec, field, textMeasure) {
869
- const textWidths = this.originalData.map(datum => datum[SUPPLY_DATA_KEY] ? 0 : textMeasure.fullMeasure(this.formatDatum(field, datum)).width);
870
- return Math.max(...textWidths);
871
- }
872
- formatDatum(field, datum) {
873
- var _a;
874
- if ((_a = this.formatMap) === null || _a === void 0 ? void 0 : _a[field]) {
875
- return this.formatMap[field](datum[field], datum);
876
- }
877
- else {
878
- return datum[field];
879
- }
880
- }
881
- getLabelWidth(padding, width) {
882
- return width + padding;
883
- }
884
- getAnimationExit(spec) {
885
- var _a, _b, _c, _d, _e;
886
- if (((_a = spec.animationUpdate) === null || _a === void 0 ? void 0 : _a.enable) === false) {
887
- return false;
888
- }
889
- return {
890
- type: 'moveOut',
891
- options: {
892
- direction: 'y',
893
- orient: 'negative',
894
- point: (datum, element) => {
895
- const channelAttr = element.getGraphicAttribute('y');
896
- const barSpace = spec.height / (spec.pageSize + 1);
897
- return { y: channelAttr - barSpace * Math.min(spec.scrollSize, spec.pageSize) };
898
- }
899
- },
900
- duration: (_c = (_b = spec.animationUpdate) === null || _b === void 0 ? void 0 : _b.duration) !== null && _c !== void 0 ? _c : 1000,
901
- easing: (_e = (_d = spec.animationUpdate) === null || _d === void 0 ? void 0 : _d.easing) !== null && _e !== void 0 ? _e : 'linear'
902
- };
903
- }
904
- getAnimationEnter(spec) {
905
- var _a, _b, _c, _d, _e;
906
- if (((_a = spec.animationUpdate) === null || _a === void 0 ? void 0 : _a.enable) === false) {
907
- return false;
908
- }
909
- return {
910
- type: 'moveIn',
911
- options: {
912
- direction: 'y',
913
- orient: 'negative',
914
- excludeChannels: ['y'],
915
- point: (datum, element) => {
916
- const channelAttr = element.getGraphicAttribute('y');
917
- return { y: channelAttr + (spec.height / (spec.pageSize + 1)) * Math.min(spec.scrollSize, spec.pageSize) };
918
- }
919
- },
920
- duration: (_c = (_b = spec.animationUpdate) === null || _b === void 0 ? void 0 : _b.duration) !== null && _c !== void 0 ? _c : 1000,
921
- easing: (_e = (_d = spec.animationUpdate) === null || _d === void 0 ? void 0 : _d.easing) !== null && _e !== void 0 ? _e : 'linear'
922
- };
923
- }
924
- getAnimationAppear(spec, markType) {
925
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
926
- if (((_a = spec.animationAppear) === null || _a === void 0 ? void 0 : _a.enable) === false) {
927
- return false;
928
- }
929
- if (markType === 'rect') {
930
- return {
931
- type: 'growWidthIn',
932
- oneByOne: false,
933
- duration: (_c = (_b = spec.animationAppear) === null || _b === void 0 ? void 0 : _b.duration) !== null && _c !== void 0 ? _c : 1000,
934
- easing: (_e = (_d = spec.animationAppear) === null || _d === void 0 ? void 0 : _d.easing) !== null && _e !== void 0 ? _e : 'linear',
935
- options: {}
936
- };
937
- }
938
- else if (markType === 'symbol') {
939
- return {
940
- channel: {
941
- x: {
942
- from: 0,
943
- to: (datum, element) => {
944
- return element.getGraphicItem().attribute.x;
945
- }
946
- }
947
- },
948
- duration: (_g = (_f = spec.animationAppear) === null || _f === void 0 ? void 0 : _f.duration) !== null && _g !== void 0 ? _g : 1000,
949
- easing: (_j = (_h = spec.animationAppear) === null || _h === void 0 ? void 0 : _h.easing) !== null && _j !== void 0 ? _j : 'linear'
950
- };
951
- }
952
- else {
953
- return {
954
- channel: {
955
- opacity: {
956
- from: 0,
957
- to: 1
958
- }
959
- },
960
- duration: (_l = (_k = spec.animationAppear) === null || _k === void 0 ? void 0 : _k.duration) !== null && _l !== void 0 ? _l : 1000,
961
- easing: (_o = (_m = spec.animationAppear) === null || _m === void 0 ? void 0 : _m.easing) !== null && _o !== void 0 ? _o : 'linear'
962
- };
963
- }
964
- }
965
- getAnimationUpdate(spec) {
966
- var _a, _b, _c, _d;
967
- if (spec.animationUpdate.enable === false) {
968
- return false;
969
- }
970
- return {
971
- duration: (_b = (_a = spec.animationUpdate) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 1000,
972
- easing: (_d = (_c = spec.animationUpdate) === null || _c === void 0 ? void 0 : _c.easing) !== null && _d !== void 0 ? _d : 'linear'
973
- };
974
- }
975
- }
976
-
977
- class RankingList extends vchart.BaseChart {
978
- constructor() {
979
- super(...arguments);
980
- this.type = 'rankingList';
981
- this.transformerConstructor = RankingListChartSpecTransformer;
982
- }
983
- init() {
984
- if (!this.isValid()) {
985
- return;
986
- }
987
- super.init();
988
- }
989
- isValid() {
990
- var _a, _b, _c, _d;
991
- const { xField, yField, data } = this._spec;
992
- if (!xField || !yField) {
993
- (_b = (_a = this._option).onError) === null || _b === void 0 ? void 0 : _b.call(_a, 'Missing Required Config: `xField`, `yField` ');
994
- return false;
995
- }
996
- if (!data) {
997
- (_d = (_c = this._option).onError) === null || _d === void 0 ? void 0 : _d.call(_c, 'Data is required');
998
- return false;
999
- }
1000
- return true;
1001
- }
1002
- }
1003
- RankingList.type = 'rankingList';
1004
- RankingList.view = 'singleDefault';
1005
- RankingList.transformerConstructor = RankingListChartSpecTransformer;
1006
- const registerRankingList = (option) => {
1007
- const vchartConstructor = (option === null || option === void 0 ? void 0 : option.VChart) || vchart.VChart;
1008
- if (vchartConstructor) {
1009
- vchartConstructor.useChart([RankingList, vchart.BarChart]);
1010
- }
1011
- };
1012
-
1013
341
  const fields = (data, options) => {
1014
342
  var _a, _b;
1015
343
  if (!(null == options ? void 0 : options.fields)) return data;
@@ -10838,7 +10166,6 @@
10838
10166
  exports.DEFAULT_ARROW_TEXT_MARK_STYLE = DEFAULT_ARROW_TEXT_MARK_STYLE;
10839
10167
  exports.DEFAULT_FUNNEL_BACKGROUND_MARK_STYLE = DEFAULT_FUNNEL_BACKGROUND_MARK_STYLE;
10840
10168
  exports.RankingBar = RankingBar;
10841
- exports.RankingList = RankingList;
10842
10169
  exports.SERIES_BREAK = SERIES_BREAK;
10843
10170
  exports.SeriesBreakComponent = SeriesBreakComponent;
10844
10171
  exports.SeriesLabelComponent = SeriesLabelComponent;
@@ -10851,7 +10178,6 @@
10851
10178
  exports.registerBarLink = registerBarLink;
10852
10179
  exports.registerConversionFunnelChart = registerConversionFunnelChart;
10853
10180
  exports.registerRankingBarChart = registerRankingBarChart;
10854
- exports.registerRankingList = registerRankingList;
10855
10181
  exports.registerSeriesBreak = registerSeriesBreak;
10856
10182
  exports.registerSeriesLabel = registerSeriesLabel;
10857
10183