realchart 1.1.4 → 1.1.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.
@@ -657,12 +657,24 @@
657
657
  .rct-series[data-unhover] {
658
658
  opacity: 0.2 !important;
659
659
  }
660
- .rct-series .rct-point[data-hover], .rct-point[data-unhover] {
660
+ .rct-point[data-unhover] {
661
+ opacity: 0.2 !important;
662
+ }
663
+ .rct-series .rct-point[data-focus], .rct-point[data-unfocus] {
661
664
  stroke: var(--rct-focus-stroke) !important;
662
665
  stroke-width: var(--rct-focus-stroke-width) !important;
663
666
  filter: brightness(115%) !important;
664
667
  opacity: 1 !important;
665
668
  }
669
+ /** data point hover */
670
+ .rct-point-unhover {
671
+ opacity: 0.3;
672
+ transition: opacity 0.7s;
673
+ }
674
+ .rct-point-hover {
675
+ opacity: inherit;
676
+ transition: opacity 0.7s;
677
+ }
666
678
  .rct-point-labels {
667
679
  opacity: inherit;
668
680
  transition-property: opacity;
@@ -748,7 +760,7 @@
748
760
  .rct-scatter-series {
749
761
  fill-opacity: 0.7;
750
762
  }
751
- .rct-scatter-series .rct-point[data-hover] {
763
+ .rct-scatter-series .rct-point[data-focus] {
752
764
  fill-opacity: 0.9;
753
765
  }
754
766
 
@@ -772,7 +784,7 @@
772
784
  stroke: #333;
773
785
  stroke-dasharray: 2;
774
786
  }
775
- .rct-boxplot-series .rct-point[data-hover] .rct-boxplot-point-stem {
787
+ .rct-boxplot-series .rct-point[data-focus] .rct-boxplot-point-stem {
776
788
  stroke: #000;
777
789
  stroke-dasharray: none;
778
790
  stroke-width: 2px;
@@ -783,7 +795,7 @@
783
795
  stroke-width: 1;
784
796
  fill-opacity: 0.85;
785
797
  }
786
- .rct-candlestick-series .rct-point[data-hover] {
798
+ .rct-candlestick-series .rct-point[data-focus] {
787
799
  fill-opacity: 0.5;
788
800
  }
789
801
  .rct-candlestick-series .rct-point[data-decline] {
@@ -804,7 +816,7 @@
804
816
  .rct-ohlc-series .rct-point[data-decline] {
805
817
  stroke: #00f;
806
818
  }
807
- .rct-ohlc-series .rct-point[data-hover] .rct-ohlc-point-back {
819
+ .rct-ohlc-series .rct-point[data-focus] .rct-ohlc-point-back {
808
820
  fill: #0088ff20 !important;
809
821
  }
810
822
  .rct-ohlc-point-back {
@@ -834,7 +846,7 @@
834
846
  stroke: #008;
835
847
  stroke-width: 2px;
836
848
  }
837
- .rct-errorbar-series .rct-point[data-hover] .rct-errorbar-point-back {
849
+ .rct-errorbar-series .rct-point[data-focus] .rct-errorbar-point-back {
838
850
  fill: #0088ff20 !important;
839
851
  }
840
852
 
@@ -842,14 +854,17 @@
842
854
  .rct-lollipop-series {
843
855
  stroke-width: 3px;
844
856
  }
857
+ .rct-lollipop-point-bar {
858
+ shape-rendering: crispEdges;
859
+ }
845
860
  .rct-lollipop-point-marker {
846
861
  stroke: none;
847
862
  }
848
- .rct-lollipop-series .rct-point[data-hover] {
863
+ .rct-lollipop-series .rct-point[data-focus] {
849
864
  stroke: var(--rct-focus-stroke);
850
865
  stroke-width: inherit;
851
866
  }
852
- .rct-lollipop-series .rct-point[data-hover] .rct-lollipop-point-marker {
867
+ .rct-lollipop-series .rct-point[data-focus] .rct-lollipop-point-marker {
853
868
  stroke: var(--rct-focus-stroke);
854
869
  stroke-width: var(--rct-focus-stroke-width);
855
870
  }
@@ -858,14 +873,17 @@
858
873
  .rct-dumbbell-series {
859
874
  stroke-width: 3px;
860
875
  }
876
+ .rct-dumbbell-point-bar {
877
+ shape-rendering: crispEdges;
878
+ }
861
879
  .rct-dumbbell-point-marker {
862
880
  stroke: none;
863
881
  }
864
- .rct-dumbbell-series .rct-point[data-hover] {
882
+ .rct-dumbbell-series .rct-point[data-focus] {
865
883
  stroke: var(--rct-focus-stroke);
866
884
  stroke-width: inherit;
867
885
  }
868
- .rct-dumbbell-series .rct-point[data-hover] .rct-dumbbell-point-marker {
886
+ .rct-dumbbell-series .rct-point[data-focus] .rct-dumbbell-point-marker {
869
887
  stroke: var(--rct-focus-stroke);
870
888
  stroke-width: var(--rct-focus-stroke-width);
871
889
  }
@@ -874,7 +892,7 @@
874
892
  .rct-equalizer-series {
875
893
  fill-opacity: 0.9;
876
894
  }
877
- .rct-equalizer-series .rct-point[data-hover] {
895
+ .rct-equalizer-series .rct-point[data-focus] {
878
896
  filter: brightness(120%);
879
897
  }
880
898
 
@@ -887,7 +905,7 @@
887
905
  .rct-vector-series {
888
906
  stroke-width: 2px;
889
907
  }
890
- .rct-vector-series .rct-point[data-hover] {
908
+ .rct-vector-series .rct-point[data-focus] {
891
909
  stroke-width: 5px;
892
910
  }
893
911
 
@@ -914,7 +932,7 @@
914
932
  .rct-funnel-series .rct-point {
915
933
  stroke: #fff;
916
934
  }
917
- .rct-funnel-series .rct-point[data-hover] {
935
+ .rct-funnel-series .rct-point[data-focus] {
918
936
  stroke: #000;
919
937
  stroke-width: 2px;
920
938
  }
@@ -411,18 +411,30 @@
411
411
  .rct-series[data-unhover] {
412
412
  opacity: 0.2 !important;
413
413
  }
414
- .rct-series .rct-point[data-hover] {
414
+ .rct-point[data-unhover] {
415
+ opacity: 0.2 !important;
416
+ }
417
+ .rct-series .rct-point[data-focus] {
415
418
  stroke: #000 !important;
416
419
  stroke-width: 2px !important;
417
420
  filter: brightness(115%) !important;
418
421
  opacity: 1 !important;
419
422
  }
420
- .rct-point[data-unhover] {
423
+ .rct-point[data-unfocus] {
421
424
  stroke: #000 !important;
422
425
  stroke-width: 2px !important;
423
426
  filter: brightness(115%) !important;
424
427
  opacity: 1 !important;
425
428
  }
429
+ /** data point hover */
430
+ .rct-point-unhover {
431
+ opacity: 0.3;
432
+ transition: opacity 0.7s;
433
+ }
434
+ .rct-point-hover {
435
+ opacity: inherit;
436
+ transition: opacity 0.7s;
437
+ }
426
438
  .rct-point-labels {
427
439
  opacity: inherit;
428
440
  transition-property: opacity;
@@ -508,7 +520,7 @@
508
520
  .rct-scatter-series {
509
521
  fill-opacity: 0.7;
510
522
  }
511
- .rct-scatter-series .rct-point[data-hover] {
523
+ .rct-scatter-series .rct-point[data-focus] {
512
524
  fill-opacity: 0.9;
513
525
  }
514
526
 
@@ -532,7 +544,7 @@
532
544
  stroke: #333;
533
545
  stroke-dasharray: 2;
534
546
  }
535
- .rct-boxplot-series .rct-point[data-hover] .rct-boxplot-point-stem {
547
+ .rct-boxplot-series .rct-point[data-focus] .rct-boxplot-point-stem {
536
548
  stroke: #000;
537
549
  stroke-dasharray: none;
538
550
  stroke-width: 2px;
@@ -543,7 +555,7 @@
543
555
  stroke-width: 1;
544
556
  fill-opacity: 0.85;
545
557
  }
546
- .rct-candlestick-series .rct-point[data-hover] {
558
+ .rct-candlestick-series .rct-point[data-focus] {
547
559
  fill-opacity: 0.5;
548
560
  }
549
561
  .rct-candlestick-series .rct-point[data-decline] {
@@ -564,7 +576,7 @@
564
576
  .rct-ohlc-series .rct-point[data-decline] {
565
577
  stroke: #00f;
566
578
  }
567
- .rct-ohlc-series .rct-point[data-hover] .rct-ohlc-point-back {
579
+ .rct-ohlc-series .rct-point[data-focus] .rct-ohlc-point-back {
568
580
  fill: rgba(0,136,255,0.12549) !important;
569
581
  }
570
582
  .rct-ohlc-point-back {
@@ -594,7 +606,7 @@
594
606
  stroke: #008;
595
607
  stroke-width: 2px;
596
608
  }
597
- .rct-errorbar-series .rct-point[data-hover] .rct-errorbar-point-back {
609
+ .rct-errorbar-series .rct-point[data-focus] .rct-errorbar-point-back {
598
610
  fill: rgba(0,136,255,0.12549) !important;
599
611
  }
600
612
 
@@ -602,14 +614,17 @@
602
614
  .rct-lollipop-series {
603
615
  stroke-width: 3px;
604
616
  }
617
+ .rct-lollipop-point-bar {
618
+ shape-rendering: crispEdges;
619
+ }
605
620
  .rct-lollipop-point-marker {
606
621
  stroke: none;
607
622
  }
608
- .rct-lollipop-series .rct-point[data-hover] {
623
+ .rct-lollipop-series .rct-point[data-focus] {
609
624
  stroke: #000;
610
625
  stroke-width: inherit;
611
626
  }
612
- .rct-lollipop-series .rct-point[data-hover] .rct-lollipop-point-marker {
627
+ .rct-lollipop-series .rct-point[data-focus] .rct-lollipop-point-marker {
613
628
  stroke: #000;
614
629
  stroke-width: 2px;
615
630
  }
@@ -618,14 +633,17 @@
618
633
  .rct-dumbbell-series {
619
634
  stroke-width: 3px;
620
635
  }
636
+ .rct-dumbbell-point-bar {
637
+ shape-rendering: crispEdges;
638
+ }
621
639
  .rct-dumbbell-point-marker {
622
640
  stroke: none;
623
641
  }
624
- .rct-dumbbell-series .rct-point[data-hover] {
642
+ .rct-dumbbell-series .rct-point[data-focus] {
625
643
  stroke: #000;
626
644
  stroke-width: inherit;
627
645
  }
628
- .rct-dumbbell-series .rct-point[data-hover] .rct-dumbbell-point-marker {
646
+ .rct-dumbbell-series .rct-point[data-focus] .rct-dumbbell-point-marker {
629
647
  stroke: #000;
630
648
  stroke-width: 2px;
631
649
  }
@@ -634,7 +652,7 @@
634
652
  .rct-equalizer-series {
635
653
  fill-opacity: 0.9;
636
654
  }
637
- .rct-equalizer-series .rct-point[data-hover] {
655
+ .rct-equalizer-series .rct-point[data-focus] {
638
656
  filter: brightness(120%);
639
657
  }
640
658
 
@@ -647,7 +665,7 @@
647
665
  .rct-vector-series {
648
666
  stroke-width: 2px;
649
667
  }
650
- .rct-vector-series .rct-point[data-hover] {
668
+ .rct-vector-series .rct-point[data-focus] {
651
669
  stroke-width: 5px;
652
670
  }
653
671
 
@@ -674,7 +692,7 @@
674
692
  .rct-funnel-series .rct-point {
675
693
  stroke: #fff;
676
694
  }
677
- .rct-funnel-series .rct-point[data-hover] {
695
+ .rct-funnel-series .rct-point[data-focus] {
678
696
  stroke: #000;
679
697
  stroke-width: 2px;
680
698
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "realchart",
3
- "version": "1.1.4",
3
+ "version": "1.1.6",
4
4
  "description": "Wooritech charting library",
5
5
  "main": "./dist/index",
6
6
  "author": {