@easyv/charts 1.10.34 → 1.10.36

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.
@@ -7,10 +7,10 @@ Object.defineProperty(exports, "__esModule", {
7
7
  });
8
8
  exports["default"] = void 0;
9
9
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
10
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
11
10
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
12
11
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
12
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
13
+ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
14
14
  var _react = _interopRequireWildcard(require("react"));
15
15
  var _ = require(".");
16
16
  var _context = require("../context");
@@ -27,8 +27,8 @@ var _excluded = ["startAngle", "endAngle", "antiClockwise"],
27
27
  _excluded2 = ["padAngle", "innerRadius", "outerRadius", "cornerRadius", "startAngle", "endAngle"],
28
28
  _excluded3 = ["formatter"],
29
29
  _excluded4 = ["startAngle", "endAngle"];
30
- /**
31
- * 饼环图
30
+ /**
31
+ * 饼环图
32
32
  */
33
33
  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); }
34
34
  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; }
@@ -196,16 +196,127 @@ var getCoord = function getCoord(deg, radius) {
196
196
  y = Math.sin(deg) * radius;
197
197
  return [x, y];
198
198
  };
199
- var getRoseRadius = function getRoseRadius(_ref) {
200
- var innerRadius = _ref.innerRadius,
201
- baseRadius = _ref.baseRadius;
199
+ var parseFontSize = function parseFontSize(value) {
200
+ var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 12;
201
+ var n = parseFloat(value);
202
+ return Number.isFinite(n) ? n : fallback;
203
+ };
204
+
205
+ // 与 getFontStyle 一致:实际行盒高度取 lineHeight,否则用 fontSize
206
+ var getFontLineHeight = function getFontLineHeight(font) {
207
+ var fontSize = parseFontSize(font === null || font === void 0 ? void 0 : font.fontSize);
208
+ var lineHeight = parseFontSize(font === null || font === void 0 ? void 0 : font.lineHeight, 0);
209
+ return Math.max(lineHeight, fontSize);
210
+ };
211
+ var getLabelRowHeight = function getLabelRowHeight(_ref) {
212
+ var showName = _ref.showName,
213
+ showValue = _ref.showValue,
214
+ showPercent = _ref.showPercent,
215
+ nameFont = _ref.nameFont,
216
+ valueFont = _ref.valueFont,
217
+ percentFont = _ref.percentFont;
218
+ var sizes = [];
219
+ if (showName) sizes.push(getFontLineHeight(nameFont));
220
+ if (showValue) sizes.push(getFontLineHeight(valueFont));
221
+ if (showPercent) sizes.push(getFontLineHeight(percentFont));
222
+ return sizes.length ? Math.max.apply(Math, sizes) : 12;
223
+ };
224
+
225
+ // 上下布局:名称/数值/百分比纵向排列,高度 = 各可见行的行高之和
226
+ var getLabelColumnHeight = function getLabelColumnHeight(_ref2) {
227
+ var showName = _ref2.showName,
228
+ showValue = _ref2.showValue,
229
+ showPercent = _ref2.showPercent,
230
+ nameFont = _ref2.nameFont,
231
+ valueFont = _ref2.valueFont,
232
+ percentFont = _ref2.percentFont;
233
+ var height = 0;
234
+ if (showName) height += getFontLineHeight(nameFont);
235
+ if (showValue) height += getFontLineHeight(valueFont);
236
+ if (showPercent) height += getFontLineHeight(percentFont);
237
+ return height || 12;
238
+ };
239
+
240
+ // 大屏 transform:scale 后 getBoundingClientRect 会带缩放;offsetHeight 不受 transform 影响,与 SVG 坐标一致
241
+ var getLabelDomHeight = function getLabelDomHeight(el) {
242
+ if (!el) return 0;
243
+ if (el.offsetHeight) return el.offsetHeight;
244
+ var rect = el.getBoundingClientRect();
245
+ if (!rect.height) return 0;
246
+ // offsetHeight 不可用时,用宽高比估算当前 scaleY 再还原
247
+ var scaleY = el.offsetWidth > 0 && rect.width > 0 ? rect.width / el.offsetWidth : 1;
248
+ return Math.round(rect.height / (scaleY || 1));
249
+ };
250
+
251
+ // 水平布局:同侧重叠时按半高之和推开
252
+ var resolveLabelY = function resolveLabelY(y2, side, placedYBySide, labelHeight) {
253
+ var placed = placedYBySide[side];
254
+ var finalY = y2;
255
+ var stackDown = y2 >= 0;
256
+ var isOverlap = function isOverlap(y, py, h) {
257
+ return Math.abs(y - py) < (labelHeight + h) / 2;
258
+ };
259
+ var guard = 0;
260
+ while (guard++ < 50 && placed.some(function (_ref3) {
261
+ var py = _ref3.y,
262
+ h = _ref3.height;
263
+ return isOverlap(finalY, py, h);
264
+ })) {
265
+ var hits = placed.filter(function (_ref4) {
266
+ var py = _ref4.y,
267
+ h = _ref4.height;
268
+ return isOverlap(finalY, py, h);
269
+ });
270
+ finalY = stackDown ? Math.max.apply(Math, (0, _toConsumableArray2["default"])(hits.map(function (_ref5) {
271
+ var py = _ref5.y,
272
+ h = _ref5.height;
273
+ return py + (labelHeight + h) / 2;
274
+ }))) : Math.min.apply(Math, (0, _toConsumableArray2["default"])(hits.map(function (_ref6) {
275
+ var py = _ref6.y,
276
+ h = _ref6.height;
277
+ return py - (labelHeight + h) / 2;
278
+ })));
279
+ }
280
+ placed.push({
281
+ y: finalY,
282
+ height: labelHeight
283
+ });
284
+ return finalY;
285
+ };
286
+
287
+ // 上下布局:过近时只按「自身标签高度」相对上一个已放置位置偏移
288
+ var resolveLabelYVertical = function resolveLabelYVertical(y2, side, placedYBySide, labelHeight) {
289
+ var placed = placedYBySide[side];
290
+ var stackDown = y2 >= 0;
291
+ var finalY = y2;
292
+ if (placed.some(function (_ref7) {
293
+ var py = _ref7.y;
294
+ return Math.abs(finalY - py) < labelHeight;
295
+ })) {
296
+ finalY = stackDown ? Math.max.apply(Math, (0, _toConsumableArray2["default"])(placed.map(function (_ref8) {
297
+ var py = _ref8.y;
298
+ return py;
299
+ }))) + labelHeight : Math.min.apply(Math, (0, _toConsumableArray2["default"])(placed.map(function (_ref9) {
300
+ var py = _ref9.y;
301
+ return py;
302
+ }))) - labelHeight;
303
+ }
304
+ placed.push({
305
+ y: finalY,
306
+ height: labelHeight
307
+ });
308
+ return finalY;
309
+ };
310
+ var getRoseRadius = function getRoseRadius(_ref10) {
311
+ var innerRadius = _ref10.innerRadius,
312
+ baseRadius = _ref10.baseRadius;
202
313
  return innerRadius + (1 - innerRadius) * baseRadius;
203
314
  };
204
- var getAngle = function getAngle(_ref2) {
205
- var startAngle = _ref2.startAngle,
206
- endAngle = _ref2.endAngle,
207
- antiClockwise = _ref2.antiClockwise,
208
- rest = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
315
+ var getAngle = function getAngle(_ref11) {
316
+ var startAngle = _ref11.startAngle,
317
+ endAngle = _ref11.endAngle,
318
+ antiClockwise = _ref11.antiClockwise,
319
+ rest = (0, _objectWithoutProperties2["default"])(_ref11, _excluded);
209
320
  if (antiClockwise) return _objectSpread(_objectSpread({}, rest), {}, {
210
321
  startAngle: endAngle - 180,
211
322
  endAngle: startAngle - 180
@@ -215,20 +326,20 @@ var getAngle = function getAngle(_ref2) {
215
326
  endAngle: endAngle
216
327
  });
217
328
  };
218
- var getArc = function getArc(radius, _ref3, series_, index) {
219
- var _ref3$padAngle = _ref3.padAngle,
220
- padAngle = _ref3$padAngle === void 0 ? 0 : _ref3$padAngle,
221
- _ref3$innerRadius = _ref3.innerRadius,
222
- innerRadius = _ref3$innerRadius === void 0 ? 0 : _ref3$innerRadius,
223
- _ref3$outerRadius = _ref3.outerRadius,
224
- outerRadius = _ref3$outerRadius === void 0 ? 1 : _ref3$outerRadius,
225
- _ref3$cornerRadius = _ref3.cornerRadius,
226
- cornerRadius = _ref3$cornerRadius === void 0 ? 0 : _ref3$cornerRadius,
227
- _ref3$startAngle = _ref3.startAngle,
228
- startAngle = _ref3$startAngle === void 0 ? 0 : _ref3$startAngle,
229
- _ref3$endAngle = _ref3.endAngle,
230
- endAngle = _ref3$endAngle === void 0 ? 360 : _ref3$endAngle,
231
- rest = (0, _objectWithoutProperties2["default"])(_ref3, _excluded2);
329
+ var getArc = function getArc(radius, _ref12, series_, index) {
330
+ var _ref12$padAngle = _ref12.padAngle,
331
+ padAngle = _ref12$padAngle === void 0 ? 0 : _ref12$padAngle,
332
+ _ref12$innerRadius = _ref12.innerRadius,
333
+ innerRadius = _ref12$innerRadius === void 0 ? 0 : _ref12$innerRadius,
334
+ _ref12$outerRadius = _ref12.outerRadius,
335
+ outerRadius = _ref12$outerRadius === void 0 ? 1 : _ref12$outerRadius,
336
+ _ref12$cornerRadius = _ref12.cornerRadius,
337
+ cornerRadius = _ref12$cornerRadius === void 0 ? 0 : _ref12$cornerRadius,
338
+ _ref12$startAngle = _ref12.startAngle,
339
+ startAngle = _ref12$startAngle === void 0 ? 0 : _ref12$startAngle,
340
+ _ref12$endAngle = _ref12.endAngle,
341
+ endAngle = _ref12$endAngle === void 0 ? 360 : _ref12$endAngle,
342
+ rest = (0, _objectWithoutProperties2["default"])(_ref12, _excluded2);
232
343
  var series = series_.find(function (s) {
233
344
  return s.fieldName == rest.data.s;
234
345
  }) || series_[index % series_.length];
@@ -243,11 +354,11 @@ var getArc = function getArc(radius, _ref3, series_, index) {
243
354
  });
244
355
  };
245
356
  var getCircleScale = function getCircleScale() {
246
- var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : tick,
247
- count = _ref4.count,
248
- color = _ref4.color,
249
- width = _ref4.width,
250
- length = _ref4.length;
357
+ var _ref13 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : tick,
358
+ count = _ref13.count,
359
+ color = _ref13.color,
360
+ width = _ref13.width,
361
+ length = _ref13.length;
251
362
  var radius = arguments.length > 1 ? arguments[1] : undefined;
252
363
  var data = [],
253
364
  arcs = [],
@@ -273,78 +384,78 @@ var getCircleScale = function getCircleScale() {
273
384
  });
274
385
  }));
