@easyv/charts 1.6.9 → 1.6.11
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.
- package/lib/components/AnimateData.js +13 -22
- package/lib/components/Axis.js +106 -153
- package/lib/components/Background.js +18 -27
- package/lib/components/Band.js +78 -104
- package/lib/components/BaseLine.js +38 -52
- package/lib/components/Brush.js +31 -49
- package/lib/components/Carousel.js +20 -48
- package/lib/components/CartesianChart.js +136 -195
- package/lib/components/Chart.js +37 -59
- package/lib/components/ChartContainer.js +23 -33
- package/lib/components/ConicalGradient.js +38 -72
- package/lib/components/Control.js +61 -101
- package/lib/components/ExtentData.js +13 -22
- package/lib/components/FilterData.js +20 -32
- package/lib/components/Indicator.js +18 -26
- package/lib/components/Label.js +90 -121
- package/lib/components/Legend.js +48 -74
- package/lib/components/Lighter.js +22 -52
- package/lib/components/Line.js +41 -62
- package/lib/components/LinearGradient.js +16 -23
- package/lib/components/Mapping.js +15 -41
- package/lib/components/Marquee.js +23 -40
- package/lib/components/PieChart.js +352 -456
- package/lib/components/StackData.js +12 -23
- package/lib/components/StereoBar.js +69 -110
- package/lib/components/TextOverflow.js +17 -31
- package/lib/components/Tooltip.js +50 -65
- package/lib/components/index.js +1 -31
- package/lib/components/pieTooltip.js +46 -74
- package/lib/context/index.js +1 -4
- package/lib/css/index.module.css +1 -1
- package/lib/element/ConicGradient.js +31 -37
- package/lib/element/Line.js +11 -16
- package/lib/element/index.js +0 -2
- package/lib/formatter/index.js +0 -2
- package/lib/formatter/legend.js +48 -48
- package/lib/hooks/index.js +0 -9
- package/lib/hooks/useAiData.js +16 -27
- package/lib/hooks/useAnimateData.js +7 -21
- package/lib/hooks/useAxes.js +89 -151
- package/lib/hooks/useCarouselAxisX.js +30 -64
- package/lib/hooks/useExtentData.js +24 -65
- package/lib/hooks/useFilterData.js +16 -42
- package/lib/hooks/useStackData.js +11 -35
- package/lib/hooks/useTooltip.js +29 -47
- package/lib/index.js +2 -17
- package/lib/utils/index.js +144 -328
- package/package.json +1 -1
- package/src/css/index.module.css +1 -1
- package/src/formatter/legend.js +13 -1
- package/src/utils/index.js +13 -10
package/lib/components/Chart.js
CHANGED
|
@@ -1,95 +1,77 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports["default"] = void 0;
|
|
11
|
-
|
|
12
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
-
|
|
14
10
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
|
-
|
|
16
11
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
17
|
-
|
|
18
12
|
var _react = _interopRequireWildcard(require("react"));
|
|
19
|
-
|
|
20
13
|
var _context = require("../context");
|
|
21
|
-
|
|
22
14
|
var _ = require(".");
|
|
23
|
-
|
|
24
15
|
var _d3v = require("d3v7");
|
|
25
|
-
|
|
26
16
|
var _excluded = ["id", "type", "config", "config", "data", "onRelative", "emit", "emitEvent"];
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
function
|
|
31
|
-
|
|
17
|
+
/**
|
|
18
|
+
* 总入口,通过外面传进来的type来确定渲染哪种图表,饼环图表为“pie”,否则为轴类图表
|
|
19
|
+
*/
|
|
20
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
21
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
32
22
|
var getCallbackData = function getCallbackData(action, callbacks, data) {
|
|
33
23
|
var callbackData = {};
|
|
34
|
-
|
|
35
24
|
if (callbacks && Array.isArray(callbacks) && callbacks.length && data) {
|
|
36
25
|
callbacks.forEach(function (_ref) {
|
|
37
26
|
var origin = _ref.origin,
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
27
|
+
target = _ref.target,
|
|
28
|
+
_action = _ref.actions;
|
|
41
29
|
if (action === _action) {
|
|
42
30
|
callbackData[target] = data[origin];
|
|
43
31
|
}
|
|
44
32
|
});
|
|
45
33
|
}
|
|
46
|
-
|
|
47
34
|
return callbackData;
|
|
48
35
|
};
|
|
49
|
-
|
|
50
36
|
var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref2) {
|
|
51
37
|
var id = _ref2.id,
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
38
|
+
type = _ref2.type,
|
|
39
|
+
config = _ref2.config,
|
|
40
|
+
_ref2$config = _ref2.config,
|
|
41
|
+
axes = _ref2$config.axes,
|
|
42
|
+
_ref2$config$chart = _ref2$config.chart,
|
|
43
|
+
_ref2$config$chart$di = _ref2$config$chart.dimension.chartDimension,
|
|
44
|
+
height = _ref2$config$chart$di.height,
|
|
45
|
+
width = _ref2$config$chart$di.width,
|
|
46
|
+
_ref2$config$chart$ma = _ref2$config$chart.margin,
|
|
47
|
+
marginRight = _ref2$config$chart$ma.marginRight,
|
|
48
|
+
marginLeft = _ref2$config$chart$ma.marginLeft,
|
|
49
|
+
marginBottom = _ref2$config$chart$ma.marginBottom,
|
|
50
|
+
marginTop = _ref2$config$chart$ma.marginTop,
|
|
51
|
+
interaction = _ref2$config.interaction,
|
|
52
|
+
originData = _ref2.data,
|
|
53
|
+
onRelative = _ref2.onRelative,
|
|
54
|
+
emit = _ref2.emit,
|
|
55
|
+
emitEvent = _ref2.emitEvent,
|
|
56
|
+
props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
|
|
71
57
|
var isIOS = (0, _react.useRef)(/iPad|iPhone|iPod|iOS|CriOS/i.test(navigator.userAgent));
|
|
72
58
|
var svg = /*#__PURE__*/(0, _react.createRef)();
|
|
73
59
|
var chartWidth = width - marginLeft - marginRight;
|
|
74
60
|
var chartHeight = height - marginTop - marginBottom;
|
|
75
|
-
|
|
76
61
|
var _useState = (0, _react.useState)(true),
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
62
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
63
|
+
active = _useState2[0],
|
|
64
|
+
setActive = _useState2[1];
|
|
81
65
|
var scaleRef = (0, _react.useRef)([1, 1]);
|
|
82
66
|
var triggerOnRelative = (0, _react.useCallback)(function (action, data) {
|
|
83
67
|
if (!interaction) return;
|
|
84
68
|
var callbacks = interaction.callbacks,
|
|
85
|
-
|
|
69
|
+
remoteControls = interaction.remoteControls;
|
|
86
70
|
var callbackData = getCallbackData(action, callbacks, data);
|
|
87
|
-
|
|
88
71
|
if (JSON.stringify(callbackData) != "{}") {
|
|
89
72
|
onRelative && onRelative(id, callbackData);
|
|
90
73
|
remoteControls && emitEvent && remoteControls.forEach(function (o) {
|
|
91
74
|
var control = JSON.parse(o.control);
|
|
92
|
-
|
|
93
75
|
if (control.screen && control.type && control.type === 'callback') {
|
|
94
76
|
emitEvent({
|
|
95
77
|
screen: control.screen,
|
|
@@ -121,16 +103,13 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref2) {
|
|
|
121
103
|
}, [id, chartWidth, chartHeight, triggerOnRelative, svg, onEmit]);
|
|
122
104
|
(0, _react.useEffect)(function () {
|
|
123
105
|
var isAnimation = window.screenConfig ? window.screenConfig.isAnimation : true; //大屏的全局设置是否允许开启动画,false为不允许
|
|
124
|
-
|
|
125
106
|
if (!isAnimation) setActive(false);
|
|
126
|
-
|
|
127
107
|
var activeHandler = function activeHandler(e) {
|
|
128
108
|
var _e$dynamicData = e.dynamicData,
|
|
129
|
-
|
|
130
|
-
|
|
109
|
+
dynamicData = _e$dynamicData === void 0 ? true : _e$dynamicData;
|
|
110
|
+
// console.log("当前组件(id="+id+")状态:",dynamicData?"唤醒":"休眠");
|
|
131
111
|
isAnimation && setActive(dynamicData);
|
|
132
112
|
};
|
|
133
|
-
|
|
134
113
|
getScreenScale();
|
|
135
114
|
document.addEventListener("switchActive_".concat(id), activeHandler);
|
|
136
115
|
document.addEventListener("resize", getScreenScale);
|
|
@@ -139,7 +118,8 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref2) {
|
|
|
139
118
|
document.removeEventListener("resize", getScreenScale);
|
|
140
119
|
};
|
|
141
120
|
}, []);
|
|
142
|
-
var data = originData;
|
|
121
|
+
var data = originData;
|
|
122
|
+
//对轴类图表进行自动排序
|
|
143
123
|
// if(axes){
|
|
144
124
|
// const xAxis = axes.find(d=>d.axisType=="x");
|
|
145
125
|
// if(xAxis){
|
|
@@ -165,13 +145,12 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref2) {
|
|
|
165
145
|
config: config,
|
|
166
146
|
data: data,
|
|
167
147
|
active: active
|
|
168
|
-
}, props)));
|
|
169
|
-
|
|
148
|
+
}, props)));
|
|
149
|
+
//获取大屏缩放系数
|
|
170
150
|
function getScreenScale() {
|
|
171
151
|
setTimeout(function () {
|
|
172
152
|
//获取大屏缩放系数
|
|
173
153
|
var dom = document.getElementById("bigscreen-container") || document.getElementById("m-simulator");
|
|
174
|
-
|
|
175
154
|
if (dom) {
|
|
176
155
|
var transform = dom.style.transform;
|
|
177
156
|
var scale = transform ? transform.match(/^scale\((.+)\)$/)[1] : "1,1";
|
|
@@ -181,5 +160,4 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref2) {
|
|
|
181
160
|
}, 50);
|
|
182
161
|
}
|
|
183
162
|
});
|
|
184
|
-
var _default = Chart;
|
|
185
|
-
exports["default"] = _default;
|
|
163
|
+
var _default = exports["default"] = Chart;
|
|
@@ -1,45 +1,37 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports["default"] = void 0;
|
|
11
|
-
|
|
12
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
-
|
|
14
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
15
|
-
|
|
16
|
-
function
|
|
17
|
-
|
|
18
|
-
function
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
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; }
|
|
23
|
-
|
|
11
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
12
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
13
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
14
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /**
|
|
15
|
+
* svg外框
|
|
16
|
+
*/
|
|
24
17
|
var event = function event() {};
|
|
25
|
-
|
|
26
|
-
var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
18
|
+
var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
27
19
|
var width = _ref.width,
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
20
|
+
height = _ref.height,
|
|
21
|
+
marginLeft = _ref.marginLeft,
|
|
22
|
+
marginTop = _ref.marginTop,
|
|
23
|
+
style = _ref.style,
|
|
24
|
+
children = _ref.children,
|
|
25
|
+
_ref$onMouseEnter = _ref.onMouseEnter,
|
|
26
|
+
onMouseEnter = _ref$onMouseEnter === void 0 ? event : _ref$onMouseEnter,
|
|
27
|
+
_ref$onMouseLeave = _ref.onMouseLeave,
|
|
28
|
+
onMouseLeave = _ref$onMouseLeave === void 0 ? event : _ref$onMouseLeave,
|
|
29
|
+
_ref$onClick = _ref.onClick,
|
|
30
|
+
onClick = _ref$onClick === void 0 ? event : _ref$onClick,
|
|
31
|
+
_ref$onMouseMove = _ref.onMouseMove,
|
|
32
|
+
onMouseMove = _ref$onMouseMove === void 0 ? event : _ref$onMouseMove,
|
|
33
|
+
_ref$onMouseOut = _ref.onMouseOut,
|
|
34
|
+
onMouseOut = _ref$onMouseOut === void 0 ? event : _ref$onMouseOut;
|
|
43
35
|
return /*#__PURE__*/_react["default"].createElement("svg", {
|
|
44
36
|
className: "__easyv-svg",
|
|
45
37
|
width: width,
|
|
@@ -59,6 +51,4 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
|
|
|
59
51
|
}, /*#__PURE__*/_react["default"].createElement("g", {
|
|
60
52
|
transform: "translate(" + marginLeft + ", " + marginTop + ")"
|
|
61
53
|
}, children));
|
|
62
|
-
}));
|
|
63
|
-
|
|
64
|
-
exports["default"] = _default;
|
|
54
|
+
}));
|
|
@@ -1,72 +1,56 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports["default"] = void 0;
|
|
11
|
-
|
|
12
9
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
|
-
|
|
14
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
15
|
-
|
|
16
11
|
var _d3v = require("d3v7");
|
|
17
|
-
|
|
18
12
|
var _utils = require("@easyv/utils/lib/common/utils");
|
|
19
|
-
|
|
20
13
|
var _indexModule = _interopRequireDefault(require("../css/index.module.css"));
|
|
21
|
-
|
|
22
|
-
function
|
|
23
|
-
|
|
24
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(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; }
|
|
25
|
-
|
|
14
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
15
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
26
16
|
/**
|
|
27
17
|
* 饼图装饰内圈
|
|
28
18
|
*/
|
|
29
|
-
var _default = function _default(_ref) {
|
|
19
|
+
var _default = exports["default"] = function _default(_ref) {
|
|
30
20
|
var width = _ref.width,
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
21
|
+
height = _ref.height,
|
|
22
|
+
centerX = _ref.centerX,
|
|
23
|
+
centerY = _ref.centerY,
|
|
24
|
+
radius = _ref.radius,
|
|
25
|
+
_ref$config = _ref.config,
|
|
26
|
+
show = _ref$config.show,
|
|
27
|
+
innerRadius = _ref$config.innerRadius,
|
|
28
|
+
outerRadius = _ref$config.outerRadius,
|
|
29
|
+
opacity = _ref$config.opacity,
|
|
30
|
+
speed = _ref$config.speed,
|
|
31
|
+
direction = _ref$config.direction,
|
|
32
|
+
arcs = _ref.arcs;
|
|
43
33
|
if (!show) return null;
|
|
44
|
-
|
|
45
34
|
var _useState = (0, _react.useState)(null),
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
35
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
36
|
+
canvas = _useState2[0],
|
|
37
|
+
setCanvas = _useState2[1];
|
|
50
38
|
(0, _react.useEffect)(function () {
|
|
51
39
|
if (arcs && arcs.length > 0 && canvas && canvas.getContext('2d')) {
|
|
52
40
|
var _radius = radius * devicePixelRatio;
|
|
53
|
-
|
|
54
41
|
var context = canvas.getContext('2d');
|
|
55
42
|
context.clearRect(0, 0, width * devicePixelRatio, height * devicePixelRatio);
|
|
56
43
|
context.save();
|
|
57
44
|
context.translate(centerX * devicePixelRatio, centerY * devicePixelRatio);
|
|
58
45
|
context.beginPath();
|
|
59
|
-
|
|
60
|
-
|
|
46
|
+
var _arc = (0, _d3v.arc)().innerRadius(innerRadius * _radius).outerRadius(outerRadius * _radius)
|
|
47
|
+
// .padAngle(axis.pole.padAngle)
|
|
61
48
|
// .cornerRadius(axis.pole.cornerRadius)
|
|
62
49
|
.context(context);
|
|
63
|
-
|
|
64
50
|
arcs.forEach(function (element) {
|
|
65
51
|
var startAngle = element.arc.startAngle()();
|
|
66
52
|
var endAngle = element.arc.endAngle()();
|
|
67
|
-
|
|
68
53
|
_arc.startAngle(startAngle).endAngle(endAngle)();
|
|
69
|
-
|
|
70
54
|
context.fillStyle = 'rgba(255, 255, 255, 0)';
|
|
71
55
|
context.fill();
|
|
72
56
|
});
|
|
@@ -75,20 +59,18 @@ var _default = function _default(_ref) {
|
|
|
75
59
|
var conic = new ConicalGradient();
|
|
76
60
|
arcs.reduce(function (reduced, _ref2) {
|
|
77
61
|
var percent = _ref2.percent,
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
62
|
+
_ref2$series$color = _ref2.series.color,
|
|
63
|
+
type = _ref2$series$color.type,
|
|
64
|
+
pure = _ref2$series$color.pure,
|
|
65
|
+
stops = _ref2$series$color.linear.stops;
|
|
82
66
|
var result = reduced + percent / 100;
|
|
83
67
|
var color = type == 'pure' ? pure : stops[0].color;
|
|
84
|
-
|
|
85
68
|
if (!!color) {
|
|
86
69
|
var _converColor = (0, _utils.converColor)(color, 1),
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
70
|
+
r = _converColor.r,
|
|
71
|
+
g = _converColor.g,
|
|
72
|
+
b = _converColor.b,
|
|
73
|
+
a = _converColor.a;
|
|
92
74
|
conic.addColorStop(reduced, {
|
|
93
75
|
r: r,
|
|
94
76
|
g: g,
|
|
@@ -102,7 +84,6 @@ var _default = function _default(_ref) {
|
|
|
102
84
|
a: a
|
|
103
85
|
});
|
|
104
86
|
}
|
|
105
|
-
|
|
106
87
|
return result;
|
|
107
88
|
}, 0);
|
|
108
89
|
conic.fill(context, 0, 0, _radius, 0, 2 * Math.PI, false);
|
|
@@ -130,15 +111,10 @@ var _default = function _default(_ref) {
|
|
|
130
111
|
/**
|
|
131
112
|
* ConicalGradient
|
|
132
113
|
*/
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
exports["default"] = _default;
|
|
136
|
-
|
|
137
114
|
function ConicalGradient() {
|
|
138
115
|
this._offsets = [];
|
|
139
116
|
this._colors = [];
|
|
140
117
|
}
|
|
141
|
-
|
|
142
118
|
ConicalGradient.prototype = {
|
|
143
119
|
/**
|
|
144
120
|
* addColorStop
|
|
@@ -148,19 +124,15 @@ ConicalGradient.prototype = {
|
|
|
148
124
|
*/
|
|
149
125
|
addColorStop: function addColorStop(offset, color) {
|
|
150
126
|
this._offsets.push(offset);
|
|
151
|
-
|
|
152
127
|
this._colors.push(color);
|
|
153
|
-
|
|
154
128
|
return this;
|
|
155
129
|
},
|
|
156
|
-
|
|
157
130
|
/**
|
|
158
131
|
* _offsetsReverse (array.forEach callback)
|
|
159
132
|
*/
|
|
160
133
|
_offsetsReverse: function _offsetsReverse(offset, index, array) {
|
|
161
134
|
array[index] = 1 - offset;
|
|
162
135
|
},
|
|
163
|
-
|
|
164
136
|
/**
|
|
165
137
|
* fill
|
|
166
138
|
*
|
|
@@ -181,7 +153,6 @@ ConicalGradient.prototype = {
|
|
|
181
153
|
startAngle %= TWO_PI;
|
|
182
154
|
if (endAngle < 0) endAngle = endAngle % TWO_PI + TWO_PI;
|
|
183
155
|
endAngle %= TWO_PI;
|
|
184
|
-
|
|
185
156
|
if (anticlockwise) {
|
|
186
157
|
// 逆时针
|
|
187
158
|
var swap = startAngle;
|
|
@@ -191,11 +162,9 @@ ConicalGradient.prototype = {
|
|
|
191
162
|
offsets.reverse();
|
|
192
163
|
offsets.forEach(this._offsetsReverse);
|
|
193
164
|
}
|
|
194
|
-
|
|
195
165
|
if (startAngle > endAngle || Math.abs(endAngle - startAngle) < 0.0001) {
|
|
196
166
|
endAngle += TWO_PI;
|
|
197
167
|
}
|
|
198
|
-
|
|
199
168
|
var colorsLength = colors.length;
|
|
200
169
|
var currentColorIndex = 0;
|
|
201
170
|
var currentColor = colors[currentColorIndex];
|
|
@@ -208,22 +177,21 @@ ConicalGradient.prototype = {
|
|
|
208
177
|
var arcStartAngle = startAngle;
|
|
209
178
|
var arcEndAngle;
|
|
210
179
|
var r1 = currentColor.r,
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
180
|
+
g1 = currentColor.g,
|
|
181
|
+
b1 = currentColor.b,
|
|
182
|
+
a1 = currentColor.a,
|
|
183
|
+
r2 = nextColor.r,
|
|
184
|
+
g2 = nextColor.g,
|
|
185
|
+
b2 = nextColor.b,
|
|
186
|
+
a2 = nextColor.a;
|
|
218
187
|
if (!a1 && a1 !== 0) a1 = 1;
|
|
219
188
|
if (!a2 && a2 !== 0) a2 = 1;
|
|
220
189
|
var rd = r2 - r1,
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
190
|
+
gd = g2 - g1,
|
|
191
|
+
bd = b2 - b1,
|
|
192
|
+
ad = a2 - a1;
|
|
224
193
|
var t, r, g, b, a;
|
|
225
194
|
context.save();
|
|
226
|
-
|
|
227
195
|
for (var i = 0, n = 1 / totalAngleDeg; i < 1; i += n) {
|
|
228
196
|
if (i >= currentOffset) {
|
|
229
197
|
currentColorIndex++;
|
|
@@ -252,7 +220,6 @@ ConicalGradient.prototype = {
|
|
|
252
220
|
currentOffset = offsets[currentColorIndex];
|
|
253
221
|
offsetDist = currentOffset - prevOffset;
|
|
254
222
|
}
|
|
255
|
-
|
|
256
223
|
t = (i - prevOffset) / offsetDist;
|
|
257
224
|
r = rd * t + r1 & 255;
|
|
258
225
|
g = gd * t + g1 & 255;
|
|
@@ -267,7 +234,6 @@ ConicalGradient.prototype = {
|
|
|
267
234
|
context.fill();
|
|
268
235
|
arcStartAngle += stepAngleRad;
|
|
269
236
|
}
|
|
270
|
-
|
|
271
237
|
context.restore();
|
|
272
238
|
return this;
|
|
273
239
|
}
|