@easyv/charts 1.8.14 → 1.8.15
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/Label.js +356 -356
- package/lib/components/Legend.js +312 -312
- package/lib/components/pieTooltip.js +202 -202
- package/lib/utils/index.js +822 -822
- package/package.json +1 -1
- package/src/components/Carousel.tsx +72 -55
|
@@ -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
|
});
|