@easyv/charts 1.0.61 → 1.0.65
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/Axis.js +1 -1
- package/lib/components/Label.js +8 -3
- package/lib/components/PieChart.js +2 -1
- package/lib/components/Tooltip.js +0 -1
- package/lib/css/index.module.css +1 -1
- package/lib/formatter/legend.js +2 -2
- package/package.json +1 -1
- package/src/components/Axis.tsx +2 -2
- package/src/components/Label.js +6 -3
- package/src/components/PieChart.js +3 -2
- package/src/components/Tooltip.js +0 -1
- package/src/css/index.module.css +1 -1
- package/src/formatter/legend.js +2 -2
- package/tsconfig.json +1 -1
package/lib/components/Axis.js
CHANGED
|
@@ -194,7 +194,7 @@ var Label = function Label(_ref5) {
|
|
|
194
194
|
letterSpacing: letterSpacing,
|
|
195
195
|
dx: "0",
|
|
196
196
|
dy: "0",
|
|
197
|
-
transform: Array.isArray(_label) ? rotate !== 0 ? isVertical ? translateText + 'rotate(' + rotate + ')' : 'rotate(' + rotate + ', ' + x + ', ' + y + ')' : isVertical ? translateText :
|
|
197
|
+
transform: Array.isArray(_label) ? rotate !== 0 ? isVertical ? translateText + 'rotate(' + rotate + ')' : 'rotate(' + rotate + ', ' + x + ', ' + y + ')' : isVertical ? translateText : translateText : translateText + 'rotate(' + rotate + ')'
|
|
198
198
|
}, !!Array.isArray(_label) ? _label.map(function (item, index) {
|
|
199
199
|
return /*#__PURE__*/_react["default"].createElement("tspan", {
|
|
200
200
|
key: index,
|
package/lib/components/Label.js
CHANGED
|
@@ -31,6 +31,7 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
31
31
|
paddingOuter = _ref$config$paddingIn === void 0 ? 0 : _ref$config$paddingIn,
|
|
32
32
|
label = _ref$config.label,
|
|
33
33
|
icon = _ref$config.icon,
|
|
34
|
+
config = _ref.config,
|
|
34
35
|
_ref$bandLength = _ref.bandLength,
|
|
35
36
|
bandLength = _ref$bandLength === void 0 ? 0 : _ref$bandLength,
|
|
36
37
|
data = _ref.data,
|
|
@@ -40,6 +41,8 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
40
41
|
direction = _ref$xAxis.direction,
|
|
41
42
|
yScaler = _ref.yAxis.scaler,
|
|
42
43
|
triggerClick = _ref.triggerClick;
|
|
44
|
+
var lineType = config.hasOwnProperty('line'); //堆叠处理
|
|
45
|
+
|
|
43
46
|
var showIcon = icon && icon.show;
|
|
44
47
|
var showLabel = label && label.show;
|
|
45
48
|
if (!(data.length && (showIcon || showLabel))) return null;
|
|
@@ -75,8 +78,10 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
75
78
|
showY = _ref2$data.showY,
|
|
76
79
|
s = _ref2$data.s;
|
|
77
80
|
|
|
78
|
-
var y1 = yScaler(isVertical ? end : start);
|
|
79
|
-
|
|
81
|
+
var y1 = yScaler(isVertical ? end : start); //处理z型折线图和堆叠柱图的逻辑冲突
|
|
82
|
+
|
|
83
|
+
var y2 = lineType ? start ? yScaler(isVertical ? start : end - start) : yScaler(isVertical ? start : end) : yScaler(isVertical ? start : end); // const y2 = yScaler(isVertical ? start : end);
|
|
84
|
+
|
|
80
85
|
var positionX = xScaler(x) + seriesStep * index - offset / 2;
|
|
81
86
|
if (isNaN(positionX)) return null;
|
|
82
87
|
var position = positionX + seriesWidth / 2;
|
|
@@ -137,7 +142,7 @@ var Label = function Label(_ref3) {
|
|
|
137
142
|
y: y,
|
|
138
143
|
transform: (0, _utils.getTranslate2d)({
|
|
139
144
|
x: translateX,
|
|
140
|
-
y: translateY * (value
|
|
145
|
+
y: translateY * (value >= 0 ? 1 : -1)
|
|
141
146
|
}),
|
|
142
147
|
textAnchor: textAnchor,
|
|
143
148
|
dominantBaseline: dominantBaseline
|
|
@@ -972,6 +972,7 @@ var RingLabel = function RingLabel(_ref12) {
|
|
|
972
972
|
type = _ref13$series$color.type,
|
|
973
973
|
pure = _ref13$series$color.pure,
|
|
974
974
|
stops = _ref13$series$color.linear.stops,
|
|
975
|
+
realData = _ref13.data,
|
|
975
976
|
displayName = _ref13.displayName,
|
|
976
977
|
value = _ref13.value,
|
|
977
978
|
percent = _ref13.percent,
|
|
@@ -1035,7 +1036,7 @@ var RingLabel = function RingLabel(_ref12) {
|
|
|
1035
1036
|
dx: valueDx(_showName, mode),
|
|
1036
1037
|
dy: valueDy(_showName, mode, directionY),
|
|
1037
1038
|
style: (0, _utils.getFontStyle)(valueFont, 'svg')
|
|
1038
|
-
},
|
|
1039
|
+
}, realData.y), showSuffix && /*#__PURE__*/_react["default"].createElement("tspan", {
|
|
1039
1040
|
style: _objectSpread(_objectSpread({}, (0, _utils.getFontStyle)(valueFont, 'svg')), {}, {
|
|
1040
1041
|
fontSize: suffixFontSize
|
|
1041
1042
|
}),
|
|
@@ -106,7 +106,6 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
106
106
|
|
|
107
107
|
return /*#__PURE__*/React.createElement("dd", {
|
|
108
108
|
style: {
|
|
109
|
-
border: '1px solid yellow',
|
|
110
109
|
display: 'flex',
|
|
111
110
|
justifyContent: 'space-between',
|
|
112
111
|
lineHeight: lineHeight + 'px'
|
package/lib/css/index.module.css
CHANGED
package/lib/formatter/legend.js
CHANGED
|
@@ -19,7 +19,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
19
19
|
|
|
20
20
|
var pieLegendFormatter = function pieLegendFormatter(_ref, _ref2) {
|
|
21
21
|
var displayName = _ref.displayName,
|
|
22
|
-
|
|
22
|
+
data = _ref.data,
|
|
23
23
|
percent = _ref.percent,
|
|
24
24
|
_ref$series = _ref.series,
|
|
25
25
|
seriesColor = _ref$series.color,
|
|
@@ -71,7 +71,7 @@ var pieLegendFormatter = function pieLegendFormatter(_ref, _ref2) {
|
|
|
71
71
|
alignItems: 'center',
|
|
72
72
|
justifyContent: 'flex-start'
|
|
73
73
|
})
|
|
74
|
-
}, showValue && /*#__PURE__*/React.createElement("span", null,
|
|
74
|
+
}, showValue && /*#__PURE__*/React.createElement("span", null, data.y), showSuffix && /*#__PURE__*/React.createElement("span", {
|
|
75
75
|
style: {
|
|
76
76
|
fontSize: fontSize,
|
|
77
77
|
transform: 'translate3d(' + x + 'px, ' + y + 'px, 0px)'
|
package/package.json
CHANGED
package/src/components/Axis.tsx
CHANGED
|
@@ -180,7 +180,7 @@ const Label: (props: LabelType) => ReactComponentElement<ComponentType> | null =
|
|
|
180
180
|
translateY * directionY;
|
|
181
181
|
|
|
182
182
|
const translateText = 'translate(' + x + ', ' + y + ')';
|
|
183
|
-
|
|
183
|
+
|
|
184
184
|
return (
|
|
185
185
|
<text
|
|
186
186
|
className={className}
|
|
@@ -202,7 +202,7 @@ const Label: (props: LabelType) => ReactComponentElement<ComponentType> | null =
|
|
|
202
202
|
: 'rotate(' + rotate + ', ' + x + ', ' + y + ')'
|
|
203
203
|
: isVertical
|
|
204
204
|
? translateText
|
|
205
|
-
:
|
|
205
|
+
: translateText
|
|
206
206
|
: translateText + 'rotate(' + rotate + ')'
|
|
207
207
|
}
|
|
208
208
|
>
|
package/src/components/Label.js
CHANGED
|
@@ -17,12 +17,14 @@ export default memo(
|
|
|
17
17
|
label,
|
|
18
18
|
icon,
|
|
19
19
|
},
|
|
20
|
+
config,
|
|
20
21
|
bandLength = 0,
|
|
21
22
|
data,
|
|
22
23
|
xAxis: { scaler: xScaler, step, direction },
|
|
23
24
|
yAxis: { scaler: yScaler },
|
|
24
25
|
triggerClick,
|
|
25
26
|
}) => {
|
|
27
|
+
const lineType = config.hasOwnProperty('line') //堆叠处理
|
|
26
28
|
const showIcon = icon && icon.show;
|
|
27
29
|
const showLabel = label && label.show;
|
|
28
30
|
|
|
@@ -44,9 +46,10 @@ export default memo(
|
|
|
44
46
|
<g className='__easyv-label'>
|
|
45
47
|
{data.map(
|
|
46
48
|
({ index, bound: [start, end], data, data: { x, y, showY, s } }, i) => {
|
|
47
|
-
|
|
48
49
|
const y1 = yScaler(isVertical ? end : start);
|
|
49
|
-
|
|
50
|
+
//处理z型折线图和堆叠柱图的逻辑冲突
|
|
51
|
+
const y2 = lineType ? start ? yScaler(isVertical ? start : end - start) : yScaler(isVertical ? start : end) : yScaler(isVertical ? start : end);
|
|
52
|
+
// const y2 = yScaler(isVertical ? start : end);
|
|
50
53
|
const positionX = xScaler(x) + seriesStep * index - offset / 2;
|
|
51
54
|
if (isNaN(positionX)) return null;
|
|
52
55
|
const position = positionX + seriesWidth / 2;
|
|
@@ -110,7 +113,7 @@ const Label = ({
|
|
|
110
113
|
y={y}
|
|
111
114
|
transform={getTranslate2d({
|
|
112
115
|
x: translateX,
|
|
113
|
-
y: translateY * (value
|
|
116
|
+
y: translateY * (value >= 0 ? 1 : -1),
|
|
114
117
|
})}
|
|
115
118
|
textAnchor={textAnchor}
|
|
116
119
|
dominantBaseline={dominantBaseline}
|
|
@@ -340,7 +340,7 @@ const Component = memo(
|
|
|
340
340
|
outerRadius,
|
|
341
341
|
}));
|
|
342
342
|
}, [data, arcsFunc, chart, legendPrecision]);
|
|
343
|
-
|
|
343
|
+
|
|
344
344
|
const _arcs = useMemo(() => {
|
|
345
345
|
const seriesLength = series.size;
|
|
346
346
|
if (!seriesLength) return [];
|
|
@@ -984,6 +984,7 @@ const RingLabel =({
|
|
|
984
984
|
linear: { stops },
|
|
985
985
|
},
|
|
986
986
|
},
|
|
987
|
+
data:realData,
|
|
987
988
|
displayName,
|
|
988
989
|
value,
|
|
989
990
|
percent,
|
|
@@ -1047,7 +1048,7 @@ const RingLabel =({
|
|
|
1047
1048
|
dy={valueDy(_showName, mode, directionY)}
|
|
1048
1049
|
style={getFontStyle(valueFont, 'svg')}
|
|
1049
1050
|
>
|
|
1050
|
-
{
|
|
1051
|
+
{realData.y}
|
|
1051
1052
|
</tspan>
|
|
1052
1053
|
{showSuffix && (
|
|
1053
1054
|
<tspan
|
package/src/css/index.module.css
CHANGED
package/src/formatter/legend.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import css from '../css/index.module.css';
|
|
2
2
|
import { getFontStyle } from '../utils';
|
|
3
3
|
export const pieLegendFormatter = (
|
|
4
|
-
{ displayName,
|
|
4
|
+
{ displayName, data, percent, series: { color: seriesColor, icon="" } },
|
|
5
5
|
{
|
|
6
6
|
name: { show: showName, font: nameFont },
|
|
7
7
|
value: {
|
|
@@ -57,7 +57,7 @@ export const pieLegendFormatter = (
|
|
|
57
57
|
justifyContent: 'flex-start',
|
|
58
58
|
}}
|
|
59
59
|
>
|
|
60
|
-
{showValue && <span>{
|
|
60
|
+
{showValue && <span>{data.y}</span>}
|
|
61
61
|
{showSuffix && (
|
|
62
62
|
<span
|
|
63
63
|
style={{
|