@easyv/charts 1.2.6 → 1.2.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 (91) hide show
  1. package/.babelrc +8 -8
  2. package/.husky/commit-msg +3 -3
  3. package/CHANGELOG.md +18 -18
  4. package/lib/components/AnimateData.js +7 -11
  5. package/lib/components/Axis.js +14 -18
  6. package/lib/components/Background.js +2 -2
  7. package/lib/components/Band.js +4 -8
  8. package/lib/components/BaseLine.js +7 -9
  9. package/lib/components/Brush.js +2 -2
  10. package/lib/components/Carousel.js +8 -15
  11. package/lib/components/CartesianChart.js +7 -11
  12. package/lib/components/Chart.js +6 -9
  13. package/lib/components/ChartContainer.js +4 -8
  14. package/lib/components/ConicalGradient.js +23 -27
  15. package/lib/components/ExtentData.js +4 -7
  16. package/lib/components/FilterData.js +4 -7
  17. package/lib/components/Indicator.js +2 -2
  18. package/lib/components/Label.js +2 -2
  19. package/lib/components/Legend.js +5 -11
  20. package/lib/components/Lighter.js +179 -179
  21. package/lib/components/Line.js +5 -11
  22. package/lib/components/LinearGradient.js +2 -2
  23. package/lib/components/Mapping.js +5 -8
  24. package/lib/components/Marquee.js +5 -5
  25. package/lib/components/PieChart.js +12 -22
  26. package/lib/components/StackData.js +4 -7
  27. package/lib/components/StereoBar.js +4 -8
  28. package/lib/components/TextOverflow.js +5 -5
  29. package/lib/components/Tooltip.js +2 -2
  30. package/lib/components/index.js +49 -49
  31. package/lib/css/index.module.css +41 -41
  32. package/lib/css/piechart.module.css +26 -26
  33. package/lib/element/ConicGradient.js +72 -72
  34. package/lib/formatter/legend.js +2 -2
  35. package/lib/hooks/index.js +14 -14
  36. package/lib/hooks/useAnimateData.js +7 -7
  37. package/lib/hooks/useAxes.js +7 -7
  38. package/lib/hooks/useCarouselAxisX.js +7 -7
  39. package/lib/hooks/useExtentData.js +8 -8
  40. package/lib/hooks/useFilterData.js +8 -8
  41. package/lib/hooks/useStackData.js +8 -10
  42. package/lib/hooks/useTooltip.js +10 -10
  43. package/lib/index.js +2 -6
  44. package/lib/utils/index.js +5 -8
  45. package/package.json +53 -53
  46. package/src/components/AnimateData.tsx +24 -24
  47. package/src/components/Axis.tsx +354 -354
  48. package/src/components/Background.tsx +45 -45
  49. package/src/components/Band.tsx +173 -173
  50. package/src/components/BaseLine.js +76 -76
  51. package/src/components/Brush.js +159 -159
  52. package/src/components/Carousel.tsx +144 -144
  53. package/src/components/Chart.js +99 -99
  54. package/src/components/ChartContainer.tsx +63 -63
  55. package/src/components/ConicalGradient.js +258 -258
  56. package/src/components/ExtentData.js +17 -17
  57. package/src/components/FilterData.js +23 -23
  58. package/src/components/Indicator.js +13 -13
  59. package/src/components/Label.js +206 -206
  60. package/src/components/Legend.js +158 -158
  61. package/src/components/Lighter.jsx +173 -173
  62. package/src/components/Line.js +144 -144
  63. package/src/components/LinearGradient.js +29 -29
  64. package/src/components/Mapping.js +71 -71
  65. package/src/components/Marquee.js +93 -93
  66. package/src/components/PieChart.js +1287 -1288
  67. package/src/components/StackData.js +20 -20
  68. package/src/components/StereoBar.tsx +310 -310
  69. package/src/components/TextOverflow.js +51 -51
  70. package/src/components/Tooltip.js +169 -169
  71. package/src/components/index.js +55 -55
  72. package/src/context/index.js +2 -2
  73. package/src/css/index.module.css +41 -41
  74. package/src/css/piechart.module.css +26 -26
  75. package/src/element/ConicGradient.jsx +55 -55
  76. package/src/element/Line.tsx +33 -33
  77. package/src/element/index.ts +3 -3
  78. package/src/formatter/index.js +1 -1
  79. package/src/formatter/legend.js +90 -90
  80. package/src/hooks/index.js +17 -17
  81. package/src/hooks/useAnimateData.ts +67 -67
  82. package/src/hooks/useAxes.js +144 -144
  83. package/src/hooks/useCarouselAxisX.js +163 -163
  84. package/src/hooks/useExtentData.js +88 -88
  85. package/src/hooks/useFilterData.js +72 -72
  86. package/src/hooks/useStackData.js +100 -100
  87. package/src/hooks/useTooltip.ts +96 -96
  88. package/src/index.js +6 -6
  89. package/src/types/index.d.ts +67 -67
  90. package/src/utils/index.js +714 -714
  91. package/tsconfig.json +22 -22
