@easyv/charts 1.8.15 → 1.8.17
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/Band.js +356 -356
- package/lib/components/Carousel.js +31 -21
- package/lib/components/Label.js +356 -356
- package/lib/components/Legend.js +312 -312
- package/lib/components/PieChart.js +8 -6
- package/lib/components/pieTooltip.js +202 -202
- package/lib/utils/index.js +823 -822
- package/package.json +1 -1
- package/src/components/Band.tsx +1 -1
- package/src/components/PieChart.js +36 -9
- package/src/utils/index.js +1 -0
|
@@ -607,7 +607,8 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
|
|
|
607
607
|
}))), tooltip && mousePos && mousePos.x != 0 && mousePos.y != 0 && tooltip.manual && /*#__PURE__*/_react["default"].createElement("div", {
|
|
608
608
|
style: {
|
|
609
609
|
position: "absolute",
|
|
610
|
-
zIndex: 9999
|
|
610
|
+
zIndex: 9999,
|
|
611
|
+
pointerEvents: "none"
|
|
611
612
|
}
|
|
612
613
|
}, /*#__PURE__*/_react["default"].createElement(_PieTooltip.PieTooltip, {
|
|
613
614
|
series: series,
|
|
@@ -774,7 +775,8 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
|
|
|
774
775
|
}), tooltip && mousePos && mousePos.x != 0 && mousePos.y != 0 && tooltip.manual && /*#__PURE__*/_react["default"].createElement("div", {
|
|
775
776
|
style: {
|
|
776
777
|
position: "absolute",
|
|
777
|
-
zIndex: 9999
|
|
778
|
+
zIndex: 9999,
|
|
779
|
+
pointerEvents: "none"
|
|
778
780
|
}
|
|
779
781
|
}, /*#__PURE__*/_react["default"].createElement(_PieTooltip.PieTooltip, {
|
|
780
782
|
series: series,
|
|
@@ -1051,7 +1053,7 @@ var Label = function Label(_ref10) {
|
|
|
1051
1053
|
})
|
|
1052
1054
|
}), showValue && /*#__PURE__*/_react["default"].createElement("span", {
|
|
1053
1055
|
style: _objectSpread(_objectSpread({}, (0, _utils.getFontStyle)(valueFont)), {}, {
|
|
1054
|
-
|
|
1056
|
+
color: valueSameColor ? pure : valueFont.color
|
|
1055
1057
|
})
|
|
1056
1058
|
}, data.y, showSuffix && /*#__PURE__*/_react["default"].createElement("span", {
|
|
1057
1059
|
style: {
|
|
@@ -1062,7 +1064,7 @@ var Label = function Label(_ref10) {
|
|
|
1062
1064
|
}
|
|
1063
1065
|
}, text)), showPercent && /*#__PURE__*/_react["default"].createElement("span", {
|
|
1064
1066
|
style: _objectSpread(_objectSpread({}, (0, _utils.getFontStyle)(percentFont)), {}, {
|
|
1065
|
-
|
|
1067
|
+
color: percentSameColor ? pure : percentFont.color
|
|
1066
1068
|
})
|
|
1067
1069
|
}, (_showValue ? "(" : "") + percent + "%" + (_showValue ? ")" : "")))));
|
|
1068
1070
|
}));
|
|
@@ -1210,7 +1212,7 @@ var RingLabel = function RingLabel(_ref12) {
|
|
|
1210
1212
|
}), showValue && /*#__PURE__*/_react["default"].createElement("span", {
|
|
1211
1213
|
style: _objectSpread(_objectSpread({}, (0, _utils.getFontStyle)(valueFont)), {}, {
|
|
1212
1214
|
transform: getTranslate(valueTranslate, x3 >= 0),
|
|
1213
|
-
|
|
1215
|
+
color: valueSameColor ? pure : valueFont.color
|
|
1214
1216
|
})
|
|
1215
1217
|
}, realData.y, showSuffix && /*#__PURE__*/_react["default"].createElement("span", {
|
|
1216
1218
|
style: {
|
|
@@ -1222,7 +1224,7 @@ var RingLabel = function RingLabel(_ref12) {
|
|
|
1222
1224
|
}, text)), showPercent && /*#__PURE__*/_react["default"].createElement("span", {
|
|
1223
1225
|
style: _objectSpread(_objectSpread({}, (0, _utils.getFontStyle)(percentFont)), {}, {
|
|
1224
1226
|
transform: getTranslate(percentTranslate, x3 >= 0),
|
|
1225
|
-
|
|
1227
|
+
color: percentSameColor ? pure : percentFont.color
|
|
1226
1228
|
})
|
|
1227
1229
|
}, (_showValue ? "(" : "") + percent + "%" + (_showValue ? ")" : "")))));
|
|
1228
1230
|
}));
|
|
@@ -1,203 +1,203 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.PieTooltip = void 0;
|
|
9
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
10
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
-
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
12
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
13
|
-
var _utils = require("../utils");
|
|
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; }
|
|
16
|
-
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; }
|
|
17
|
-
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; }
|
|
18
|
-
var PieTooltip = exports.PieTooltip = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
19
|
-
var mousePos = props.mousePos,
|
|
20
|
-
domRef = props.domRef,
|
|
21
|
-
pieCenter = props.pieCenter,
|
|
22
|
-
_props$config$tip = props.config.tip,
|
|
23
|
-
_props$config$tip$dat = _props$config$tip.data,
|
|
24
|
-
lineHeight = _props$config$tip$dat.lineHeight,
|
|
25
|
-
iconSize = _props$config$tip$dat.iconSize,
|
|
26
|
-
name = _props$config$tip$dat.name,
|
|
27
|
-
_props$config$tip$dat2 = _props$config$tip$dat.value,
|
|
28
|
-
valueIsShow = _props$config$tip$dat2.show,
|
|
29
|
-
valueFont = _props$config$tip$dat2.fontStyle,
|
|
30
|
-
valueSuffix = _props$config$tip$dat2.suffix,
|
|
31
|
-
valueSuffixIsShow = _props$config$tip$dat2.suffix.show,
|
|
32
|
-
_props$config$tip$dat3 = _props$config$tip$dat.percentage,
|
|
33
|
-
percentageIsShow = _props$config$tip$dat3.show,
|
|
34
|
-
percentageFont = _props$config$tip$dat3.fontStyle,
|
|
35
|
-
percentageSuffix = _props$config$tip$dat3.suffix,
|
|
36
|
-
percentageSuffixIsShow = _props$config$tip$dat3.suffix.show,
|
|
37
|
-
precision = _props$config$tip$dat3.precision,
|
|
38
|
-
image = _props$config$tip.image,
|
|
39
|
-
margin = _props$config$tip.margin,
|
|
40
|
-
_props$config$tip$siz = _props$config$tip.size,
|
|
41
|
-
tipWidth = _props$config$tip$siz.width,
|
|
42
|
-
tipHeight = _props$config$tip$siz.height,
|
|
43
|
-
translateTip = _props$config$tip.translate,
|
|
44
|
-
data = props.data,
|
|
45
|
-
series = props.series;
|
|
46
|
-
var screenRef = domRef.current.getBoundingClientRect();
|
|
47
|
-
var Item = function Item() {
|
|
48
|
-
var _data$data = data.data,
|
|
49
|
-
s = _data$data.s,
|
|
50
|
-
y = _data$data.y,
|
|
51
|
-
percent = data.percent;
|
|
52
|
-
var _find = (0, _toConsumableArray2["default"])(series.values()).find(function (series) {
|
|
53
|
-
return series.name == s;
|
|
54
|
-
}),
|
|
55
|
-
type = _find.type,
|
|
56
|
-
icon = _find.icon,
|
|
57
|
-
displayName = _find.displayName;
|
|
58
|
-
var renderSuffix = function renderSuffix(suffix) {
|
|
59
|
-
var content = suffix.content,
|
|
60
|
-
suffiixFont = suffix.font,
|
|
61
|
-
suffixTranslate = suffix.translate;
|
|
62
|
-
return /*#__PURE__*/_react["default"].createElement("span", {
|
|
63
|
-
style: _objectSpread(_objectSpread({}, (0, _utils.getFontStyle)(suffiixFont)), {}, {
|
|
64
|
-
display: "inline-block",
|
|
65
|
-
transform: (0, _utils.getTranslate3d)(suffixTranslate)
|
|
66
|
-
})
|
|
67
|
-
}, content);
|
|
68
|
-
};
|
|
69
|
-
var _icon = (0, _utils.getIcon)(type, icon);
|
|
70
|
-
return /*#__PURE__*/_react["default"].createElement("dd", {
|
|
71
|
-
style: {
|
|
72
|
-
display: 'flex',
|
|
73
|
-
justifyContent: 'space-between',
|
|
74
|
-
lineHeight: lineHeight + 'px'
|
|
75
|
-
}
|
|
76
|
-
}, /*#__PURE__*/_react["default"].createElement("span", {
|
|
77
|
-
style: {
|
|
78
|
-
// border: '1px solid red',
|
|
79
|
-
display: 'flex',
|
|
80
|
-
alignItems: 'center',
|
|
81
|
-
gap: icon.iconGap
|
|
82
|
-
}
|
|
83
|
-
}, /*#__PURE__*/_react["default"].createElement("span", {
|
|
84
|
-
style: _objectSpread(_objectSpread({}, _icon), {}, {
|
|
85
|
-
width: iconSize + 'px',
|
|
86
|
-
height: iconSize + 'px'
|
|
87
|
-
})
|
|
88
|
-
}), /*#__PURE__*/_react["default"].createElement("span", {
|
|
89
|
-
style: (0, _utils.getFontStyle)(name)
|
|
90
|
-
}, displayName || s)), valueIsShow && /*#__PURE__*/_react["default"].createElement("span", {
|
|
91
|
-
style: (0, _utils.getFontStyle)(valueFont)
|
|
92
|
-
}, y, valueSuffixIsShow && renderSuffix(valueSuffix)), percentageIsShow && /*#__PURE__*/_react["default"].createElement("span", {
|
|
93
|
-
style: (0, _utils.getFontStyle)(percentageFont)
|
|
94
|
-
}, Number(percent).toFixed(precision), percentageSuffixIsShow && renderSuffix(percentageSuffix)));
|
|
95
|
-
};
|
|
96
|
-
var getBigScreenScale = function getBigScreenScale() {
|
|
97
|
-
// 优先使用全局提供的方法
|
|
98
|
-
if (typeof window.getScreenScale === 'function') {
|
|
99
|
-
try {
|
|
100
|
-
var _result = window.getScreenScale();
|
|
101
|
-
if (Array.isArray(_result) && _result.length >= 6) {
|
|
102
|
-
return _result;
|
|
103
|
-
}
|
|
104
|
-
} catch (e) {
|
|
105
|
-
console.error('调用全局 getScreenScale 出错:', e);
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
// 获取容器元素
|
|
110
|
-
var bigscreenDom = document.getElementById('bigscreen-container');
|
|
111
|
-
|
|
112
|
-
// 元素不存在时的处理
|
|
113
|
-
if (!bigscreenDom) {
|
|
114
|
-
console.warn('未找到 bigscreen-container 元素,使用视口尺寸');
|
|
115
|
-
return [1, 1, window.innerWidth, window.innerHeight, 0, 0];
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
// 确保元素可见(未被隐藏)
|
|
119
|
-
var isVisible = window.getComputedStyle(bigscreenDom).display !== 'none' && window.getComputedStyle(bigscreenDom).visibility !== 'hidden';
|
|
120
|
-
if (!isVisible) {
|
|
121
|
-
console.warn('bigscreen-container 元素不可见,使用视口尺寸');
|
|
122
|
-
return [1, 1, window.innerWidth, window.innerHeight, 0, 0];
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
// 获取元素的布局矩形(最可靠的尺寸获取方式)
|
|
126
|
-
var rect = bigscreenDom.getBoundingClientRect();
|
|
127
|
-
|
|
128
|
-
// 提取基础尺寸(从布局矩形获取,不受样式影响)
|
|
129
|
-
var screenWidth = rect.width || window.innerWidth;
|
|
130
|
-
var screenHeight = rect.height || window.innerHeight;
|
|
131
|
-
var screenLeft = rect.left || 0;
|
|
132
|
-
var screenTop = rect.top || 0;
|
|
133
|
-
|
|
134
|
-
// 处理缩放
|
|
135
|
-
var scaleX = 1;
|
|
136
|
-
var scaleY = 1;
|
|
137
|
-
try {
|
|
138
|
-
var computedStyle = window.getComputedStyle(bigscreenDom);
|
|
139
|
-
var transform = computedStyle.transform;
|
|
140
|
-
if (transform && transform !== 'none') {
|
|
141
|
-
// 解析 transform matrix
|
|
142
|
-
var matrix = new DOMMatrix(transform);
|
|
143
|
-
scaleX = matrix.a; // 缩放X因子
|
|
144
|
-
scaleY = matrix.d; // 缩放Y因子
|
|
145
|
-
}
|
|
146
|
-
} catch (e) {
|
|
147
|
-
console.error('解析缩放样式出错:', e);
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
// 最终返回值(确保不会有undefined)
|
|
151
|
-
var result = [isNaN(scaleX) ? 1 : scaleX, isNaN(scaleY) ? 1 : scaleY, isNaN(screenWidth) ? window.innerWidth : screenWidth, isNaN(screenHeight) ? window.innerHeight : screenHeight, isNaN(screenLeft) ? 0 : screenLeft, isNaN(screenTop) ? 0 : screenTop];
|
|
152
|
-
return result;
|
|
153
|
-
};
|
|
154
|
-
var _getBigScreenScale = getBigScreenScale(),
|
|
155
|
-
_getBigScreenScale2 = (0, _slicedToArray2["default"])(_getBigScreenScale, 6),
|
|
156
|
-
scaleX = _getBigScreenScale2[0],
|
|
157
|
-
scaleY = _getBigScreenScale2[1],
|
|
158
|
-
screenWidth = _getBigScreenScale2[2],
|
|
159
|
-
screenHeight = _getBigScreenScale2[3],
|
|
160
|
-
screenLeft = _getBigScreenScale2[4],
|
|
161
|
-
screenTop = _getBigScreenScale2[5];
|
|
162
|
-
var x = mousePos.x,
|
|
163
|
-
y = mousePos.y;
|
|
164
|
-
var mouseX = x / scaleX;
|
|
165
|
-
var mouseY = y / scaleY;
|
|
166
|
-
var centerX = pieCenter.x,
|
|
167
|
-
centerY = pieCenter.y;
|
|
168
|
-
var getTipPos = function getTipPos() {
|
|
169
|
-
var tipPosMap = {
|
|
170
|
-
rightTop: "translate(".concat((screenRef.x + translateTip.x + tipWidth) / scaleX + mouseX - screenLeft / scaleX > screenWidth / scaleX ? mouseX - tipWidth - translateTip.x : mouseX + translateTip.x, "px,").concat((screenRef.y - translateTip.y - tipHeight) / scaleY + mouseY - screenTop / scaleY < 0 ? mouseY + translateTip.y : mouseY - tipHeight - translateTip.y, "px)"),
|
|
171
|
-
leftTop: "translate(".concat((screenRef.x - translateTip.x - tipWidth) / scaleX + mouseX - screenLeft / scaleX < 0 ? mouseX + translateTip.x : mouseX - translateTip.x - tipWidth, "px,").concat((screenRef.y - translateTip.y - tipHeight) / scaleY + mouseY - screenTop / scaleY < 0 ? mouseY + translateTip.y : mouseY - tipHeight - translateTip.y, "px)"),
|
|
172
|
-
leftBottom: "translate(".concat((screenRef.x - translateTip.x - tipWidth) / scaleX + mouseX - screenLeft / scaleX < 0 ? mouseX + translateTip.x : mouseX - translateTip.x - tipWidth, "px,").concat((screenRef.y + translateTip.y + tipHeight) / scaleY + mouseY - screenTop / scaleY > screenHeight / scaleY ? mouseY - translateTip.y - tipHeight : mouseY + translateTip.y, "px)"),
|
|
173
|
-
rightBottom: "translate(".concat((screenRef.x + translateTip.x + tipWidth) / scaleX + mouseX - screenLeft / scaleX > screenWidth / scaleX ? mouseX - tipWidth - translateTip.x : mouseX + translateTip.x, "px,").concat((screenRef.y + translateTip.y + tipHeight) / scaleY + mouseY - screenTop / scaleY > screenHeight / scaleY ? mouseY - translateTip.y - tipHeight : mouseY + translateTip.y, "px)")
|
|
174
|
-
};
|
|
175
|
-
if (mouseX < centerX && mouseY < centerY) {
|
|
176
|
-
return tipPosMap.leftTop;
|
|
177
|
-
} else if (mouseX > centerX && mouseY < centerY) {
|
|
178
|
-
return tipPosMap.rightTop;
|
|
179
|
-
} else if (mouseX >= centerX && mouseY >= centerY) {
|
|
180
|
-
return tipPosMap.rightBottom;
|
|
181
|
-
} else {
|
|
182
|
-
return tipPosMap.leftBottom;
|
|
183
|
-
}
|
|
184
|
-
};
|
|
185
|
-
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
186
|
-
className: "__easyv-tooltip",
|
|
187
|
-
style: {
|
|
188
|
-
pointerEvents: 'none',
|
|
189
|
-
transform: getTipPos(mousePos, pieCenter),
|
|
190
|
-
width: tipWidth,
|
|
191
|
-
height: tipHeight,
|
|
192
|
-
padding: (0, _utils.getMargin)(margin),
|
|
193
|
-
background: image ? '50% 50% / 100% 100% no-repeat url(' + window.appConfig.ASSETS_URL + image + ')' : 'rgba(48, 55, 66, 0.85)'
|
|
194
|
-
}
|
|
195
|
-
}, /*#__PURE__*/_react["default"].createElement("dl", {
|
|
196
|
-
style: {
|
|
197
|
-
display: 'flex',
|
|
198
|
-
flexDirection: 'column',
|
|
199
|
-
justifyContent: 'space-between',
|
|
200
|
-
height: '100%'
|
|
201
|
-
}
|
|
202
|
-
}, Item()));
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.PieTooltip = void 0;
|
|
9
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
10
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
+
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
12
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
13
|
+
var _utils = require("../utils");
|
|
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; }
|
|
16
|
+
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; }
|
|
17
|
+
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; }
|
|
18
|
+
var PieTooltip = exports.PieTooltip = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
19
|
+
var mousePos = props.mousePos,
|
|
20
|
+
domRef = props.domRef,
|
|
21
|
+
pieCenter = props.pieCenter,
|
|
22
|
+
_props$config$tip = props.config.tip,
|
|
23
|
+
_props$config$tip$dat = _props$config$tip.data,
|
|
24
|
+
lineHeight = _props$config$tip$dat.lineHeight,
|
|
25
|
+
iconSize = _props$config$tip$dat.iconSize,
|
|
26
|
+
name = _props$config$tip$dat.name,
|
|
27
|
+
_props$config$tip$dat2 = _props$config$tip$dat.value,
|
|
28
|
+
valueIsShow = _props$config$tip$dat2.show,
|
|
29
|
+
valueFont = _props$config$tip$dat2.fontStyle,
|
|
30
|
+
valueSuffix = _props$config$tip$dat2.suffix,
|
|
31
|
+
valueSuffixIsShow = _props$config$tip$dat2.suffix.show,
|
|
32
|
+
_props$config$tip$dat3 = _props$config$tip$dat.percentage,
|
|
33
|
+
percentageIsShow = _props$config$tip$dat3.show,
|
|
34
|
+
percentageFont = _props$config$tip$dat3.fontStyle,
|
|
35
|
+
percentageSuffix = _props$config$tip$dat3.suffix,
|
|
36
|
+
percentageSuffixIsShow = _props$config$tip$dat3.suffix.show,
|
|
37
|
+
precision = _props$config$tip$dat3.precision,
|
|
38
|
+
image = _props$config$tip.image,
|
|
39
|
+
margin = _props$config$tip.margin,
|
|
40
|
+
_props$config$tip$siz = _props$config$tip.size,
|
|
41
|
+
tipWidth = _props$config$tip$siz.width,
|
|
42
|
+
tipHeight = _props$config$tip$siz.height,
|
|
43
|
+
translateTip = _props$config$tip.translate,
|
|
44
|
+
data = props.data,
|
|
45
|
+
series = props.series;
|
|
46
|
+
var screenRef = domRef.current.getBoundingClientRect();
|
|
47
|
+
var Item = function Item() {
|
|
48
|
+
var _data$data = data.data,
|
|
49
|
+
s = _data$data.s,
|
|
50
|
+
y = _data$data.y,
|
|
51
|
+
percent = data.percent;
|
|
52
|
+
var _find = (0, _toConsumableArray2["default"])(series.values()).find(function (series) {
|
|
53
|
+
return series.name == s;
|
|
54
|
+
}),
|
|
55
|
+
type = _find.type,
|
|
56
|
+
icon = _find.icon,
|
|
57
|
+
displayName = _find.displayName;
|
|
58
|
+
var renderSuffix = function renderSuffix(suffix) {
|
|
59
|
+
var content = suffix.content,
|
|
60
|
+
suffiixFont = suffix.font,
|
|
61
|
+
suffixTranslate = suffix.translate;
|
|
62
|
+
return /*#__PURE__*/_react["default"].createElement("span", {
|
|
63
|
+
style: _objectSpread(_objectSpread({}, (0, _utils.getFontStyle)(suffiixFont)), {}, {
|
|
64
|
+
display: "inline-block",
|
|
65
|
+
transform: (0, _utils.getTranslate3d)(suffixTranslate)
|
|
66
|
+
})
|
|
67
|
+
}, content);
|
|
68
|
+
};
|
|
69
|
+
var _icon = (0, _utils.getIcon)(type, icon);
|
|
70
|
+
return /*#__PURE__*/_react["default"].createElement("dd", {
|
|
71
|
+
style: {
|
|
72
|
+
display: 'flex',
|
|
73
|
+
justifyContent: 'space-between',
|
|
74
|
+
lineHeight: lineHeight + 'px'
|
|
75
|
+
}
|
|
76
|
+
}, /*#__PURE__*/_react["default"].createElement("span", {
|
|
77
|
+
style: {
|
|
78
|
+
// border: '1px solid red',
|
|
79
|
+
display: 'flex',
|
|
80
|
+
alignItems: 'center',
|
|
81
|
+
gap: icon.iconGap
|
|
82
|
+
}
|
|
83
|
+
}, /*#__PURE__*/_react["default"].createElement("span", {
|
|
84
|
+
style: _objectSpread(_objectSpread({}, _icon), {}, {
|
|
85
|
+
width: iconSize + 'px',
|
|
86
|
+
height: iconSize + 'px'
|
|
87
|
+
})
|
|
88
|
+
}), /*#__PURE__*/_react["default"].createElement("span", {
|
|
89
|
+
style: (0, _utils.getFontStyle)(name)
|
|
90
|
+
}, displayName || s)), valueIsShow && /*#__PURE__*/_react["default"].createElement("span", {
|
|
91
|
+
style: (0, _utils.getFontStyle)(valueFont)
|
|
92
|
+
}, y, valueSuffixIsShow && renderSuffix(valueSuffix)), percentageIsShow && /*#__PURE__*/_react["default"].createElement("span", {
|
|
93
|
+
style: (0, _utils.getFontStyle)(percentageFont)
|
|
94
|
+
}, Number(percent).toFixed(precision), percentageSuffixIsShow && renderSuffix(percentageSuffix)));
|
|
95
|
+
};
|
|
96
|
+
var getBigScreenScale = function getBigScreenScale() {
|
|
97
|
+
// 优先使用全局提供的方法
|
|
98
|
+
if (typeof window.getScreenScale === 'function') {
|
|
99
|
+
try {
|
|
100
|
+
var _result = window.getScreenScale();
|
|
101
|
+
if (Array.isArray(_result) && _result.length >= 6) {
|
|
102
|
+
return _result;
|
|
103
|
+
}
|
|
104
|
+
} catch (e) {
|
|
105
|
+
console.error('调用全局 getScreenScale 出错:', e);
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
// 获取容器元素
|
|
110
|
+
var bigscreenDom = document.getElementById('bigscreen-container');
|
|
111
|
+
|
|
112
|
+
// 元素不存在时的处理
|
|
113
|
+
if (!bigscreenDom) {
|
|
114
|
+
console.warn('未找到 bigscreen-container 元素,使用视口尺寸');
|
|
115
|
+
return [1, 1, window.innerWidth, window.innerHeight, 0, 0];
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
// 确保元素可见(未被隐藏)
|
|
119
|
+
var isVisible = window.getComputedStyle(bigscreenDom).display !== 'none' && window.getComputedStyle(bigscreenDom).visibility !== 'hidden';
|
|
120
|
+
if (!isVisible) {
|
|
121
|
+
console.warn('bigscreen-container 元素不可见,使用视口尺寸');
|
|
122
|
+
return [1, 1, window.innerWidth, window.innerHeight, 0, 0];
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
// 获取元素的布局矩形(最可靠的尺寸获取方式)
|
|
126
|
+
var rect = bigscreenDom.getBoundingClientRect();
|
|
127
|
+
|
|
128
|
+
// 提取基础尺寸(从布局矩形获取,不受样式影响)
|
|
129
|
+
var screenWidth = rect.width || window.innerWidth;
|
|
130
|
+
var screenHeight = rect.height || window.innerHeight;
|
|
131
|
+
var screenLeft = rect.left || 0;
|
|
132
|
+
var screenTop = rect.top || 0;
|
|
133
|
+
|
|
134
|
+
// 处理缩放
|
|
135
|
+
var scaleX = 1;
|
|
136
|
+
var scaleY = 1;
|
|
137
|
+
try {
|
|
138
|
+
var computedStyle = window.getComputedStyle(bigscreenDom);
|
|
139
|
+
var transform = computedStyle.transform;
|
|
140
|
+
if (transform && transform !== 'none') {
|
|
141
|
+
// 解析 transform matrix
|
|
142
|
+
var matrix = new DOMMatrix(transform);
|
|
143
|
+
scaleX = matrix.a; // 缩放X因子
|
|
144
|
+
scaleY = matrix.d; // 缩放Y因子
|
|
145
|
+
}
|
|
146
|
+
} catch (e) {
|
|
147
|
+
console.error('解析缩放样式出错:', e);
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
// 最终返回值(确保不会有undefined)
|
|
151
|
+
var result = [isNaN(scaleX) ? 1 : scaleX, isNaN(scaleY) ? 1 : scaleY, isNaN(screenWidth) ? window.innerWidth : screenWidth, isNaN(screenHeight) ? window.innerHeight : screenHeight, isNaN(screenLeft) ? 0 : screenLeft, isNaN(screenTop) ? 0 : screenTop];
|
|
152
|
+
return result;
|
|
153
|
+
};
|
|
154
|
+
var _getBigScreenScale = getBigScreenScale(),
|
|
155
|
+
_getBigScreenScale2 = (0, _slicedToArray2["default"])(_getBigScreenScale, 6),
|
|
156
|
+
scaleX = _getBigScreenScale2[0],
|
|
157
|
+
scaleY = _getBigScreenScale2[1],
|
|
158
|
+
screenWidth = _getBigScreenScale2[2],
|
|
159
|
+
screenHeight = _getBigScreenScale2[3],
|
|
160
|
+
screenLeft = _getBigScreenScale2[4],
|
|
161
|
+
screenTop = _getBigScreenScale2[5];
|
|
162
|
+
var x = mousePos.x,
|
|
163
|
+
y = mousePos.y;
|
|
164
|
+
var mouseX = x / scaleX;
|
|
165
|
+
var mouseY = y / scaleY;
|
|
166
|
+
var centerX = pieCenter.x,
|
|
167
|
+
centerY = pieCenter.y;
|
|
168
|
+
var getTipPos = function getTipPos() {
|
|
169
|
+
var tipPosMap = {
|
|
170
|
+
rightTop: "translate(".concat((screenRef.x + translateTip.x + tipWidth) / scaleX + mouseX - screenLeft / scaleX > screenWidth / scaleX ? mouseX - tipWidth - translateTip.x : mouseX + translateTip.x, "px,").concat((screenRef.y - translateTip.y - tipHeight) / scaleY + mouseY - screenTop / scaleY < 0 ? mouseY + translateTip.y : mouseY - tipHeight - translateTip.y, "px)"),
|
|
171
|
+
leftTop: "translate(".concat((screenRef.x - translateTip.x - tipWidth) / scaleX + mouseX - screenLeft / scaleX < 0 ? mouseX + translateTip.x : mouseX - translateTip.x - tipWidth, "px,").concat((screenRef.y - translateTip.y - tipHeight) / scaleY + mouseY - screenTop / scaleY < 0 ? mouseY + translateTip.y : mouseY - tipHeight - translateTip.y, "px)"),
|
|
172
|
+
leftBottom: "translate(".concat((screenRef.x - translateTip.x - tipWidth) / scaleX + mouseX - screenLeft / scaleX < 0 ? mouseX + translateTip.x : mouseX - translateTip.x - tipWidth, "px,").concat((screenRef.y + translateTip.y + tipHeight) / scaleY + mouseY - screenTop / scaleY > screenHeight / scaleY ? mouseY - translateTip.y - tipHeight : mouseY + translateTip.y, "px)"),
|
|
173
|
+
rightBottom: "translate(".concat((screenRef.x + translateTip.x + tipWidth) / scaleX + mouseX - screenLeft / scaleX > screenWidth / scaleX ? mouseX - tipWidth - translateTip.x : mouseX + translateTip.x, "px,").concat((screenRef.y + translateTip.y + tipHeight) / scaleY + mouseY - screenTop / scaleY > screenHeight / scaleY ? mouseY - translateTip.y - tipHeight : mouseY + translateTip.y, "px)")
|
|
174
|
+
};
|
|
175
|
+
if (mouseX < centerX && mouseY < centerY) {
|
|
176
|
+
return tipPosMap.leftTop;
|
|
177
|
+
} else if (mouseX > centerX && mouseY < centerY) {
|
|
178
|
+
return tipPosMap.rightTop;
|
|
179
|
+
} else if (mouseX >= centerX && mouseY >= centerY) {
|
|
180
|
+
return tipPosMap.rightBottom;
|
|
181
|
+
} else {
|
|
182
|
+
return tipPosMap.leftBottom;
|
|
183
|
+
}
|
|
184
|
+
};
|
|
185
|
+
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
186
|
+
className: "__easyv-tooltip",
|
|
187
|
+
style: {
|
|
188
|
+
pointerEvents: 'none',
|
|
189
|
+
transform: getTipPos(mousePos, pieCenter),
|
|
190
|
+
width: tipWidth,
|
|
191
|
+
height: tipHeight,
|
|
192
|
+
padding: (0, _utils.getMargin)(margin),
|
|
193
|
+
background: image ? '50% 50% / 100% 100% no-repeat url(' + window.appConfig.ASSETS_URL + image + ')' : 'rgba(48, 55, 66, 0.85)'
|
|
194
|
+
}
|
|
195
|
+
}, /*#__PURE__*/_react["default"].createElement("dl", {
|
|
196
|
+
style: {
|
|
197
|
+
display: 'flex',
|
|
198
|
+
flexDirection: 'column',
|
|
199
|
+
justifyContent: 'space-between',
|
|
200
|
+
height: '100%'
|
|
201
|
+
}
|
|
202
|
+
}, Item()));
|
|
203
203
|
});
|