275
386
  };
276
- var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
387
+ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref14) {
277
388
  var _legend$config2;
278
- var width = _ref5.width,
279
- height = _ref5.height,
280
- _ref5$config = _ref5.config,
281
- _ref5$config$chart = _ref5$config.chart,
282
- label = _ref5$config$chart.label,
283
- _ref5$config$chart$le = _ref5$config$chart.legend,
284
- _ref5$config$chart$le2 = _ref5$config$chart$le.formatter,
285
- formatter = _ref5$config$chart$le2 === void 0 ? _formatter.pieLegendFormatter : _ref5$config$chart$le2,
286
- legend = (0, _objectWithoutProperties2["default"])(_ref5$config$chart$le, _excluded3),
287
- _ref5$config$chart$an = _ref5$config$chart.animation,
288
- _ref5$config$chart$an2 = _ref5$config$chart$an === void 0 ? {} : _ref5$config$chart$an,
289
- ringDuration = _ref5$config$chart$an2.ringDuration,
290
- labelDuration = _ref5$config$chart$an2.labelDuration,
291
- _ref5$config$chart$ma = _ref5$config$chart.margin,
292
- marginLeft = _ref5$config$chart$ma.marginLeft,
293
- marginTop = _ref5$config$chart$ma.marginTop,
294
- marginRight = _ref5$config$chart$ma.marginRight,
295
- marginBottom = _ref5$config$chart$ma.marginBottom,
296
- _ref5$config$fan = _ref5$config.fan,
297
- _ref5$config$fan2 = _ref5$config$fan === void 0 ? {} : _ref5$config$fan,
298
- _ref5$config$fan2$cha = _ref5$config$fan2.chart,
299
- chart = _ref5$config$fan2$cha === void 0 ? defaultChart : _ref5$config$fan2$cha,
300
- _ref5$config$fan2$cha2 = _ref5$config$fan2.chart,
301
- _ref5$config$fan2$cha3 = _ref5$config$fan2$cha2.outerRadius,
302
- outerRadius = _ref5$config$fan2$cha3 === void 0 ? defaultChart.outerRadius : _ref5$config$fan2$cha3,
303
- padAngle = _ref5$config$fan2$cha2.padAngle,
304
- _ref5$config$fan2$ang = _ref5$config$fan2.angle,
305
- angle = _ref5$config$fan2$ang === void 0 ? defaultAngle : _ref5$config$fan2$ang,
306
- _ref5$config$fan2$str = _ref5$config$fan2.stroke,
307
- _ref5$config$fan2$str2 = _ref5$config$fan2$str === void 0 ? {
389
+ var width = _ref14.width,
390
+ height = _ref14.height,
391
+ _ref14$config = _ref14.config,
392
+ _ref14$config$chart = _ref14$config.chart,
393
+ label = _ref14$config$chart.label,
394
+ _ref14$config$chart$l = _ref14$config$chart.legend,
395
+ _ref14$config$chart$l2 = _ref14$config$chart$l.formatter,
396
+ formatter = _ref14$config$chart$l2 === void 0 ? _formatter.pieLegendFormatter : _ref14$config$chart$l2,
397
+ legend = (0, _objectWithoutProperties2["default"])(_ref14$config$chart$l, _excluded3),
398
+ _ref14$config$chart$a = _ref14$config$chart.animation,
399
+ _ref14$config$chart$a2 = _ref14$config$chart$a === void 0 ? {} : _ref14$config$chart$a,
400
+ ringDuration = _ref14$config$chart$a2.ringDuration,
401
+ labelDuration = _ref14$config$chart$a2.labelDuration,
402
+ _ref14$config$chart$m = _ref14$config$chart.margin,
403
+ marginLeft = _ref14$config$chart$m.marginLeft,
404
+ marginTop = _ref14$config$chart$m.marginTop,
405
+ marginRight = _ref14$config$chart$m.marginRight,
406
+ marginBottom = _ref14$config$chart$m.marginBottom,
407
+ _ref14$config$fan = _ref14$config.fan,
408
+ _ref14$config$fan2 = _ref14$config$fan === void 0 ? {} : _ref14$config$fan,
409
+ _ref14$config$fan2$ch = _ref14$config$fan2.chart,
410
+ chart = _ref14$config$fan2$ch === void 0 ? defaultChart : _ref14$config$fan2$ch,
411
+ _ref14$config$fan2$ch2 = _ref14$config$fan2.chart,
412
+ _ref14$config$fan2$ch3 = _ref14$config$fan2$ch2.outerRadius,
413
+ outerRadius = _ref14$config$fan2$ch3 === void 0 ? defaultChart.outerRadius : _ref14$config$fan2$ch3,
414
+ padAngle = _ref14$config$fan2$ch2.padAngle,
415
+ _ref14$config$fan2$an = _ref14$config$fan2.angle,
416
+ angle = _ref14$config$fan2$an === void 0 ? defaultAngle : _ref14$config$fan2$an,
417
+ _ref14$config$fan2$st = _ref14$config$fan2.stroke,
418
+ _ref14$config$fan2$st2 = _ref14$config$fan2$st === void 0 ? {
308
419
  show: false
309
- } : _ref5$config$fan2$str,
310
- show = _ref5$config$fan2$str2.show,
311
- strokeWidth = _ref5$config$fan2$str2.strokeWidth,
312
- color = _ref5$config$fan2$str2.color,
313
- decorate = _ref5$config$fan2.decorate,
314
- decorate2 = _ref5$config$fan2.decorate2,
315
- categoryText = _ref5$config$fan2.categoryText,
316
- outerDecorate = _ref5$config$fan2.outerDecorate,
317
- current = _ref5$config$fan2.current,
318
- order = _ref5$config.order,
319
- columnsSeries = _ref5$config.columnsSeries,
320
- series = _ref5$config.series,
321
- _ref5$config$animatio = _ref5$config.animation,
322
- on = _ref5$config$animatio.on,
323
- _ref5$config$animatio2 = _ref5$config$animatio.current,
324
- _ref5$config$animatio3 = _ref5$config$animatio2.widthen,
325
- widthen = _ref5$config$animatio3 === void 0 ? 0 : _ref5$config$animatio3,
326
- _ref5$config$animatio4 = _ref5$config$animatio2.heighten,
327
- heighten = _ref5$config$animatio4 === void 0 ? 0 : _ref5$config$animatio4,
328
- _ref5$config$animatio5 = _ref5$config$animatio2.opacity,
329
- opacity = _ref5$config$animatio5 === void 0 ? 0 : _ref5$config$animatio5,
330
- _ref5$config$animatio6 = _ref5$config$animatio2.width,
331
- radiusWidthAdd = _ref5$config$animatio6 === void 0 ? 0 : _ref5$config$animatio6,
332
- animateColor = _ref5$config$animatio2.color,
333
- animateCTS = _ref5$config$animatio2.textStyle,
334
- _ref5$config$animatio7 = _ref5$config$animatio2.gap,
335
- gap = _ref5$config$animatio7 === void 0 ? 0 : _ref5$config$animatio7,
336
- _ref5$config$animatio8 = _ref5$config$animatio.rotate,
337
- rotate = _ref5$config$animatio8 === void 0 ? 0 : _ref5$config$animatio8,
338
- _ref5$config$tooltip = _ref5$config.tooltip,
339
- tooltip = _ref5$config$tooltip === void 0 ? {} : _ref5$config$tooltip,
340
- config = _ref5.config,
341
- _ref5$state = _ref5.state,
342
- currentIndex = _ref5$state.currentIndex,
343
- trigger = _ref5$state.trigger,
344
- onEvent = _ref5.onEvent,
345
- hoverEvent = _ref5.hoverEvent,
346
- _ref5$data = _ref5.data,
347
- originData = _ref5$data === void 0 ? [] : _ref5$data;
420
+ } : _ref14$config$fan2$st,
421
+ show = _ref14$config$fan2$st2.show,
422
+ strokeWidth = _ref14$config$fan2$st2.strokeWidth,
423
+ color = _ref14$config$fan2$st2.color,
424
+ decorate = _ref14$config$fan2.decorate,
425
+ decorate2 = _ref14$config$fan2.decorate2,
426
+ categoryText = _ref14$config$fan2.categoryText,
427
+ outerDecorate = _ref14$config$fan2.outerDecorate,
428
+ current = _ref14$config$fan2.current,
429
+ order = _ref14$config.order,
430
+ columnsSeries = _ref14$config.columnsSeries,
431
+ series = _ref14$config.series,
432
+ _ref14$config$animati = _ref14$config.animation,
433
+ on = _ref14$config$animati.on,
434
+ _ref14$config$animati2 = _ref14$config$animati.current,
435
+ _ref14$config$animati3 = _ref14$config$animati2.widthen,
436
+ widthen = _ref14$config$animati3 === void 0 ? 0 : _ref14$config$animati3,
437
+ _ref14$config$animati4 = _ref14$config$animati2.heighten,
438
+ heighten = _ref14$config$animati4 === void 0 ? 0 : _ref14$config$animati4,
439
+ _ref14$config$animati5 = _ref14$config$animati2.opacity,
440
+ opacity = _ref14$config$animati5 === void 0 ? 0 : _ref14$config$animati5,
441
+ _ref14$config$animati6 = _ref14$config$animati2.width,
442
+ radiusWidthAdd = _ref14$config$animati6 === void 0 ? 0 : _ref14$config$animati6,
443
+ animateColor = _ref14$config$animati2.color,
444
+ animateCTS = _ref14$config$animati2.textStyle,
445
+ _ref14$config$animati7 = _ref14$config$animati2.gap,
446
+ gap = _ref14$config$animati7 === void 0 ? 0 : _ref14$config$animati7,
447
+ _ref14$config$animati8 = _ref14$config$animati.rotate,
448
+ rotate = _ref14$config$animati8 === void 0 ? 0 : _ref14$config$animati8,
449
+ _ref14$config$tooltip = _ref14$config.tooltip,
450
+ tooltip = _ref14$config$tooltip === void 0 ? {} : _ref14$config$tooltip,
451
+ config = _ref14.config,
452
+ _ref14$state = _ref14.state,
453
+ currentIndex = _ref14$state.currentIndex,
454
+ trigger = _ref14$state.trigger,
455
+ onEvent = _ref14.onEvent,
456
+ hoverEvent = _ref14.hoverEvent,
457
+ _ref14$data = _ref14.data,
458
+ originData = _ref14$data === void 0 ? [] : _ref14$data;
348
459
  var data = originData.map(function (d) {
349
460
  return _objectSpread(_objectSpread({}, d), {}, {
350
461
  y: d.y < 0 ? 0 : d.y
@@ -479,10 +590,10 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
479
590
  var roseRadius = getRoseRadius(_chart);
480
591
  var scaler = (0, _d3v.scaleLinear)().domain(domain).range([roseRadius, 1]);
481
592
  var _angle = PI * 2 / _legendDataWithPercent.length;
482
- return _legendDataWithPercent.map(function (_ref6, index) {
483
- var startAngle = _ref6.startAngle,
484
- endAngle = _ref6.endAngle,
485
- arc = (0, _objectWithoutProperties2["default"])(_ref6, _excluded4);
593
+ return _legendDataWithPercent.map(function (_ref15, index) {
594
+ var startAngle = _ref15.startAngle,
595
+ endAngle = _ref15.endAngle,
596
+ arc = (0, _objectWithoutProperties2["default"])(_ref15, _excluded4);
486
597
  return _objectSpread(_objectSpread({}, arc), {}, {
487
598
  id: id + "_linear_" + index,
488
599
  startAngle: roseType == "area" ? _angle * index : startAngle,
@@ -635,13 +746,13 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
635
746
  fill: "none",
636
747
  stroke: outerDecorate.color,
637
748
  strokeWidth: outerDecorate.width
638
- }), _arcs.map(function (_ref7, index) {
639
- var id = _ref7.id,
640
- value = _ref7.value,
641
- series = _ref7.series,
642
- arc = _ref7.arc,
643
- innerRadius = _ref7.innerRadius,
644
- outerRadius = _ref7.outerRadius;
749
+ }), _arcs.map(function (_ref16, index) {
750
+ var id = _ref16.id,
751
+ value = _ref16.value,
752
+ series = _ref16.series,
753
+ arc = _ref16.arc,
754
+ innerRadius = _ref16.innerRadius,
755
+ outerRadius = _ref16.outerRadius;
645
756
  var arcWidth = outerRadius - innerRadius;
646
757
  var path = arc.innerRadius(centerRadius).outerRadius(centerRadius)(value);
647
758
  var dashLength = Math.ceil(Math.PI * centerRadius * 2 / _arcs.length);
@@ -744,14 +855,14 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
744
855
  transition: "transform ease-in-out 0.3s",
745
856
  transform: "translate(" + halfChartWidth + "px, " + halfChartHeight + "px) rotate(" + rotate_ + "deg)"
746
857
  }
747
- }, _arcs.map(function (_ref8, index) {
748
- var id = _ref8.id,
749
- value = _ref8.value,
750
- series = _ref8.series,
751
- arc = _ref8.arc,
752
- innerRadius = _ref8.innerRadius,
753
- outerRadius = _ref8.outerRadius,
754
- dataIndex = _ref8.index;
858
+ }, _arcs.map(function (_ref17, index) {
859
+ var id = _ref17.id,
860
+ value = _ref17.value,
861
+ series = _ref17.series,
862
+ arc = _ref17.arc,
863
+ innerRadius = _ref17.innerRadius,
864
+ outerRadius = _ref17.outerRadius,
865
+ dataIndex = _ref17.index;
755
866
  var current = index == currentIndex;
756
867
  var prev = index == prevIndex.current;
757
868
  var offset = current ? y : prev ? 1 - y : 0;
@@ -901,53 +1012,53 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
901
1012
  mousePos: mousePos
902
1013
  })));
903
1014
  });
904
- var Current = function Current(_ref9) {
905
- var _ref9$config = _ref9.config,
906
- show = _ref9$config.show,
907
- gap = _ref9$config.gap,
908
- _ref9$config$name = _ref9$config.name,
909
- showName = _ref9$config$name.show,
910
- nameColor = _ref9$config$name.sameColor,
911
- nameFont = _ref9$config$name.font,
912
- _ref9$config$name$tra = _ref9$config$name.translate,
913
- translate = _ref9$config$name$tra === void 0 ? {
1015
+ var Current = function Current(_ref18) {
1016
+ var _ref18$config = _ref18.config,
1017
+ show = _ref18$config.show,
1018
+ gap = _ref18$config.gap,
1019
+ _ref18$config$name = _ref18$config.name,
1020
+ showName = _ref18$config$name.show,
1021
+ nameColor = _ref18$config$name.sameColor,
1022
+ nameFont = _ref18$config$name.font,
1023
+ _ref18$config$name$tr = _ref18$config$name.translate,
1024
+ translate = _ref18$config$name$tr === void 0 ? {
914
1025
  x: 0,
915
1026
  y: 0
916
- } : _ref9$config$name$tra,
917
- maxWidth = _ref9$config$name.maxWidth,
918
- textOverflow = _ref9$config$name.textOverflow,
919
- speed = _ref9$config$name.speed,
920
- _ref9$config$percent = _ref9$config.percent,
921
- showPercent = _ref9$config$percent.show,
922
- percentColor = _ref9$config$percent.sameColor,
923
- percentFont = _ref9$config$percent.font,
924
- precision = _ref9$config$percent.precision,
925
- _ref9$config$percent$ = _ref9$config$percent.translate,
926
- translatePercentX = _ref9$config$percent$.x,
927
- translatePercentY = _ref9$config$percent$.y,
928
- _ref9$config$value = _ref9$config.value,
929
- showValue = _ref9$config$value.show,
930
- valueColor = _ref9$config$value.sameColor,
931
- valueFont = _ref9$config$value.font,
932
- _ref9$config$value$tr = _ref9$config$value.translate,
933
- translateValueX = _ref9$config$value$tr.x,
934
- translateValueY = _ref9$config$value$tr.y,
935
- _ref9$config$value$su = _ref9$config$value.suffix,
936
- showSuffix = _ref9$config$value$su.show,
937
- fontSize = _ref9$config$value$su.fontSize,
938
- text = _ref9$config$value$su.text,
939
- _ref9$config$value$su2 = _ref9$config$value$su.translate,
940
- translateSuffixX = _ref9$config$value$su2.x,
941
- translateSuffixY = _ref9$config$value$su2.y,
942
- _ref9$iosStyle = _ref9.iosStyle,
943
- isIOS = _ref9$iosStyle.isIOS,
944
- marginLeft = _ref9$iosStyle.marginLeft,
945
- marginTop = _ref9$iosStyle.marginTop,
946
- width = _ref9.width,
947
- height = _ref9.height,
948
- data = _ref9.data,
949
- judge = _ref9.judge,
950
- currentIndex = _ref9.currentIndex;
1027
+ } : _ref18$config$name$tr,
1028
+ maxWidth = _ref18$config$name.maxWidth,
1029
+ textOverflow = _ref18$config$name.textOverflow,
1030
+ speed = _ref18$config$name.speed,
1031
+ _ref18$config$percent = _ref18$config.percent,
1032
+ showPercent = _ref18$config$percent.show,
1033
+ percentColor = _ref18$config$percent.sameColor,
1034
+ percentFont = _ref18$config$percent.font,
1035
+ precision = _ref18$config$percent.precision,
1036
+ _ref18$config$percent2 = _ref18$config$percent.translate,
1037
+ translatePercentX = _ref18$config$percent2.x,
1038
+ translatePercentY = _ref18$config$percent2.y,
1039
+ _ref18$config$value = _ref18$config.value,
1040
+ showValue = _ref18$config$value.show,
1041
+ valueColor = _ref18$config$value.sameColor,
1042
+ valueFont = _ref18$config$value.font,
1043
+ _ref18$config$value$t = _ref18$config$value.translate,
1044
+ translateValueX = _ref18$config$value$t.x,
1045
+ translateValueY = _ref18$config$value$t.y,
1046
+ _ref18$config$value$s = _ref18$config$value.suffix,
1047
+ showSuffix = _ref18$config$value$s.show,
1048
+ fontSize = _ref18$config$value$s.fontSize,
1049
+ text = _ref18$config$value$s.text,
1050
+ _ref18$config$value$s2 = _ref18$config$value$s.translate,
1051
+ translateSuffixX = _ref18$config$value$s2.x,
1052
+ translateSuffixY = _ref18$config$value$s2.y,
1053
+ _ref18$iosStyle = _ref18.iosStyle,
1054
+ isIOS = _ref18$iosStyle.isIOS,
1055
+ marginLeft = _ref18$iosStyle.marginLeft,
1056
+ marginTop = _ref18$iosStyle.marginTop,
1057
+ width = _ref18.width,
1058
+ height = _ref18.height,
1059
+ data = _ref18.data,
1060
+ judge = _ref18.judge,
1061
+ currentIndex = _ref18.currentIndex;
951
1062
  var _data = (0, _react.useMemo)(function () {
952
1063
  var legendDataWithPercent = (0, _utils.getDataWithPercent)(data, precision);
953
1064
  return (0, _utils.sortPie)(legendDataWithPercent, "");
@@ -1032,51 +1143,51 @@ var Current = function Current(_ref9) {
1032
1143
  })
1033
1144
  }, percent + "%")));
1034
1145
  };
1035
- var Label = function Label(_ref10) {
1036
- var _ref10$config = _ref10.config,
1037
- _ref10$config$maxRadi = _ref10$config.maxRadius,
1038
- maxRadius = _ref10$config$maxRadi === void 0 ? 0 : _ref10$config$maxRadi,
1039
- lineLength = _ref10$config.lineLength,
1040
- lineColor = _ref10$config.lineColor,
1041
- distance = _ref10$config.distance,
1042
- mode = _ref10$config.mode,
1043
- align = _ref10$config.align,
1044
- show = _ref10$config.show,
1045
- _ref10$config$transla = _ref10$config.translate,
1046
- translateX = _ref10$config$transla.x,
1047
- translateY = _ref10$config$transla.y,
1048
- _ref10$config$name = _ref10$config.name,
1049
- showName = _ref10$config$name.show,
1050
- nameFont = _ref10$config$name.font,
1051
- maxWidth = _ref10$config$name.maxWidth,
1052
- textOverflow = _ref10$config$name.textOverflow,
1053
- speed = _ref10$config$name.speed,
1054
- NameTranslate = _ref10$config$name.translate,
1055
- _ref10$config$value = _ref10$config.value,
1056
- showValue = _ref10$config$value.show,
1057
- valueFont = _ref10$config$value.font,
1058
- valueSameColor = _ref10$config$value.sameColor,
1059
- _ref10$config$value$s = _ref10$config$value.suffix,
1060
- showSuffix = _ref10$config$value$s.show,
1061
- text = _ref10$config$value$s.text,
1062
- suffixFontSize = _ref10$config$value$s.fontSize,
1063
- _ref10$config$value$s2 = _ref10$config$value$s.translate,
1064
- suffixTranslateX = _ref10$config$value$s2.x,
1065
- suffixTranslateY = _ref10$config$value$s2.y,
1066
- ValueTranslate = _ref10$config$value.translate,
1067
- _ref10$config$percent = _ref10$config.percent,
1068
- showPercent = _ref10$config$percent.show,
1069
- percentSameColor = _ref10$config$percent.sameColor,
1070
- percentFont = _ref10$config$percent.font,
1071
- precision = _ref10$config$percent.precision,
1072
- PercentTranslate = _ref10$config$percent.translate,
1073
- _ref10$iosStyle = _ref10.iosStyle,
1074
- isIOS = _ref10$iosStyle.isIOS,
1075
- left = _ref10$iosStyle.left,
1076
- top = _ref10$iosStyle.top,
1077
- arcs = _ref10.arcs,
1078
- judge = _ref10.judge,
1079
- animation = _ref10.animation;
1146
+ var Label = function Label(_ref19) {
1147
+ var _ref19$config = _ref19.config,
1148
+ _ref19$config$maxRadi = _ref19$config.maxRadius,
1149
+ maxRadius = _ref19$config$maxRadi === void 0 ? 0 : _ref19$config$maxRadi,
1150
+ lineLength = _ref19$config.lineLength,
1151
+ lineColor = _ref19$config.lineColor,
1152
+ distance = _ref19$config.distance,
1153
+ mode = _ref19$config.mode,
1154
+ align = _ref19$config.align,
1155
+ show = _ref19$config.show,
1156
+ _ref19$config$transla = _ref19$config.translate,
1157
+ translateX = _ref19$config$transla.x,
1158
+ translateY = _ref19$config$transla.y,
1159
+ _ref19$config$name = _ref19$config.name,
1160
+ showName = _ref19$config$name.show,
1161
+ nameFont = _ref19$config$name.font,
1162
+ maxWidth = _ref19$config$name.maxWidth,
1163
+ textOverflow = _ref19$config$name.textOverflow,
1164
+ speed = _ref19$config$name.speed,
1165
+ NameTranslate = _ref19$config$name.translate,
1166
+ _ref19$config$value = _ref19$config.value,
1167
+ showValue = _ref19$config$value.show,
1168
+ valueFont = _ref19$config$value.font,
1169
+ valueSameColor = _ref19$config$value.sameColor,
1170
+ _ref19$config$value$s = _ref19$config$value.suffix,
1171
+ showSuffix = _ref19$config$value$s.show,
1172
+ text = _ref19$config$value$s.text,
1173
+ suffixFontSize = _ref19$config$value$s.fontSize,
1174
+ _ref19$config$value$s2 = _ref19$config$value$s.translate,
1175
+ suffixTranslateX = _ref19$config$value$s2.x,
1176
+ suffixTranslateY = _ref19$config$value$s2.y,
1177
+ ValueTranslate = _ref19$config$value.translate,
1178
+ _ref19$config$percent = _ref19$config.percent,
1179
+ showPercent = _ref19$config$percent.show,
1180
+ percentSameColor = _ref19$config$percent.sameColor,
1181
+ percentFont = _ref19$config$percent.font,
1182
+ precision = _ref19$config$percent.precision,
1183
+ PercentTranslate = _ref19$config$percent.translate,
1184
+ _ref19$iosStyle = _ref19.iosStyle,
1185
+ isIOS = _ref19$iosStyle.isIOS,
1186
+ left = _ref19$iosStyle.left,
1187
+ top = _ref19$iosStyle.top,
1188
+ arcs = _ref19.arcs,
1189
+ judge = _ref19.judge,
1190
+ animation = _ref19.animation;
1080
1191
  var _arcs = (0, _react.useMemo)(function () {
1081
1192
  return (0, _utils.getDataWithPercent)(arcs, precision);
1082
1193
  }, [arcs, precision]);
@@ -1086,18 +1197,54 @@ var Label = function Label(_ref10) {
1086
1197
  d.percent = 0;
1087
1198
  });
1088
1199
  }
1089
- return /*#__PURE__*/_react["default"].createElement("g", null, _arcs.map(function (_ref11, index) {
1090
- var _ref11$series$color = _ref11.series.color,
1091
- type = _ref11$series$color.type,
1092
- pure = _ref11$series$color.pure,
1093
- stops = _ref11$series$color.linear.stops,
1094
- data = _ref11.data,
1095
- displayName = _ref11.displayName,
1096
- value = _ref11.value,
1097
- percent = _ref11.percent,
1098
- arc = _ref11.arc,
1099
- outerRadius = _ref11.outerRadius,
1100
- actualIndex = _ref11.index;
1200
+ var isHorizontal = mode === "horizontal";
1201
+ var labelElsRef = (0, _react.useRef)({});
1202
+ var _useState7 = (0, _react.useState)({}),
1203
+ _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
1204
+ measuredHeights = _useState8[0],
1205
+ setMeasuredHeights = _useState8[1];
1206
+
1207
+ // 上下布局:渲染后读取每个标签真实高度(仅在高度变化时更新,避免死循环)
1208
+ (0, _react.useLayoutEffect)(function () {
1209
+ if (isHorizontal) {
1210
+ setMeasuredHeights(function (prev) {
1211
+ return Object.keys(prev).length ? {} : prev;
1212
+ });
1213
+ return;
1214
+ }
1215
+ setMeasuredHeights(function (prev) {
1216
+ var next = {};
1217
+ var changed = false;
1218
+ Object.keys(labelElsRef.current).forEach(function (key) {
1219
+ var el = labelElsRef.current[key];
1220
+ if (!el) return;
1221
+ var h = getLabelDomHeight(el);
1222
+ if (!h) return;
1223
+ next[key] = h;
1224
+ if (prev[key] !== h) changed = true;
1225
+ });
1226
+ var prevKeys = Object.keys(prev);
1227
+ var nextKeys = Object.keys(next);
1228
+ if (prevKeys.length !== nextKeys.length) changed = true;
1229
+ return changed ? next : prev;
1230
+ });
1231
+ }, [isHorizontal, _arcs, mode, showName, showValue, showPercent, showSuffix]);
1232
+ var placedYBySide = {
1233
+ left: [],
1234
+ right: []
1235
+ };
1236
+ return /*#__PURE__*/_react["default"].createElement("g", null, _arcs.map(function (_ref20, index) {
1237
+ var _ref20$series$color = _ref20.series.color,
1238
+ type = _ref20$series$color.type,
1239
+ pure = _ref20$series$color.pure,
1240
+ stops = _ref20$series$color.linear.stops,
1241
+ data = _ref20.data,
1242
+ displayName = _ref20.displayName,
1243
+ value = _ref20.value,
1244
+ percent = _ref20.percent,
1245
+ arc = _ref20.arc,
1246
+ outerRadius = _ref20.outerRadius,
1247
+ actualIndex = _ref20.index;
1101
1248
  var _arc$centroid = arc.centroid(),
1102
1249
  _arc$centroid2 = (0, _slicedToArray2["default"])(_arc$centroid, 2),
1103
1250
  x = _arc$centroid2[0],
@@ -1118,30 +1265,48 @@ var Label = function Label(_ref10) {
1118
1265
  var _showName = showName && displayName;
1119
1266
  var _showValue = showValue && (value || showSuffix);
1120
1267
  var nameStyle = (0, _utils.getFontStyle)(nameFont);
1121
- return show && (_showName || showPercent || showValue) && /*#__PURE__*/_react["default"].createElement("g", {
1268
+ var shouldShow = show && (_showName || showPercent || showValue);
1269
+ // 与真实渲染一致:showValue 开启时值为 0 也会渲染
1270
+ var labelSizeOptions = {
1271
+ showName: _showName,
1272
+ showValue: showValue,
1273
+ showPercent: showPercent,
1274
+ nameFont: nameFont,
1275
+ valueFont: valueFont,
1276
+ percentFont: percentFont
1277
+ };
1278
+ var estimatedHeight = isHorizontal ? getLabelRowHeight(labelSizeOptions) : getLabelColumnHeight(labelSizeOptions);
1279
+ // 上下布局优先用 DOM 实测高度
1280
+ var labelHeight = !isHorizontal && measuredHeights[index] != null ? measuredHeights[index] : estimatedHeight;
1281
+ var side = x2 < 0 ? "left" : "right";
1282
+ var finalY = shouldShow ? isHorizontal ? resolveLabelY(y2, side, placedYBySide, labelHeight) : resolveLabelYVertical(y2, side, placedYBySide, labelHeight) : y2;
1283
+ return shouldShow && /*#__PURE__*/_react["default"].createElement("g", {
1122
1284
  key: index
1123
1285
  }, /*#__PURE__*/_react["default"].createElement("path", {
1124
1286
  className: animation ? _piechartModule["default"]["label-line"] : "",
1125
1287
  style: {
1126
1288
  animationDelay: "".concat(animation ? (actualIndex + 1) * ringDuration - labelDuration : 0, "ms")
1127
1289
  },
1128
- d: "M" + x1 + ", " + y1 + "L" + x2 + ", " + y2 + "L" + x3 + ", " + y2,
1290
+ d: "M" + x1 + ", " + y1 + "L" + x2 + ", " + finalY + "L" + x3 + ", " + finalY,
1129
1291
  stroke: lineColor ? lineColor : type == "pure" ? pure : stops[0].color,
1130
1292
  fill: "none"
1131
1293
  }), /*#__PURE__*/_react["default"].createElement("foreignObject", {
1132
1294
  width: "1",
1133
1295
  height: "1",
1134
1296
  x: _x,
1135
- y: y2 + translateY,
1297
+ y: finalY + translateY,
1136
1298
  style: {
1137
1299
  overflow: "visible",
1138
1300
  position: "relative"
1139
1301
  }
1140
1302
  }, /*#__PURE__*/_react["default"].createElement("div", {
1303
+ ref: function ref(el) {
1304
+ if (el) labelElsRef.current[index] = el;else delete labelElsRef.current[index];
1305
+ },
1141
1306
  className: animation ? _piechartModule["default"]["label-text"] : "",
1142
1307
  style: {
1143
1308
  position: isIOS ? "absolute" : "relative",
1144
- transform: isIOS ? "translate(calc(".concat(x3 < 0 ? "-100%" : "0px", " + ").concat(left + _x, "px),calc(-50% + ").concat(top + y2 + translateY, "px))") : "translate(0,-50%)",
1309
+ transform: isIOS ? "translate(calc(".concat(x3 < 0 ? "-100%" : "0px", " + ").concat(left + _x, "px),calc(-50% + ").concat(top + finalY + translateY, "px))") : "translate(0,-50%)",
1145
1310
  whiteSpace: "nowrap",
1146
1311
  "float": x3 >= 0 ? "left" : "right",
1147
1312
  width: "max-content",
@@ -1190,53 +1355,53 @@ function getTranslate(translate, reverse) {
1190
1355
  y = translate.y;
1191
1356
  return "translate(".concat(reverse ? -x : x, "px, ").concat(y, "px)");
1192
1357
  }
1193
- var RingLabel = function RingLabel(_ref12) {
1194
- var _ref12$config = _ref12.config,
1195
- ringDuration = _ref12$config.ringDuration,
1196
- labelDuration = _ref12$config.labelDuration,
1197
- _ref12$config$maxRadi = _ref12$config.maxRadius,
1198
- maxRadius = _ref12$config$maxRadi === void 0 ? 0 : _ref12$config$maxRadi,
1199
- lineLength = _ref12$config.lineLength,
1200
- lineColor = _ref12$config.lineColor,
1201
- distance = _ref12$config.distance,
1202
- mode = _ref12$config.mode,
1203
- _ref12$config$align = _ref12$config.align,
1204
- align = _ref12$config$align === void 0 ? "center" : _ref12$config$align,
1205
- show = _ref12$config.show,
1206
- _ref12$config$transla = _ref12$config.translate,
1207
- translateX = _ref12$config$transla.x,
1208
- translateY = _ref12$config$transla.y,
1209
- _ref12$config$name = _ref12$config.name,
1210
- showName = _ref12$config$name.show,
1211
- nameFont = _ref12$config$name.font,
1212
- maxWidth = _ref12$config$name.maxWidth,
1213
- textOverflow = _ref12$config$name.textOverflow,
1214
- speed = _ref12$config$name.speed,
1215
- nameTranslate = _ref12$config$name.translate,
1216
- _ref12$config$value = _ref12$config.value,
1217
- showValue = _ref12$config$value.show,
1218
- valueFont = _ref12$config$value.font,
1219
- valueSameColor = _ref12$config$value.sameColor,
1220
- _ref12$config$value$s = _ref12$config$value.suffix,
1221
- showSuffix = _ref12$config$value$s.show,
1222
- text = _ref12$config$value$s.text,
1223
- suffixFontSize = _ref12$config$value$s.fontSize,
1224
- _ref12$config$value$s2 = _ref12$config$value$s.translate,
1225
- suffixTranslateX = _ref12$config$value$s2.x,
1226
- suffixTranslateY = _ref12$config$value$s2.y,
1227
- valueTranslate = _ref12$config$value.translate,
1228
- _ref12$config$percent = _ref12$config.percent,
1229
- showPercent = _ref12$config$percent.show,
1230
- percentSameColor = _ref12$config$percent.sameColor,
1231
- percentFont = _ref12$config$percent.font,
1232
- precision = _ref12$config$percent.precision,
1233
- percentTranslate = _ref12$config$percent.translate,
1234
- _ref12$iosStyle = _ref12.iosStyle,
1235
- isIOS = _ref12$iosStyle.isIOS,
1236
- left = _ref12$iosStyle.left,
1237
- top = _ref12$iosStyle.top,
1238
- judge = _ref12.judge,
1239
- arcs = _ref12.arcs;
1358
+ var RingLabel = function RingLabel(_ref21) {
1359
+ var _ref21$config = _ref21.config,
1360
+ ringDuration = _ref21$config.ringDuration,
1361
+ labelDuration = _ref21$config.labelDuration,
1362
+ _ref21$config$maxRadi = _ref21$config.maxRadius,
1363
+ maxRadius = _ref21$config$maxRadi === void 0 ? 0 : _ref21$config$maxRadi,
1364
+ lineLength = _ref21$config.lineLength,
1365
+ lineColor = _ref21$config.lineColor,
1366
+ distance = _ref21$config.distance,
1367
+ mode = _ref21$config.mode,
1368
+ _ref21$config$align = _ref21$config.align,
1369
+ align = _ref21$config$align === void 0 ? "center" : _ref21$config$align,
1370
+ show = _ref21$config.show,
1371
+ _ref21$config$transla = _ref21$config.translate,
1372
+ translateX = _ref21$config$transla.x,
1373
+ translateY = _ref21$config$transla.y,
1374
+ _ref21$config$name = _ref21$config.name,
1375
+ showName = _ref21$config$name.show,
1376
+ nameFont = _ref21$config$name.font,
1377
+ maxWidth = _ref21$config$name.maxWidth,
1378
+ textOverflow = _ref21$config$name.textOverflow,
1379
+ speed = _ref21$config$name.speed,
1380
+ nameTranslate = _ref21$config$name.translate,
1381
+ _ref21$config$value = _ref21$config.value,
1382
+ showValue = _ref21$config$value.show,
1383
+ valueFont = _ref21$config$value.font,
1384
+ valueSameColor = _ref21$config$value.sameColor,
1385
+ _ref21$config$value$s = _ref21$config$value.suffix,
1386
+ showSuffix = _ref21$config$value$s.show,
1387
+ text = _ref21$config$value$s.text,
1388
+ suffixFontSize = _ref21$config$value$s.fontSize,
1389
+ _ref21$config$value$s2 = _ref21$config$value$s.translate,
1390
+ suffixTranslateX = _ref21$config$value$s2.x,
1391
+ suffixTranslateY = _ref21$config$value$s2.y,
1392
+ valueTranslate = _ref21$config$value.translate,
1393
+ _ref21$config$percent = _ref21$config.percent,
1394
+ showPercent = _ref21$config$percent.show,
1395
+ percentSameColor = _ref21$config$percent.sameColor,
1396
+ percentFont = _ref21$config$percent.font,
1397
+ precision = _ref21$config$percent.precision,
1398
+ percentTranslate = _ref21$config$percent.translate,
1399
+ _ref21$iosStyle = _ref21.iosStyle,
1400
+ isIOS = _ref21$iosStyle.isIOS,
1401
+ left = _ref21$iosStyle.left,
1402
+ top = _ref21$iosStyle.top,
1403
+ judge = _ref21.judge,
1404
+ arcs = _ref21.arcs;
1240
1405
  var _arcs = (0, _react.useMemo)(function () {
1241
1406
  return (0, _utils.getDataWithPercent)(arcs, precision);
1242
1407
  }, [arcs, precision]);
@@ -1247,18 +1412,54 @@ var RingLabel = function RingLabel(_ref12) {
1247
1412
  d.percent = 0;
1248
1413
  });
1249
1414
  }
1250
- return /*#__PURE__*/_react["default"].createElement("g", null, _arcs.map(function (_ref13, index) {
1251
- var _ref13$series$color = _ref13.series.color,
1252
- type = _ref13$series$color.type,
1253
- pure = _ref13$series$color.pure,
1254
- stops = _ref13$series$color.linear.stops,
1255
- realData = _ref13.data,
1256
- displayName = _ref13.displayName,
1257
- value = _ref13.value,
1258
- percent = _ref13.percent,
1259
- arc = _ref13.arc,
1260
- outerRadius = _ref13.outerRadius,
1261
- actualIndex = _ref13.index;
1415
+ var isHorizontal = mode === "horizontal";
1416
+ var labelElsRef = (0, _react.useRef)({});
1417
+ var _useState9 = (0, _react.useState)({}),
1418
+ _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
1419
+ measuredHeights = _useState10[0],
1420
+ setMeasuredHeights = _useState10[1];
1421
+
1422
+ // 上下布局:渲染后读取每个标签真实高度(仅在高度变化时更新,避免死循环)
1423
+ (0, _react.useLayoutEffect)(function () {
1424
+ if (isHorizontal) {
1425
+ setMeasuredHeights(function (prev) {
1426
+ return Object.keys(prev).length ? {} : prev;
1427
+ });
1428
+ return;
1429
+ }
1430
+ setMeasuredHeights(function (prev) {
1431
+ var next = {};
1432
+ var changed = false;
1433
+ Object.keys(labelElsRef.current).forEach(function (key) {
1434
+ var el = labelElsRef.current[key];
1435
+ if (!el) return;
1436
+ var h = getLabelDomHeight(el);
1437
+ if (!h) return;
1438
+ next[key] = h;
1439
+ if (prev[key] !== h) changed = true;
1440
+ });
1441
+ var prevKeys = Object.keys(prev);
1442
+ var nextKeys = Object.keys(next);
1443
+ if (prevKeys.length !== nextKeys.length) changed = true;
1444
+ return changed ? next : prev;
1445
+ });
1446
+ }, [isHorizontal, _arcs, mode, showName, showValue, showPercent, showSuffix]);
1447
+ var placedYBySide = {
1448
+ left: [],
1449
+ right: []
1450
+ };
1451
+ return /*#__PURE__*/_react["default"].createElement("g", null, _arcs.map(function (_ref22, index) {
1452
+ var _ref22$series$color = _ref22.series.color,
1453
+ type = _ref22$series$color.type,
1454
+ pure = _ref22$series$color.pure,
1455
+ stops = _ref22$series$color.linear.stops,
1456
+ realData = _ref22.data,
1457
+ displayName = _ref22.displayName,
1458
+ value = _ref22.value,
1459
+ percent = _ref22.percent,
1460
+ arc = _ref22.arc,
1461
+ outerRadius = _ref22.outerRadius,
1462
+ actualIndex = _ref22.index;
1262
1463
  var _arc$centroid3 = arc.centroid(),
1263
1464
  _arc$centroid4 = (0, _slicedToArray2["default"])(_arc$centroid3, 2),
1264
1465
  x = _arc$centroid4[0],
@@ -1274,35 +1475,52 @@ var RingLabel = function RingLabel(_ref12) {
1274
1475
  x2 = _getCoord8[0],
1275
1476
  y2 = _getCoord8[1];
1276
1477
  var directionX = x2 < 0 ? -1 : 1;
1277
- var directionY = y2 < 0 ? -1 : 1;
1278
1478
  var x3 = x2 + lineLength * directionX;
1279
1479
  var _x = x3 + (translateX + 6) * directionX;
1280
1480
  var _showName = showName && displayName;
1281
1481
  var _showValue = showValue && (value || showSuffix);
1282
- return show && (_showName || showPercent || _showValue) && /*#__PURE__*/_react["default"].createElement("g", {
1482
+ var shouldShow = show && (_showName || showPercent || _showValue);
1483
+ // 与真实渲染一致:showValue 开启时值为 0 也会渲染
1484
+ var labelSizeOptions = {
1485
+ showName: _showName,
1486
+ showValue: showValue,
1487
+ showPercent: showPercent,
1488
+ nameFont: nameFont,
1489
+ valueFont: valueFont,
1490
+ percentFont: percentFont
1491
+ };
1492
+ var estimatedHeight = isHorizontal ? getLabelRowHeight(labelSizeOptions) : getLabelColumnHeight(labelSizeOptions);
1493
+ // 上下布局优先用 DOM 实测高度
1494
+ var labelHeight = !isHorizontal && measuredHeights[index] != null ? measuredHeights[index] : estimatedHeight;
1495
+ var side = x2 < 0 ? "left" : "right";
1496
+ var finalY = shouldShow ? isHorizontal ? resolveLabelY(y2, side, placedYBySide, labelHeight) : resolveLabelYVertical(y2, side, placedYBySide, labelHeight) : y2;
1497
+ return shouldShow && /*#__PURE__*/_react["default"].createElement("g", {
1283
1498
  key: index
1284
1499
  }, /*#__PURE__*/_react["default"].createElement("path", {
1285
1500
  className: _piechartModule["default"]["label-line"],
1286
1501
  style: {
1287
1502
  animationDelay: "".concat((actualIndex + 1) * ringDuration - labelDuration, "ms")
1288
1503
  },
1289
- d: "M" + x1 + ", " + y1 + "L" + x2 + ", " + y2 + "L" + x3 + ", " + y2,
1504
+ d: "M" + x1 + ", " + y1 + "L" + x2 + ", " + finalY + "L" + x3 + ", " + finalY,
1290
1505
  stroke: lineColor ? lineColor : type == "pure" ? pure : stops[0].color,
1291
1506
  fill: "none"
1292
1507
  }), /*#__PURE__*/_react["default"].createElement("foreignObject", {
1293
1508
  width: "1",
1294
1509
  height: "1",
1295
1510
  x: _x,
1296
- y: y2 + translateY,
1511
+ y: finalY + translateY,
1297
1512
  style: {
1298
1513
  overflow: "visible",
1299
1514
  position: "relative"
1300
1515
  }
1301
1516
  }, /*#__PURE__*/_react["default"].createElement("div", {
1517
+ ref: function ref(el) {
1518
+ if (el) labelElsRef.current[index] = el;else delete labelElsRef.current[index];
1519
+ },
1302
1520
  className: _piechartModule["default"]["label-text"],
1303
1521
  style: {
1304
1522
  position: isIOS ? "absolute" : "relative",
1305
- transform: isIOS ? "translate(calc(".concat(x3 < 0 ? "-100%" : "0px", " + ").concat(left + _x, "px),calc(-50% + ").concat(top + y2 + translateY, "px))") : "translate(0,-50%)",
1523
+ transform: isIOS ? "translate(calc(".concat(x3 < 0 ? "-100%" : "0px", " + ").concat(left + _x, "px),calc(-50% + ").concat(top + finalY + translateY, "px))") : "translate(0,-50%)",
1306
1524
  whiteSpace: "nowrap",
1307
1525
  "float": x3 >= 0 ? "left" : "right",
1308
1526
  width: "max-content",