@@ -17,20 +17,17 @@ var _react = require("react");
17
17
 
18
18
  var _hooks = require("../hooks");
19
19
 
20
- var _excluded = ["series"],
21
- _excluded2 = ["config", "data"];
20
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
22
21
 
23
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
24
-
25
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
22
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
26
23
 
27
24
  var _default = function _default(Component) {
28
25
  return /*#__PURE__*/(0, _react.memo)(function (_ref) {
29
26
  var _ref$config = _ref.config,
30
27
  series = _ref$config.series,
31
- config = (0, _objectWithoutProperties2["default"])(_ref$config, _excluded),
28
+ config = (0, _objectWithoutProperties2["default"])(_ref$config, ["series"]),
32
29
  data = _ref.data,
33
- props = (0, _objectWithoutProperties2["default"])(_ref, _excluded2);
30
+ props = (0, _objectWithoutProperties2["default"])(_ref, ["config", "data"]);
34
31
 
35
32
  var _series = (0, _hooks.useStackData)({
36
33
  series: series,
@@ -1,8 +1,8 @@
1
1
  "use strict";
2
2
 
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
4
 
5
- var _typeof3 = require("@babel/runtime/helpers/typeof");
5
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
6
 
7
7
  Object.defineProperty(exports, "__esModule", {
8
8
  value: true
@@ -23,13 +23,9 @@ var _d3v = require("d3v7");
23
23
 
24
24
  var _utils = require("../utils");
25
25
 
26
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
27
-
28
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
29
-
30
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
26
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
31
27
 
32
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
28
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
33
29
 
34
30
  var getHighlightData = function getHighlightData(data, extent) {
35
31
  switch (extent) {
@@ -13,13 +13,13 @@ var _react = require("react");
13
13
 
14
14
  var _Marquee = _interopRequireDefault(require("./Marquee"));
15
15
 
16
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
16
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
17
17
 
18
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
18
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
19
19
 
20
- /**
21
- * 文本溢出组件
22
- * eg: <TextOverflow type={溢出形式} value={文本内容} speed={跑马灯速度} style={额外样式}></Marquee>
20
+ /**
21
+ * 文本溢出组件
22
+ * eg: <TextOverflow type={溢出形式} value={文本内容} speed={跑马灯速度} style={额外样式}></Marquee>
23
23
  */
24
24
  var _default = /*#__PURE__*/(0, _react.memo)(function (props) {
25
25
  var type = props.type,
@@ -13,9 +13,9 @@ var _react = require("react");
13
13
 
14
14
  var _utils = require("../utils");
15
15
 
16
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
16
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
17
17
 
18
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
18
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
19
19
 
20
20
  var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
21
21
  var position = _ref.x,
@@ -5,143 +5,142 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- Object.defineProperty(exports, "AnimateData", {
8
+ Object.defineProperty(exports, "Mapping", {
9
9
  enumerable: true,
10
10
  get: function get() {
11
- return _AnimateData["default"];
11
+ return _Mapping["default"];
12
12
  }
13
13
  });
14
- exports.Area = void 0;
15
- Object.defineProperty(exports, "Axis", {
14
+ Object.defineProperty(exports, "AnimateData", {
16
15
  enumerable: true,
17
16
  get: function get() {
18
- return _Axis["default"];
17
+ return _AnimateData["default"];
19
18
  }
20
19
  });
21
- Object.defineProperty(exports, "Background", {
20
+ Object.defineProperty(exports, "FilterData", {
22
21
  enumerable: true,
23
22
  get: function get() {
24
- return _Background["default"];
23
+ return _FilterData["default"];
25
24
  }
26
25
  });
27
- Object.defineProperty(exports, "Band", {
26
+ Object.defineProperty(exports, "ExtentData", {
28
27
  enumerable: true,
29
28
  get: function get() {
30
- return _Band["default"];
29
+ return _ExtentData["default"];
31
30
  }
32
31
  });
33
- Object.defineProperty(exports, "BaseLine", {
32
+ Object.defineProperty(exports, "StackData", {
34
33
  enumerable: true,
35
34
  get: function get() {
36
- return _BaseLine["default"];
35
+ return _StackData["default"];
37
36
  }
38
37
  });
39
- Object.defineProperty(exports, "Brush", {
38
+ Object.defineProperty(exports, "ChartContainer", {
40
39
  enumerable: true,
41
40
  get: function get() {
42
- return _Brush["default"];
41
+ return _ChartContainer["default"];
43
42
  }
44
43
  });
45
- Object.defineProperty(exports, "Carousel", {
44
+ Object.defineProperty(exports, "Legend", {
46
45
  enumerable: true,
47
46
  get: function get() {
48
- return _Carousel["default"];
47
+ return _Legend["default"];
49
48
  }
50
49
  });
51
- Object.defineProperty(exports, "CartesianChart", {
50
+ Object.defineProperty(exports, "Axis", {
52
51
  enumerable: true,
53
52
  get: function get() {
54
- return _CartesianChart["default"];
53
+ return _Axis["default"];
55
54
  }
56
55
  });
57
- Object.defineProperty(exports, "Chart", {
56
+ Object.defineProperty(exports, "Tooltip", {
58
57
  enumerable: true,
59
58
  get: function get() {
60
- return _Chart["default"];
59
+ return _Tooltip["default"];
61
60
  }
62
61
  });
63
- Object.defineProperty(exports, "ChartContainer", {
62
+ Object.defineProperty(exports, "Indicator", {
64
63
  enumerable: true,
65
64
  get: function get() {
66
- return _ChartContainer["default"];
65
+ return _Indicator["default"];
67
66
  }
68
67
  });
69
- Object.defineProperty(exports, "ConicalGradient", {
68
+ Object.defineProperty(exports, "Band", {
70
69
  enumerable: true,
71
70
  get: function get() {
72
- return _ConicalGradient["default"];
71
+ return _Band["default"];
73
72
  }
74
73
  });
75
- Object.defineProperty(exports, "ExtentData", {
74
+ Object.defineProperty(exports, "Lighter", {
76
75
  enumerable: true,
77
76
  get: function get() {
78
- return _ExtentData["default"];
77
+ return _Lighter["default"];
79
78
  }
80
79
  });
81
- Object.defineProperty(exports, "FilterData", {
80
+ Object.defineProperty(exports, "Line", {
82
81
  enumerable: true,
83
82
  get: function get() {
84
- return _FilterData["default"];
83
+ return _Line["default"];
85
84
  }
86
85
  });
87
- Object.defineProperty(exports, "Indicator", {
86
+ Object.defineProperty(exports, "Background", {
88
87
  enumerable: true,
89
88
  get: function get() {
90
- return _Indicator["default"];
89
+ return _Background["default"];
91
90
  }
92
91
  });
93
- Object.defineProperty(exports, "Label", {
92
+ Object.defineProperty(exports, "LinearGradient", {
94
93
  enumerable: true,
95
94
  get: function get() {
96
- return _Label["default"];
95
+ return _LinearGradient["default"];
97
96
  }
98
97
  });
99
- Object.defineProperty(exports, "Legend", {
98
+ Object.defineProperty(exports, "Brush", {
100
99
  enumerable: true,
101
100
  get: function get() {
102
- return _Legend["default"];
101
+ return _Brush["default"];
103
102
  }
104
103
  });
105
- Object.defineProperty(exports, "Lighter", {
104
+ Object.defineProperty(exports, "Label", {
106
105
  enumerable: true,
107
106
  get: function get() {
108
- return _Lighter["default"];
107
+ return _Label["default"];
109
108
  }
110
109
  });
111
- Object.defineProperty(exports, "Line", {
110
+ Object.defineProperty(exports, "StereoBar", {
112
111
  enumerable: true,
113
112
  get: function get() {
114
- return _Line["default"];
113
+ return _StereoBar["default"];
115
114
  }
116
115
  });
117
- Object.defineProperty(exports, "LinearGradient", {
116
+ Object.defineProperty(exports, "Carousel", {
118
117
  enumerable: true,
119
118
  get: function get() {
120
- return _LinearGradient["default"];
119
+ return _Carousel["default"];
121
120
  }
122
121
  });
123
- Object.defineProperty(exports, "Mapping", {
122
+ Object.defineProperty(exports, "Chart", {
124
123
  enumerable: true,
125
124
  get: function get() {
126
- return _Mapping["default"];
125
+ return _Chart["default"];
127
126
  }
128
127
  });
129
- Object.defineProperty(exports, "PieChart", {
128
+ Object.defineProperty(exports, "ConicalGradient", {
130
129
  enumerable: true,
131
130
  get: function get() {
132
- return _PieChart["default"];
131
+ return _ConicalGradient["default"];
133
132
  }
134
133
  });
135
- Object.defineProperty(exports, "StackData", {
134
+ Object.defineProperty(exports, "CartesianChart", {
136
135
  enumerable: true,
137
136
  get: function get() {
138
- return _StackData["default"];
137
+ return _CartesianChart["default"];
139
138
  }
140
139
  });
141
- Object.defineProperty(exports, "StereoBar", {
140
+ Object.defineProperty(exports, "PieChart", {
142
141
  enumerable: true,
143
142
  get: function get() {
144
- return _StereoBar["default"];
143
+ return _PieChart["default"];
145
144
  }
146
145
  });
147
146
  Object.defineProperty(exports, "TextOverflow", {
@@ -150,12 +149,13 @@ Object.defineProperty(exports, "TextOverflow", {
150
149
  return _TextOverflow["default"];
151
150
  }
152
151
  });
153
- Object.defineProperty(exports, "Tooltip", {
152
+ Object.defineProperty(exports, "BaseLine", {
154
153
  enumerable: true,
155
154
  get: function get() {
156
- return _Tooltip["default"];
155
+ return _BaseLine["default"];
157
156
  }
158
157
  });
158
+ exports.Area = void 0;
159
159
 
160
160
  var _Mapping = _interopRequireDefault(require("./Mapping"));
161
161
 
@@ -1,42 +1,42 @@
1
- .rotateClockwise {
2
- animation-name: rotateClockwise;
3
- }
4
-
5
- @keyframes rotateClockwise {
6
- 0% {
7
- transform: rotate(0deg);
8
- }
9
- 100% {
10
- transform: rotate(360deg);
11
- }
12
- }
13
-
14
- .rotateCounterClockwise {
15
- animation-name: rotateCounterClockwise;
16
- }
17
-
18
- @keyframes rotateCounterClockwise {
19
- 0% {
20
- transform: rotate(360deg);
21
- }
22
- 100% {
23
- transform: rotate(0deg);
24
- }
25
- }
26
-
27
- .showAllStyle {
28
- display: grid;
29
- width: 100%;
30
- grid-template-columns: 40% 30% 30%;
31
- align-items: center;
32
- flex-direction: row;
33
- justify-content: space-between;
34
- }
35
-
36
- .notShowAllStyle {
37
- display: flex;
38
- width: 100%;
39
- align-items: center;
40
- flex-direction: row;
41
- justify-content: space-between;
1
+ .rotateClockwise {
2
+ animation-name: rotateClockwise;
3
+ }
4
+
5
+ @keyframes rotateClockwise {
6
+ 0% {
7
+ transform: rotate(0deg);
8
+ }
9
+ 100% {
10
+ transform: rotate(360deg);
11
+ }
12
+ }
13
+
14
+ .rotateCounterClockwise {
15
+ animation-name: rotateCounterClockwise;
16
+ }
17
+
18
+ @keyframes rotateCounterClockwise {
19
+ 0% {
20
+ transform: rotate(360deg);
21
+ }
22
+ 100% {
23
+ transform: rotate(0deg);
24
+ }
25
+ }
26
+
27
+ .showAllStyle {
28
+ display: grid;
29
+ width: 100%;
30
+ grid-template-columns: 40% 30% 30%;
31
+ align-items: center;
32
+ flex-direction: row;
33
+ justify-content: space-between;
34
+ }
35
+
36
+ .notShowAllStyle {
37
+ display: flex;
38
+ width: 100%;
39
+ align-items: center;
40
+ flex-direction: row;
41
+ justify-content: space-between;
42
42
  }
@@ -1,27 +1,27 @@
1
- /*甜甜圈图专用css*/
2
- .label-line {
3
- stroke-dasharray: 100;
4
- stroke-dashoffset: 100;
5
- animation: dash 800ms ease forwards;
6
- }
7
-
8
- .label-text {
9
- opacity: 0;
10
- animation: show 800ms ease forwards;
11
- }
12
-
13
- .inner-arc {
14
- animation: dash 2s ease forwards;
15
- }
16
-
17
- @keyframes dash {
18
- 100% {
19
- stroke-dashoffset: 0%;
20
- }
21
- }
22
-
23
- @keyframes show {
24
- 100% {
25
- opacity: 1;
26
- }
1
+ /*甜甜圈图专用css*/
2
+ .label-line {
3
+ stroke-dasharray: 100;
4
+ stroke-dashoffset: 100;
5
+ animation: dash 800ms ease forwards;
6
+ }
7
+
8
+ .label-text {
9
+ opacity: 0;
10
+ animation: show 800ms ease forwards;
11
+ }
12
+
13
+ .inner-arc {
14
+ animation: dash 2s ease forwards;
15
+ }
16
+
17
+ @keyframes dash {
18
+ 100% {
19
+ stroke-dashoffset: 0%;
20
+ }
21
+ }
22
+
23
+ @keyframes show {
24
+ 100% {
25
+ opacity: 1;
26
+ }
27
27
  }
@@ -1,73 +1,73 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = ConicGradient;
9
-
10
- var d3 = _interopRequireWildcard(require("d3"));
11
-
12
- //只支持在svg中使用
13
- //在<clipPath>标签中绘制圆环路径,在<foreignObject>中使用conic-gradient来制作角向渐变
14
- //然后在foreignObject中调用clipPath来剪切dom元素,实现环形渐变效果
15
- function ConicGradient(props) {
16
- var gradientId = props.gradientId,
17
- _props$colorConfig = props.colorConfig,
18
- colorConfig = _props$colorConfig === void 0 ? {} : _props$colorConfig,
19
- _props$circleConfig = props.circleConfig,
20
- circleConfig = _props$circleConfig === void 0 ? {} : _props$circleConfig,
21
- _colorConfig$colorTyp = colorConfig.colorType,
22
- colorType = _colorConfig$colorTyp === void 0 ? "linear" : _colorConfig$colorTyp,
23
- _colorConfig$colors = colorConfig.colors,
24
- colors = _colorConfig$colors === void 0 ? [{
25
- offset: 0,
26
- color: "rgba(255,0,0,0.5)"
27
- }, {
28
- offset: 50,
29
- color: "rgba(0,255,0,0.5)"
30
- }, {
31
- offset: 100,
32
- color: "rgba(0,0,255,0.5)"
33
- }] : _colorConfig$colors,
34
- _circleConfig$innerRa = circleConfig.innerRadius,
35
- innerRadius = _circleConfig$innerRa === void 0 ? 80 : _circleConfig$innerRa,
36
- _circleConfig$outerRa = circleConfig.outerRadius,
37
- outerRadius = _circleConfig$outerRa === void 0 ? 100 : _circleConfig$outerRa,
38
- _circleConfig$startAn = circleConfig.startAngle,
39
- startAngle = _circleConfig$startAn === void 0 ? 0 : _circleConfig$startAn,
40
- _circleConfig$endAngl = circleConfig.endAngle,
41
- endAngle = _circleConfig$endAngl === void 0 ? 360 : _circleConfig$endAngl,
42
- _circleConfig$cornerR = circleConfig.cornerRadius,
43
- cornerRadius = _circleConfig$cornerR === void 0 ? 0 : _circleConfig$cornerR,
44
- _circleConfig$padAngl = circleConfig.padAngle,
45
- padAngle = _circleConfig$padAngl === void 0 ? 0 : _circleConfig$padAngl;
46
- var arc = d3.arc().innerRadius(innerRadius).outerRadius(outerRadius).startAngle(startAngle * Math.PI / 180).endAngle(endAngle * Math.PI / 180).cornerRadius(cornerRadius).padAngle(padAngle);
47
- return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("clipPath", {
48
- id: "" + gradientId,
49
- style: {
50
- transform: "translate(50%,50%)"
51
- }
52
- }, /*#__PURE__*/React.createElement("path", {
53
- d: arc()
54
- })), /*#__PURE__*/React.createElement("foreignObject", {
55
- style: {
56
- width: "100%",
57
- height: "100%",
58
- transform: "translate(-50%,-50%)",
59
- background: colorType === "pure" ? colors : "conic-gradient(".concat(colorsToString(colors), ")"),
60
- clipPath: "url(".concat('#' + gradientId, ")")
61
- }
62
- }));
63
- }
64
-
65
- function colorsToString(colors) {
66
- var s = "";
67
- colors.sort(function (a, b) {
68
- return a.offset - b.offset;
69
- }).map(function (d) {
70
- s = s + d.color + " " + d.offset + "%,";
71
- });
72
- return s.slice(0, -1);
1
+ "use strict";
2
+
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports["default"] = ConicGradient;
9
+
10
+ var d3 = _interopRequireWildcard(require("d3"));
11
+
12
+ //只支持在svg中使用
13
+ //在<clipPath>标签中绘制圆环路径,在<foreignObject>中使用conic-gradient来制作角向渐变
14
+ //然后在foreignObject中调用clipPath来剪切dom元素,实现环形渐变效果
15
+ function ConicGradient(props) {
16
+ var gradientId = props.gradientId,
17
+ _props$colorConfig = props.colorConfig,
18
+ colorConfig = _props$colorConfig === void 0 ? {} : _props$colorConfig,
19
+ _props$circleConfig = props.circleConfig,
20
+ circleConfig = _props$circleConfig === void 0 ? {} : _props$circleConfig,
21
+ _colorConfig$colorTyp = colorConfig.colorType,
22
+ colorType = _colorConfig$colorTyp === void 0 ? "linear" : _colorConfig$colorTyp,
23
+ _colorConfig$colors = colorConfig.colors,
24
+ colors = _colorConfig$colors === void 0 ? [{
25
+ offset: 0,
26
+ color: "rgba(255,0,0,0.5)"
27
+ }, {
28
+ offset: 50,
29
+ color: "rgba(0,255,0,0.5)"
30
+ }, {
31
+ offset: 100,
32
+ color: "rgba(0,0,255,0.5)"
33
+ }] : _colorConfig$colors,
34
+ _circleConfig$innerRa = circleConfig.innerRadius,
35
+ innerRadius = _circleConfig$innerRa === void 0 ? 80 : _circleConfig$innerRa,
36
+ _circleConfig$outerRa = circleConfig.outerRadius,
37
+ outerRadius = _circleConfig$outerRa === void 0 ? 100 : _circleConfig$outerRa,
38
+ _circleConfig$startAn = circleConfig.startAngle,
39
+ startAngle = _circleConfig$startAn === void 0 ? 0 : _circleConfig$startAn,
40
+ _circleConfig$endAngl = circleConfig.endAngle,
41
+ endAngle = _circleConfig$endAngl === void 0 ? 360 : _circleConfig$endAngl,
42
+ _circleConfig$cornerR = circleConfig.cornerRadius,
43
+ cornerRadius = _circleConfig$cornerR === void 0 ? 0 : _circleConfig$cornerR,
44
+ _circleConfig$padAngl = circleConfig.padAngle,
45
+ padAngle = _circleConfig$padAngl === void 0 ? 0 : _circleConfig$padAngl;
46
+ var arc = d3.arc().innerRadius(innerRadius).outerRadius(outerRadius).startAngle(startAngle * Math.PI / 180).endAngle(endAngle * Math.PI / 180).cornerRadius(cornerRadius).padAngle(padAngle);
47
+ return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("clipPath", {
48
+ id: "" + gradientId,
49
+ style: {
50
+ transform: "translate(50%,50%)"
51
+ }
52
+ }, /*#__PURE__*/React.createElement("path", {
53
+ d: arc()
54
+ })), /*#__PURE__*/React.createElement("foreignObject", {
55
+ style: {
56
+ width: "100%",
57
+ height: "100%",
58
+ transform: "translate(-50%,-50%)",
59
+ background: colorType === "pure" ? colors : "conic-gradient(".concat(colorsToString(colors), ")"),
60
+ clipPath: "url(".concat('#' + gradientId, ")")
61
+ }
62
+ }));
63
+ }
64
+
65
+ function colorsToString(colors) {
66
+ var s = "";
67
+ colors.sort(function (a, b) {
68
+ return a.offset - b.offset;
69
+ }).map(function (d) {
70
+ s = s + d.color + " " + d.offset + "%,";
71
+ });
72
+ return s.slice(0, -1);
73
73
  }
@@ -13,9 +13,9 @@ var _indexModule = _interopRequireDefault(require("../css/index.module.css"));
13
13
 
14
14
  var _utils = require("../utils");
15
15
 
16
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
16
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
17
17
 
18
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
18
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
19
19
 
20
20
  var pieLegendFormatter = function pieLegendFormatter(_ref, _ref2) {
21
21
  var displayName = _ref.displayName,