@easyv/charts 1.10.17 → 1.10.19
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.
|
@@ -146,7 +146,7 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
146
146
|
cPercent: dragPercent,
|
|
147
147
|
cBarX: controlX
|
|
148
148
|
});
|
|
149
|
-
}, [JSON.stringify(control)]);
|
|
149
|
+
}, [JSON.stringify(control), width, height]);
|
|
150
150
|
var svg = (0, _react.useRef)();
|
|
151
151
|
var axes = (0, _hooks.useAxes)({
|
|
152
152
|
axes: axesConfig,
|
|
@@ -59,9 +59,9 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(/*#__PURE__*/(
|
|
|
59
59
|
};
|
|
60
60
|
var controllerStyle = {
|
|
61
61
|
position: "relative",
|
|
62
|
-
width:
|
|
62
|
+
width: 2,
|
|
63
63
|
height: height,
|
|
64
|
-
padding: "0 5px",
|
|
64
|
+
// padding: "0 5px",
|
|
65
65
|
cursor: enableStretch ? "col-resize" : "auto",
|
|
66
66
|
background: "rgb(2, 176, 249)",
|
|
67
67
|
WebkitBackgroundClip: "content-box"
|
|
@@ -268,9 +268,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(/*#__PURE__*/(
|
|
|
268
268
|
ref: ref,
|
|
269
269
|
style: barStyle
|
|
270
270
|
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
271
|
-
style: _objectSpread(
|
|
272
|
-
transform: "translateX(-6px)"
|
|
273
|
-
}),
|
|
271
|
+
style: _objectSpread({}, controllerStyle),
|
|
274
272
|
onMouseDown: leftDown,
|
|
275
273
|
onTouchStart: leftTouchStart
|
|
276
274
|
}), /*#__PURE__*/_react["default"].createElement("div", {
|
|
@@ -279,9 +277,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(/*#__PURE__*/(
|
|
|
279
277
|
onTouchStart: touchStart,
|
|
280
278
|
ref: barRef
|
|
281
279
|
}), /*#__PURE__*/_react["default"].createElement("div", {
|
|
282
|
-
style: _objectSpread(
|
|
283
|
-
transform: "translateX(6px)"
|
|
284
|
-
}),
|
|
280
|
+
style: _objectSpread({}, controllerStyle),
|
|
285
281
|
onMouseDown: rightDown,
|
|
286
282
|
onTouchStart: rightTouchStart
|
|
287
283
|
})));
|
|
@@ -22,7 +22,6 @@ var _formatter = require("../formatter");
|
|
|
22
22
|
var _piechartModule = _interopRequireDefault(require("../css/piechart.module.css"));
|
|
23
23
|
var _hooks = require("../hooks");
|
|
24
24
|
var _PieTooltip = require("./PieTooltip");
|
|
25
|
-
var _legendPlacement = require("../utils/legendPlacement");
|
|
26
25
|
var _excluded = ["startAngle", "endAngle", "antiClockwise"],
|
|
27
26
|
_excluded2 = ["padAngle", "innerRadius", "outerRadius", "cornerRadius", "startAngle", "endAngle"],
|
|
28
27
|
_excluded3 = ["formatter"],
|
|
@@ -35,41 +34,6 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
|
|
|
35
34
|
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; }
|
|
36
35
|
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; }
|
|
37
36
|
var PI = Math.PI;
|
|
38
|
-
var PIE_ADAPTIVE_MARGINS = {
|
|
39
|
-
right: {
|
|
40
|
-
marginTop: 24,
|
|
41
|
-
marginBottom: 24,
|
|
42
|
-
marginLeft: 0,
|
|
43
|
-
marginRight: 200
|
|
44
|
-
},
|
|
45
|
-
left: {
|
|
46
|
-
marginTop: 24,
|
|
47
|
-
marginBottom: 24,
|
|
48
|
-
marginLeft: 200,
|
|
49
|
-
marginRight: 0
|
|
50
|
-
},
|
|
51
|
-
top: {
|
|
52
|
-
marginTop: 110,
|
|
53
|
-
marginBottom: 24,
|
|
54
|
-
marginLeft: 24,
|
|
55
|
-
marginRight: 24
|
|
56
|
-
},
|
|
57
|
-
bottom: {
|
|
58
|
-
marginTop: 24,
|
|
59
|
-
marginBottom: 110,
|
|
60
|
-
marginLeft: 24,
|
|
61
|
-
marginRight: 24
|
|
62
|
-
},
|
|
63
|
-
hidden: {
|
|
64
|
-
marginTop: 24,
|
|
65
|
-
marginBottom: 24,
|
|
66
|
-
marginLeft: 24,
|
|
67
|
-
marginRight: 24
|
|
68
|
-
}
|
|
69
|
-
};
|
|
70
|
-
var getPieAdaptiveMargin = function getPieAdaptiveMargin(show, alignment) {
|
|
71
|
-
return (0, _legendPlacement.getPieAdaptiveMarginPreset)(show, alignment, PIE_ADAPTIVE_MARGINS);
|
|
72
|
-
};
|
|
73
37
|
var defaultChart = {
|
|
74
38
|
outerRadius: 1,
|
|
75
39
|
innerRadius: 0,
|
|
@@ -274,7 +238,6 @@ var getCircleScale = function getCircleScale() {
|
|
|
274
238
|
}));
|
|
275
239
|
};
|
|
276
240
|
var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
|
|
277
|
-
var _legend$config2;
|
|
278
241
|
var width = _ref5.width,
|
|
279
242
|
height = _ref5.height,
|
|
280
243
|
_ref5$config = _ref5.config,
|
|
@@ -358,43 +321,8 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
|
|
|
358
321
|
chartWidth = _useContext.width,
|
|
359
322
|
chartHeight = _useContext.height,
|
|
360
323
|
triggerOnRelative = _useContext.triggerOnRelative,
|
|
361
|
-
onEmit = _useContext.onEmit
|
|
362
|
-
|
|
363
|
-
var _legend$config = legend.config,
|
|
364
|
-
legendShow = _legend$config.show,
|
|
365
|
-
_legend$config$name = _legend$config.name,
|
|
366
|
-
_legend$config$name2 = _legend$config$name === void 0 ? {} : _legend$config$name,
|
|
367
|
-
legendLayoutMode = _legend$config$name2.layoutMode;
|
|
368
|
-
var legendAlignment = (_legend$config2 = legend.config) === null || _legend$config2 === void 0 || (_legend$config2 = _legend$config2.layout) === null || _legend$config2 === void 0 ? void 0 : _legend$config2.alignment;
|
|
369
|
-
var adaptiveMarginPresetKey = (0, _react.useRef)("");
|
|
370
|
-
(0, _react.useEffect)(function () {
|
|
371
|
-
if (legendLayoutMode !== "Adaptive" || !updateConfig) return;
|
|
372
|
-
var presetKey = "".concat(legendLayoutMode, "-").concat(legendShow, "-").concat(legendAlignment);
|
|
373
|
-
if (adaptiveMarginPresetKey.current === presetKey) return;
|
|
374
|
-
adaptiveMarginPresetKey.current = presetKey;
|
|
375
|
-
var target = getPieAdaptiveMargin(legendShow, legendAlignment);
|
|
376
|
-
updateConfig({
|
|
377
|
-
id: id,
|
|
378
|
-
type: "config",
|
|
379
|
-
payload: [{
|
|
380
|
-
path: ["chart", "margin", "marginTop"],
|
|
381
|
-
field: "value",
|
|
382
|
-
value: target.marginTop
|
|
383
|
-
}, {
|
|
384
|
-
path: ["chart", "margin", "marginBottom"],
|
|
385
|
-
field: "value",
|
|
386
|
-
value: target.marginBottom
|
|
387
|
-
}, {
|
|
388
|
-
path: ["chart", "margin", "marginLeft"],
|
|
389
|
-
field: "value",
|
|
390
|
-
value: target.marginLeft
|
|
391
|
-
}, {
|
|
392
|
-
path: ["chart", "margin", "marginRight"],
|
|
393
|
-
field: "value",
|
|
394
|
-
value: target.marginRight
|
|
395
|
-
}]
|
|
396
|
-
});
|
|
397
|
-
}, [id, updateConfig, legendLayoutMode, legendShow, legendAlignment]);
|
|
324
|
+
onEmit = _useContext.onEmit;
|
|
325
|
+
// chart.margin 以用户配置为准;Adaptive 仅走 Legend 侧栏/顶底排版,不再 updateConfig 写预设边距
|
|
398
326
|
var _useState = (0, _react.useState)(1),
|
|
399
327
|
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
400
328
|
y = _useState2[0],
|
package/package.json
CHANGED
|
@@ -43,12 +43,12 @@ export default memo(
|
|
|
43
43
|
};
|
|
44
44
|
const controllerStyle = {
|
|
45
45
|
position: "relative",
|
|
46
|
-
width:
|
|
46
|
+
width: 2,
|
|
47
47
|
height,
|
|
48
|
-
padding: "0 5px",
|
|
48
|
+
// padding: "0 5px",
|
|
49
49
|
cursor: enableStretch ? "col-resize" : "auto",
|
|
50
50
|
background: "rgb(2, 176, 249)",
|
|
51
|
-
WebkitBackgroundClip: "content-box"
|
|
51
|
+
WebkitBackgroundClip: "content-box",
|
|
52
52
|
};
|
|
53
53
|
|
|
54
54
|
//左手柄的鼠标按下逻辑
|
|
@@ -278,7 +278,7 @@ export default memo(
|
|
|
278
278
|
{/* 控制条 */}
|
|
279
279
|
<div ref={ref} style={barStyle}>
|
|
280
280
|
<div
|
|
281
|
-
style={{ ...controllerStyle
|
|
281
|
+
style={{ ...controllerStyle }}
|
|
282
282
|
onMouseDown={leftDown}
|
|
283
283
|
onTouchStart={leftTouchStart}
|
|
284
284
|
></div>
|
|
@@ -289,7 +289,7 @@ export default memo(
|
|
|
289
289
|
ref={barRef}
|
|
290
290
|
></div>
|
|
291
291
|
<div
|
|
292
|
-
style={{ ...controllerStyle
|
|
292
|
+
style={{ ...controllerStyle }}
|
|
293
293
|
onMouseDown={rightDown}
|
|
294
294
|
onTouchStart={rightTouchStart}
|
|
295
295
|
></div>
|
|
@@ -34,21 +34,9 @@ import { pieLegendFormatter as legendFormatter } from "../formatter";
|
|
|
34
34
|
import ringCss from "../css/piechart.module.css";
|
|
35
35
|
import { useAiDataOfPie } from "../hooks";
|
|
36
36
|
import { PieTooltip } from "./PieTooltip";
|
|
37
|
-
import { getPieAdaptiveMarginPreset } from "../utils/legendPlacement";
|
|
38
37
|
|
|
39
38
|
const PI = Math.PI;
|
|
40
39
|
|
|
41
|
-
const PIE_ADAPTIVE_MARGINS = {
|
|
42
|
-
right: { marginTop: 24, marginBottom: 24, marginLeft: 0, marginRight: 200 },
|
|
43
|
-
left: { marginTop: 24, marginBottom: 24, marginLeft: 200, marginRight: 0 },
|
|
44
|
-
top: { marginTop: 110, marginBottom: 24, marginLeft: 24, marginRight: 24 },
|
|
45
|
-
bottom: { marginTop: 24, marginBottom: 110, marginLeft: 24, marginRight: 24 },
|
|
46
|
-
hidden: { marginTop: 24, marginBottom: 24, marginLeft: 24, marginRight: 24 },
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
const getPieAdaptiveMargin = (show, alignment) =>
|
|
50
|
-
getPieAdaptiveMarginPreset(show, alignment, PIE_ADAPTIVE_MARGINS);
|
|
51
|
-
|
|
52
40
|
const defaultChart = {
|
|
53
41
|
outerRadius: 1,
|
|
54
42
|
innerRadius: 0,
|
|
@@ -312,45 +300,8 @@ const Component = memo(
|
|
|
312
300
|
height: chartHeight,
|
|
313
301
|
triggerOnRelative,
|
|
314
302
|
onEmit,
|
|
315
|
-
updateConfig,
|
|
316
303
|
} = useContext(chartContext);
|
|
317
|
-
|
|
318
|
-
legend.config;
|
|
319
|
-
const legendAlignment = legend.config?.layout?.alignment;
|
|
320
|
-
const adaptiveMarginPresetKey = useRef("");
|
|
321
|
-
useEffect(() => {
|
|
322
|
-
if (legendLayoutMode !== "Adaptive" || !updateConfig) return;
|
|
323
|
-
const presetKey = `${legendLayoutMode}-${legendShow}-${legendAlignment}`;
|
|
324
|
-
if (adaptiveMarginPresetKey.current === presetKey) return;
|
|
325
|
-
adaptiveMarginPresetKey.current = presetKey;
|
|
326
|
-
const target = getPieAdaptiveMargin(legendShow, legendAlignment);
|
|
327
|
-
updateConfig({
|
|
328
|
-
id,
|
|
329
|
-
type: "config",
|
|
330
|
-
payload: [
|
|
331
|
-
{
|
|
332
|
-
path: ["chart", "margin", "marginTop"],
|
|
333
|
-
field: "value",
|
|
334
|
-
value: target.marginTop,
|
|
335
|
-
},
|
|
336
|
-
{
|
|
337
|
-
path: ["chart", "margin", "marginBottom"],
|
|
338
|
-
field: "value",
|
|
339
|
-
value: target.marginBottom,
|
|
340
|
-
},
|
|
341
|
-
{
|
|
342
|
-
path: ["chart", "margin", "marginLeft"],
|
|
343
|
-
field: "value",
|
|
344
|
-
value: target.marginLeft,
|
|
345
|
-
},
|
|
346
|
-
{
|
|
347
|
-
path: ["chart", "margin", "marginRight"],
|
|
348
|
-
field: "value",
|
|
349
|
-
value: target.marginRight,
|
|
350
|
-
},
|
|
351
|
-
],
|
|
352
|
-
});
|
|
353
|
-
}, [id, updateConfig, legendLayoutMode, legendShow, legendAlignment]);
|
|
304
|
+
// chart.margin 以用户配置为准;Adaptive 仅走 Legend 侧栏/顶底排版,不再 updateConfig 写预设边距
|
|
354
305
|
const [y, setY] = useState(1);
|
|
355
306
|
const radius = (Math.min(chartWidth, chartHeight) / 2) * outerRadius;
|
|
356
307
|
|