@evergis/charts 2.0.41 → 2.0.44
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/LICENSE +20 -20
- package/README.md +13 -13
- package/dist/charts.cjs.development.js +100 -100
- package/dist/charts.cjs.development.js.map +1 -1
- package/dist/charts.cjs.production.min.js.map +1 -1
- package/dist/charts.esm.js +100 -100
- package/dist/charts.esm.js.map +1 -1
- package/dist/helpers/getLegend/index.d.ts +1 -1
- package/package.json +2 -2
|
@@ -242,7 +242,7 @@ const useSwipe = (node, _ref) => {
|
|
|
242
242
|
};
|
|
243
243
|
|
|
244
244
|
const _excluded = ["children", "width", "onSwipe"];
|
|
245
|
-
const SwipeScroll = _ref => {
|
|
245
|
+
const SwipeScroll = (_ref) => {
|
|
246
246
|
let {
|
|
247
247
|
children,
|
|
248
248
|
width,
|
|
@@ -286,7 +286,7 @@ const getTextAnchor = (index, length) => {
|
|
|
286
286
|
|
|
287
287
|
var _templateObject$2;
|
|
288
288
|
|
|
289
|
-
const getTranslate = _ref => {
|
|
289
|
+
const getTranslate = (_ref) => {
|
|
290
290
|
let {
|
|
291
291
|
anchor,
|
|
292
292
|
index,
|
|
@@ -314,7 +314,7 @@ const LabelContainer = /*#__PURE__*/styled__default.div.attrs(props => ({
|
|
|
314
314
|
}))(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n"])));
|
|
315
315
|
|
|
316
316
|
const labelClassName = 'd3-chart-label';
|
|
317
|
-
const drawRadialLabels = _ref => {
|
|
317
|
+
const drawRadialLabels = (_ref) => {
|
|
318
318
|
let {
|
|
319
319
|
node,
|
|
320
320
|
dataLength,
|
|
@@ -366,7 +366,7 @@ const drawRadialLabels = _ref => {
|
|
|
366
366
|
};
|
|
367
367
|
|
|
368
368
|
var _templateObject$3, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
|
369
|
-
const getTranslate$1 = _ref => {
|
|
369
|
+
const getTranslate$1 = (_ref) => {
|
|
370
370
|
let {
|
|
371
371
|
anchor,
|
|
372
372
|
index,
|
|
@@ -435,13 +435,13 @@ const draw = (node, props) => {
|
|
|
435
435
|
const width = props.width || nodeWidth;
|
|
436
436
|
const defaultHeight = 400;
|
|
437
437
|
const height = props.height || defaultHeight;
|
|
438
|
-
const minValue = props.minValue || Math.min(0, d3.min(data, i => d3.min(i.map(_ref => {
|
|
438
|
+
const minValue = props.minValue || Math.min(0, d3.min(data, i => d3.min(i.map((_ref) => {
|
|
439
439
|
let {
|
|
440
440
|
value
|
|
441
441
|
} = _ref;
|
|
442
442
|
return value;
|
|
443
443
|
}))));
|
|
444
|
-
const maxValue = (props.maxValue || Math.max(0, d3.max(data, i => d3.max(i.map(_ref2 => {
|
|
444
|
+
const maxValue = (props.maxValue || Math.max(0, d3.max(data, i => d3.max(i.map((_ref2) => {
|
|
445
445
|
let {
|
|
446
446
|
value
|
|
447
447
|
} = _ref2;
|
|
@@ -464,14 +464,14 @@ const draw = (node, props) => {
|
|
|
464
464
|
const angleSlice = Math.PI * 2 / data[0].length;
|
|
465
465
|
const radiusScale = d3.scaleLinear().range([0, radius]).domain([0, newMaxValue]);
|
|
466
466
|
const radarLine = d3.lineRadial().curve(d3.curveLinearClosed) // @ts-ignore
|
|
467
|
-
.radius(_ref3 => {
|
|
467
|
+
.radius((_ref3) => {
|
|
468
468
|
let {
|
|
469
469
|
value
|
|
470
470
|
} = _ref3;
|
|
471
471
|
return radiusScale(value);
|
|
472
472
|
}).angle((_, i) => i * angleSlice);
|
|
473
473
|
const radarValue = d3.lineRadial().curve(curve || d3.curveLinearClosed) // @ts-ignore
|
|
474
|
-
.radius(_ref4 => {
|
|
474
|
+
.radius((_ref4) => {
|
|
475
475
|
let {
|
|
476
476
|
value
|
|
477
477
|
} = _ref4;
|
|
@@ -487,7 +487,7 @@ const draw = (node, props) => {
|
|
|
487
487
|
|
|
488
488
|
const gridGlobal = globalCenter.append('g').attr('class', radarChartclassNames.radarAxis).selectAll().data([data[0]]).enter();
|
|
489
489
|
const radarGlobal = globalCenter.append('g').attr('class', radarChartclassNames.radar);
|
|
490
|
-
const axis = gridGlobal.selectAll().data(data[0].map(_ref5 => {
|
|
490
|
+
const axis = gridGlobal.selectAll().data(data[0].map((_ref5) => {
|
|
491
491
|
let {
|
|
492
492
|
name
|
|
493
493
|
} = _ref5;
|
|
@@ -662,7 +662,7 @@ const getAlign = d => {
|
|
|
662
662
|
return midangle < Math.PI ? 'start' : 'end';
|
|
663
663
|
};
|
|
664
664
|
|
|
665
|
-
const drawRadialLabels$1 = _ref => {
|
|
665
|
+
const drawRadialLabels$1 = (_ref) => {
|
|
666
666
|
let {
|
|
667
667
|
arc,
|
|
668
668
|
enableRadialLabels,
|
|
@@ -734,7 +734,7 @@ const Label$1 = /*#__PURE__*/styled__default.div(_templateObject12 || (_template
|
|
|
734
734
|
const LabelTop = /*#__PURE__*/styled__default(Label$1)(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 6px;\n"])));
|
|
735
735
|
const LabelBottom = /*#__PURE__*/styled__default(Label$1)(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n bottom: 6px;\n"])));
|
|
736
736
|
|
|
737
|
-
const drawTooltip = _ref => {
|
|
737
|
+
const drawTooltip = (_ref) => {
|
|
738
738
|
let {
|
|
739
739
|
fullChartTooltip,
|
|
740
740
|
global,
|
|
@@ -757,7 +757,7 @@ const drawTooltip = _ref => {
|
|
|
757
757
|
const tooltipContainer = isEmpty ? d3.select(container).append('div').attr('class', pieChartclassNames.pieTooltipContainer + " " + (tooltipClassName || '')).style('position', 'absolute').style('opacity', '0') : pieTooltipContainer;
|
|
758
758
|
|
|
759
759
|
if (tooltipStyle) {
|
|
760
|
-
Object.entries(tooltipStyle).forEach(_ref2 => {
|
|
760
|
+
Object.entries(tooltipStyle).forEach((_ref2) => {
|
|
761
761
|
let [prop, val] = _ref2;
|
|
762
762
|
return tooltipContainer.style(prop, val);
|
|
763
763
|
});
|
|
@@ -913,7 +913,7 @@ const draw$1 = (node, props) => {
|
|
|
913
913
|
const dividerPadAngle = 100;
|
|
914
914
|
const fullAngle = 360;
|
|
915
915
|
const pie = d3.pie().startAngle(-degreesToRadians(startAngle || 0)).endAngle(degreesToRadians(endAngle || fullAngle)).padAngle(padAngle ? Math.max(Math.min(padAngle / dividerPadAngle, maxPadAngle), 0) : 0).sort(null) // @ts-ignore
|
|
916
|
-
.value(_ref => {
|
|
916
|
+
.value((_ref) => {
|
|
917
917
|
let {
|
|
918
918
|
value
|
|
919
919
|
} = _ref;
|
|
@@ -935,7 +935,7 @@ const draw$1 = (node, props) => {
|
|
|
935
935
|
const format = d3.format(',');
|
|
936
936
|
const allSlices = global.selectAll('allSlices').data(dataReady).enter().append('path') // @ts-ignore
|
|
937
937
|
.attr('d', arc);
|
|
938
|
-
allSlices.attr('class', pieChartclassNames.pieSlice).attr('fill', _ref2 => {
|
|
938
|
+
allSlices.attr('class', pieChartclassNames.pieSlice).attr('fill', (_ref2) => {
|
|
939
939
|
let {
|
|
940
940
|
index
|
|
941
941
|
} = _ref2;
|
|
@@ -1068,7 +1068,7 @@ const legendDefaultParams = {
|
|
|
1068
1068
|
ticksDivier: 64,
|
|
1069
1069
|
titleMarginBottom: 6
|
|
1070
1070
|
};
|
|
1071
|
-
const getLegend = _ref => {
|
|
1071
|
+
const getLegend = (_ref) => {
|
|
1072
1072
|
let {
|
|
1073
1073
|
color,
|
|
1074
1074
|
title,
|
|
@@ -1103,25 +1103,25 @@ const getLegend = _ref => {
|
|
|
1103
1103
|
svg.append('image').attr('x', marginLeft).attr('y', marginTop).attr('class', legendClassNames.legendContainer).attr('width', width - marginLeft - marginRight).attr('height', height - marginTop - marginBottom).attr('preserveAspectRatio', 'none').attr('xlink:href', ramp(color.copy().domain(d3.quantize(d3.interpolate(0, 1), n))).toDataURL());
|
|
1104
1104
|
} // Sequential
|
|
1105
1105
|
else if (color.interpolator) {
|
|
1106
|
-
|
|
1107
|
-
|
|
1108
|
-
|
|
1109
|
-
|
|
1106
|
+
x = Object.assign(color.copy().interpolator(d3.interpolateRound(marginLeft, width - marginRight)), {
|
|
1107
|
+
range() {
|
|
1108
|
+
return [marginLeft, width - marginRight];
|
|
1109
|
+
}
|
|
1110
1110
|
|
|
1111
|
-
|
|
1112
|
-
|
|
1111
|
+
});
|
|
1112
|
+
svg.append('image').attr('x', marginLeft).attr('y', marginTop).attr('width', width - marginLeft - marginRight).attr('height', height - marginTop - marginBottom).attr('preserveAspectRatio', 'none').attr('xlink:href', ramp(color.interpolator()).toDataURL()); // scaleSequentialQuantile doesn’t implement ticks or tickFormat.
|
|
1113
1113
|
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
1117
|
-
|
|
1118
|
-
|
|
1114
|
+
if (!x.ticks) {
|
|
1115
|
+
if (tickValues === undefined) {
|
|
1116
|
+
const n = Math.round(ticks + 1);
|
|
1117
|
+
tickValues = d3.range(n).map(i => d3.quantile(color.domain(), i / (n - 1)));
|
|
1118
|
+
}
|
|
1119
1119
|
|
|
1120
|
-
|
|
1121
|
-
|
|
1120
|
+
if (typeof tickFormat !== 'function') {
|
|
1121
|
+
tickFormat = d3.format(tickFormat === undefined ? ',f' : tickFormat);
|
|
1122
|
+
}
|
|
1122
1123
|
}
|
|
1123
1124
|
}
|
|
1124
|
-
}
|
|
1125
1125
|
|
|
1126
1126
|
svg.append('g').attr('transform', "translate(0," + (height - marginBottom) + ")").call(d3.axisBottom(x).ticks(ticks, typeof tickFormat === 'string' ? tickFormat : undefined) // @ts-ignore
|
|
1127
1127
|
.tickFormat(typeof tickFormat === 'function' ? tickFormat : undefined).tickSize(tickSize) // @ts-ignore
|
|
@@ -1179,13 +1179,13 @@ const draw$2 = (node, props) => {
|
|
|
1179
1179
|
const getMonthSpacing = date => date.getUTCMonth() * (monthSpacing || 0);
|
|
1180
1180
|
|
|
1181
1181
|
const formatMonth = d3.utcFormat('%b');
|
|
1182
|
-
const max = d3.max(data.map(_ref => {
|
|
1182
|
+
const max = d3.max(data.map((_ref) => {
|
|
1183
1183
|
let {
|
|
1184
1184
|
value
|
|
1185
1185
|
} = _ref;
|
|
1186
1186
|
return value;
|
|
1187
1187
|
}));
|
|
1188
|
-
const min = d3.min(data.map(_ref2 => {
|
|
1188
|
+
const min = d3.min(data.map((_ref2) => {
|
|
1189
1189
|
let {
|
|
1190
1190
|
value
|
|
1191
1191
|
} = _ref2;
|
|
@@ -1208,7 +1208,7 @@ const draw$2 = (node, props) => {
|
|
|
1208
1208
|
.data(years).join('div').attr('class', calendarChartClassNames.calendarYear);
|
|
1209
1209
|
const calendarWeekdays = year.append('div').attr('class', calendarChartClassNames.calendarAxis);
|
|
1210
1210
|
calendarWeekdays.append('div').attr('class', calendarChartClassNames.calendarYearTitle) // @ts-ignore
|
|
1211
|
-
.text(_ref3 => {
|
|
1211
|
+
.text((_ref3) => {
|
|
1212
1212
|
let [key] = _ref3;
|
|
1213
1213
|
return key;
|
|
1214
1214
|
});
|
|
@@ -1216,7 +1216,7 @@ const draw$2 = (node, props) => {
|
|
|
1216
1216
|
const body = year.append('div').attr('class', calendarChartClassNames.calendarBody);
|
|
1217
1217
|
const header = body.append('div').attr('class', calendarChartClassNames.calendarHeader);
|
|
1218
1218
|
header.selectAll('div') // @ts-ignore
|
|
1219
|
-
.data(_ref4 => {
|
|
1219
|
+
.data((_ref4) => {
|
|
1220
1220
|
let [_, values] = _ref4;
|
|
1221
1221
|
const fullYearlastMonth = 12;
|
|
1222
1222
|
const fullYearlastDate = 31;
|
|
@@ -1225,7 +1225,7 @@ const draw$2 = (node, props) => {
|
|
|
1225
1225
|
.text(formatMonth); // @ts-ignore
|
|
1226
1226
|
|
|
1227
1227
|
body.append('div').attr('class', calendarChartClassNames.calendarDays).style('height', (cellSize + cellOffset) * weekDays + 'px').style('width', chartWidth + 'px').selectAll('div') // @ts-ignore
|
|
1228
|
-
.data(_ref5 => {
|
|
1228
|
+
.data((_ref5) => {
|
|
1229
1229
|
let [, values] = _ref5;
|
|
1230
1230
|
return values;
|
|
1231
1231
|
}).join('div') // @ts-ignore
|
|
@@ -1353,7 +1353,7 @@ const lineChartClassNames = {
|
|
|
1353
1353
|
const SvgWrapper$3 = /*#__PURE__*/styled__default(Wrapper)(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n .", ",\n .", ",\n .", " {\n shape-rendering: crispEdges;\n }\n .", " {\n fill: none;\n stroke: steelblue;\n stroke-width: 1.5px;\n stroke-linejoin: round;\n stroke-linecap: round;\n }\n .", " {\n fill-opacity: 0.24;\n }\n .", ",\n .", ",\n .", " {\n stroke: rgba(149, 149, 149, 0.24);\n }\n .", ",\n .", " {\n transition: opacity linear 200ms;\n pointer-events: none;\n stroke-width: 1px;\n }\n .", " {\n stroke: #fff;\n stroke-width: 2px;\n }\n .", " {\n shape-rendering: crispEdges;\n }\n .", " {\n fill: none;\n pointer-events: all;\n }\n"])), lineChartClassNames.lineChartYScaleGlobal, lineChartClassNames.lineChartXScaleGlobal, lineChartClassNames.lineChartGridGlobal, lineChartClassNames.lineChartLinesGlobal, lineChartClassNames.lineChartArea, lineChartClassNames.lineChartGridLineX, lineChartClassNames.lineChartGridLineY, lineChartClassNames.lineChartMouseLine, lineChartClassNames.lineChartMouseLine, lineChartClassNames.lineChartMouseCircle, lineChartClassNames.lineChartDot, lineChartClassNames.lineChartMouseLine, lineChartClassNames.lineChartMouseRect);
|
|
1354
1354
|
const TooltipStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject2$2 || (_templateObject2$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n .", " {\n transition: opacity linear 200ms;\n z-index: 1;\n .", " {\n justify-content: flex-start;\n align-items: center;\n pointer-events: none;\n }\n .", " {\n margin: 0 0 0 10px;\n }\n }\n"])), lineChartClassNames.lineChartMouseLabel, lineChartClassNames.lineChartLabelFlex, lineChartClassNames.lineChartLabel);
|
|
1355
1355
|
|
|
1356
|
-
const drawGrid = _ref => {
|
|
1356
|
+
const drawGrid = (_ref) => {
|
|
1357
1357
|
let {
|
|
1358
1358
|
svg,
|
|
1359
1359
|
yScale,
|
|
@@ -1383,7 +1383,7 @@ const LabelContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$9 || (
|
|
|
1383
1383
|
const Label$2 = /*#__PURE__*/styled__default.div(_templateObject2$3 || (_templateObject2$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 4px;\n"])));
|
|
1384
1384
|
|
|
1385
1385
|
const labelClassName$1 = 'd3-chart-label';
|
|
1386
|
-
const drawLabel = _ref => {
|
|
1386
|
+
const drawLabel = (_ref) => {
|
|
1387
1387
|
let {
|
|
1388
1388
|
node,
|
|
1389
1389
|
data,
|
|
@@ -1395,7 +1395,7 @@ const drawLabel = _ref => {
|
|
|
1395
1395
|
const labelsDiv = d3.select(node).append('div').attr('class', labelClassName$1);
|
|
1396
1396
|
const format = d3.format(','); // @ts-ignore
|
|
1397
1397
|
|
|
1398
|
-
data.forEach(_ref2 => {
|
|
1398
|
+
data.forEach((_ref2) => {
|
|
1399
1399
|
let {
|
|
1400
1400
|
values
|
|
1401
1401
|
} = _ref2;
|
|
@@ -1412,7 +1412,7 @@ const drawLabel = _ref => {
|
|
|
1412
1412
|
};
|
|
1413
1413
|
|
|
1414
1414
|
const _excluded$1 = ["values"];
|
|
1415
|
-
const drawTooltip$1 = _ref => {
|
|
1415
|
+
const drawTooltip$1 = (_ref) => {
|
|
1416
1416
|
let {
|
|
1417
1417
|
svg,
|
|
1418
1418
|
node,
|
|
@@ -1430,7 +1430,7 @@ const drawTooltip$1 = _ref => {
|
|
|
1430
1430
|
} = _ref;
|
|
1431
1431
|
const container = tooltipRoot || document.querySelector('body');
|
|
1432
1432
|
const format = d3.format(',');
|
|
1433
|
-
const chartData = argData.filter(_ref2 => {
|
|
1433
|
+
const chartData = argData.filter((_ref2) => {
|
|
1434
1434
|
let {
|
|
1435
1435
|
tooltipOff
|
|
1436
1436
|
} = _ref2;
|
|
@@ -1443,17 +1443,17 @@ const drawTooltip$1 = _ref => {
|
|
|
1443
1443
|
const mouseRect = mouseGlobal.append('rect').attr('width', x2 - x1).attr('height', Math.abs(y1 - y2)).attr('class', lineChartClassNames.lineChartMouseRect).attr('transform', "translate(" + x1 + ", " + y2 + ")");
|
|
1444
1444
|
const mouseLine = mouseGlobal.append('path').attr('class', lineChartClassNames.lineChartMouseLine).style('opacity', '0');
|
|
1445
1445
|
const lines = svg.selectAll("." + lineChartClassNames.lineChartLine).nodes();
|
|
1446
|
-
const circles = mouseGlobal.selectAll('circle').data(chartData.filter(_ref3 => {
|
|
1446
|
+
const circles = mouseGlobal.selectAll('circle').data(chartData.filter((_ref3) => {
|
|
1447
1447
|
let {
|
|
1448
1448
|
dynamicDotOff
|
|
1449
1449
|
} = _ref3;
|
|
1450
1450
|
return !dynamicDotOff;
|
|
1451
|
-
})).join('circle').attr('class', lineChartClassNames.lineChartMouseCircle).attr('r', dynamicCircleRadius).attr('fill', _ref4 => {
|
|
1451
|
+
})).join('circle').attr('class', lineChartClassNames.lineChartMouseCircle).attr('r', dynamicCircleRadius).attr('fill', (_ref4) => {
|
|
1452
1452
|
let {
|
|
1453
1453
|
stroke
|
|
1454
1454
|
} = _ref4;
|
|
1455
1455
|
return stroke || 'none';
|
|
1456
|
-
}).attr('stroke', _ref5 => {
|
|
1456
|
+
}).attr('stroke', (_ref5) => {
|
|
1457
1457
|
let {
|
|
1458
1458
|
stroke
|
|
1459
1459
|
} = _ref5;
|
|
@@ -1518,7 +1518,7 @@ const drawTooltip$1 = _ref => {
|
|
|
1518
1518
|
circles.attr('transform', (lineChartData, index) => {
|
|
1519
1519
|
const value = getValue(lineChartData.values);
|
|
1520
1520
|
return positions[index] && value ? 'translate(' + x + ',' + positions[index].y + ')' : 'translate(-9999, -9999)';
|
|
1521
|
-
}).attr('style', _ref6 => {
|
|
1521
|
+
}).attr('style', (_ref6) => {
|
|
1522
1522
|
let {
|
|
1523
1523
|
dynamicDotStyle
|
|
1524
1524
|
} = _ref6;
|
|
@@ -1535,7 +1535,7 @@ const drawTooltip$1 = _ref => {
|
|
|
1535
1535
|
invertValue: positions[i] ? yScale.invert(positions[i].y) : 0
|
|
1536
1536
|
});
|
|
1537
1537
|
});
|
|
1538
|
-
const noHasData = datas.every(_ref8 => {
|
|
1538
|
+
const noHasData = datas.every((_ref8) => {
|
|
1539
1539
|
let {
|
|
1540
1540
|
value
|
|
1541
1541
|
} = _ref8;
|
|
@@ -1652,13 +1652,13 @@ const draw$3 = (node, props) => {
|
|
|
1652
1652
|
} = node.getBoundingClientRect();
|
|
1653
1653
|
const width = props.width || nodeWidth;
|
|
1654
1654
|
const height = props.height || 0;
|
|
1655
|
-
const min = typeof props.min === 'number' ? props.min : d3.min(data, _ref => {
|
|
1655
|
+
const min = typeof props.min === 'number' ? props.min : d3.min(data, (_ref) => {
|
|
1656
1656
|
let {
|
|
1657
1657
|
values
|
|
1658
1658
|
} = _ref;
|
|
1659
1659
|
return d3.min(values);
|
|
1660
1660
|
});
|
|
1661
|
-
const max = typeof props.max === 'number' ? props.max : d3.max(data, _ref2 => {
|
|
1661
|
+
const max = typeof props.max === 'number' ? props.max : d3.max(data, (_ref2) => {
|
|
1662
1662
|
let {
|
|
1663
1663
|
values
|
|
1664
1664
|
} = _ref2;
|
|
@@ -1715,7 +1715,7 @@ const draw$3 = (node, props) => {
|
|
|
1715
1715
|
|
|
1716
1716
|
const line = d3.line().defined(d => d !== null).x((_, index) => xScale(index)).y(d => yScale(d)).curve(curve || d3.curveLinear);
|
|
1717
1717
|
customLine && customLine(line);
|
|
1718
|
-
const withAreas = data.some(_ref4 => {
|
|
1718
|
+
const withAreas = data.some((_ref4) => {
|
|
1719
1719
|
let {
|
|
1720
1720
|
fill
|
|
1721
1721
|
} = _ref4;
|
|
@@ -1748,7 +1748,7 @@ const draw$3 = (node, props) => {
|
|
|
1748
1748
|
}).y1(d => yScale(d)).curve(areaCurve || curve || d3.curveLinear);
|
|
1749
1749
|
};
|
|
1750
1750
|
|
|
1751
|
-
svg.append('g').attr('class', lineChartClassNames.lineChartAreasGlobal).selectAll('path').data(data.filter(_ref5 => {
|
|
1751
|
+
svg.append('g').attr('class', lineChartClassNames.lineChartAreasGlobal).selectAll('path').data(data.filter((_ref5) => {
|
|
1752
1752
|
let {
|
|
1753
1753
|
fill
|
|
1754
1754
|
} = _ref5;
|
|
@@ -1756,12 +1756,12 @@ const draw$3 = (node, props) => {
|
|
|
1756
1756
|
})).join('path').attr('class', lineChartClassNames.lineChartArea).attr('d', d => {
|
|
1757
1757
|
const area = getArea(d);
|
|
1758
1758
|
return area(d.values);
|
|
1759
|
-
}).attr('fill', _ref6 => {
|
|
1759
|
+
}).attr('fill', (_ref6) => {
|
|
1760
1760
|
let {
|
|
1761
1761
|
fill
|
|
1762
1762
|
} = _ref6;
|
|
1763
1763
|
return fill || 'none';
|
|
1764
|
-
}).attr('style', _ref7 => {
|
|
1764
|
+
}).attr('style', (_ref7) => {
|
|
1765
1765
|
let {
|
|
1766
1766
|
areaStyle
|
|
1767
1767
|
} = _ref7;
|
|
@@ -1769,18 +1769,18 @@ const draw$3 = (node, props) => {
|
|
|
1769
1769
|
});
|
|
1770
1770
|
}
|
|
1771
1771
|
|
|
1772
|
-
svg.append('g').attr('class', lineChartClassNames.lineChartLinesGlobal).selectAll('path').data(data).join('path').attr('class', lineChartClassNames.lineChartLine).attr('d', d => line(d.values)).attr('stroke', _ref8 => {
|
|
1772
|
+
svg.append('g').attr('class', lineChartClassNames.lineChartLinesGlobal).selectAll('path').data(data).join('path').attr('class', lineChartClassNames.lineChartLine).attr('d', d => line(d.values)).attr('stroke', (_ref8) => {
|
|
1773
1773
|
let {
|
|
1774
1774
|
stroke
|
|
1775
1775
|
} = _ref8;
|
|
1776
1776
|
return stroke || 'steelblue';
|
|
1777
|
-
}).attr('style', _ref9 => {
|
|
1777
|
+
}).attr('style', (_ref9) => {
|
|
1778
1778
|
let {
|
|
1779
1779
|
style
|
|
1780
1780
|
} = _ref9;
|
|
1781
1781
|
return style || '';
|
|
1782
1782
|
});
|
|
1783
|
-
const dots = data.filter(_ref10 => {
|
|
1783
|
+
const dots = data.filter((_ref10) => {
|
|
1784
1784
|
let {
|
|
1785
1785
|
dot
|
|
1786
1786
|
} = _ref10;
|
|
@@ -1886,7 +1886,7 @@ const barChartLinesClassNames = {
|
|
|
1886
1886
|
barChartAreasGlobal: 'barChartAreasGlobal',
|
|
1887
1887
|
barChartArea: 'barChartArea'
|
|
1888
1888
|
};
|
|
1889
|
-
const drawLines = _ref => {
|
|
1889
|
+
const drawLines = (_ref) => {
|
|
1890
1890
|
let {
|
|
1891
1891
|
svg,
|
|
1892
1892
|
lineData,
|
|
@@ -1902,13 +1902,13 @@ const drawLines = _ref => {
|
|
|
1902
1902
|
const line = d3.line().defined(d => d !== null).x((_, index) => xScale(index) + bandwidth / 2) // @ts-ignore
|
|
1903
1903
|
.y(d => yScale(d)).curve(curve || d3.curveLinear);
|
|
1904
1904
|
const bandwidth = xScale.bandwidth();
|
|
1905
|
-
const linesData = lineData.filter(_ref2 => {
|
|
1905
|
+
const linesData = lineData.filter((_ref2) => {
|
|
1906
1906
|
let {
|
|
1907
1907
|
lineType
|
|
1908
1908
|
} = _ref2;
|
|
1909
1909
|
return lineType === 'line';
|
|
1910
1910
|
});
|
|
1911
|
-
const areasData = lineData.filter(_ref3 => {
|
|
1911
|
+
const areasData = lineData.filter((_ref3) => {
|
|
1912
1912
|
let {
|
|
1913
1913
|
lineType
|
|
1914
1914
|
} = _ref3;
|
|
@@ -1916,12 +1916,12 @@ const drawLines = _ref => {
|
|
|
1916
1916
|
});
|
|
1917
1917
|
|
|
1918
1918
|
if (linesData.length > 0) {
|
|
1919
|
-
linesSelection = svg.append('g').attr('class', barChartLinesClassNames.barChartLinesGlobal).selectAll('path').data(linesData).join('path').attr('class', barChartLinesClassNames.barChartLine).attr('d', d => line(d.values)).attr('stroke', _ref4 => {
|
|
1919
|
+
linesSelection = svg.append('g').attr('class', barChartLinesClassNames.barChartLinesGlobal).selectAll('path').data(linesData).join('path').attr('class', barChartLinesClassNames.barChartLine).attr('d', d => line(d.values)).attr('stroke', (_ref4) => {
|
|
1920
1920
|
let {
|
|
1921
1921
|
stroke
|
|
1922
1922
|
} = _ref4;
|
|
1923
1923
|
return stroke || '';
|
|
1924
|
-
}).attr('fill', _ref5 => {
|
|
1924
|
+
}).attr('fill', (_ref5) => {
|
|
1925
1925
|
let {
|
|
1926
1926
|
fill
|
|
1927
1927
|
} = _ref5;
|
|
@@ -1939,7 +1939,7 @@ const drawLines = _ref => {
|
|
|
1939
1939
|
return stackedLine ? dataIndex > -1 ? yScale(typeof lineData[dataIndex].values[index] !== 'number' ? 0 : lineData[dataIndex].values[index]) : yScale(min) : yScale(min);
|
|
1940
1940
|
}) // @ts-ignore
|
|
1941
1941
|
.y1(d => yScale(d)).curve(curve || d3.curveLinear);
|
|
1942
|
-
areasSelection = svg.append('g').attr('class', barChartLinesClassNames.barChartAreasGlobal).selectAll('path').data(areasData).join('path').attr('class', barChartLinesClassNames.barChartArea).attr('d', d => area && area(d.values)).attr('fill', _ref6 => {
|
|
1942
|
+
areasSelection = svg.append('g').attr('class', barChartLinesClassNames.barChartAreasGlobal).selectAll('path').data(areasData).join('path').attr('class', barChartLinesClassNames.barChartArea).attr('d', d => area && area(d.values)).attr('fill', (_ref6) => {
|
|
1943
1943
|
let {
|
|
1944
1944
|
fill
|
|
1945
1945
|
} = _ref6;
|
|
@@ -1989,7 +1989,7 @@ const barChartClassNames = /*#__PURE__*/_extends({
|
|
|
1989
1989
|
const SvgWrapper$4 = /*#__PURE__*/styled__default(Wrapper)(_templateObject$a || (_templateObject$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line {\n stroke-width: 1px;\n shape-rendering: crispEdges;\n }\n .", ",\n .", " {\n stroke: rgba(48, 69, 79, 0.06);\n }\n .", " {\n }\n .", " {\n fill: none;\n pointer-events: all;\n }\n .", " {\n stroke-width: 1.5px;\n stroke-linejoin: round;\n stroke-linecap: round;\n }\n .", " {\n shape-rendering: auto;\n }\n .", " {\n fill-opacity: 0.24;\n }\n"])), barChartClassNames.barChartGridLineX, barChartClassNames.barChartGridLineY, barChartClassNames.barChartMouseRect, barChartClassNames.barChartMouseRect, barChartClassNames.barChartLinesGlobal, barChartClassNames.barChartLine, barChartClassNames.barChartArea);
|
|
1990
1990
|
const TooltipStyles$1 = /*#__PURE__*/styled.createGlobalStyle(_templateObject2$4 || (_templateObject2$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n .", " {\n z-index: 1;\n transition: all linear 144ms;\n\n .", " {\n margin-bottom: 4px;\n :last-of-type {\n margin-bottom: 0;\n }\n }\n }\n"])), barChartClassNames.barChartMouseTooltip, barChartClassNames.barChartTooltipItem);
|
|
1991
1991
|
|
|
1992
|
-
const drawGrid$1 = _ref => {
|
|
1992
|
+
const drawGrid$1 = (_ref) => {
|
|
1993
1993
|
let {
|
|
1994
1994
|
svg,
|
|
1995
1995
|
yScale,
|
|
@@ -2018,7 +2018,7 @@ const drawGrid$1 = _ref => {
|
|
|
2018
2018
|
};
|
|
2019
2019
|
|
|
2020
2020
|
const _excluded$2 = ["groupName"];
|
|
2021
|
-
const getDomain = _ref => {
|
|
2021
|
+
const getDomain = (_ref) => {
|
|
2022
2022
|
let {
|
|
2023
2023
|
data,
|
|
2024
2024
|
minDomainValue,
|
|
@@ -2026,7 +2026,7 @@ const getDomain = _ref => {
|
|
|
2026
2026
|
} = _ref;
|
|
2027
2027
|
let MIN = Number.POSITIVE_INFINITY;
|
|
2028
2028
|
let MAX = Number.NEGATIVE_INFINITY;
|
|
2029
|
-
data.forEach(_ref2 => {
|
|
2029
|
+
data.forEach((_ref2) => {
|
|
2030
2030
|
let groups = _objectWithoutPropertiesLoose(_ref2, _excluded$2);
|
|
2031
2031
|
|
|
2032
2032
|
let groupMax = 0;
|
|
@@ -2065,7 +2065,7 @@ const getDomain = _ref => {
|
|
|
2065
2065
|
};
|
|
2066
2066
|
|
|
2067
2067
|
const _excluded$3 = ["groupName"];
|
|
2068
|
-
const marshaling = _ref => {
|
|
2068
|
+
const marshaling = (_ref) => {
|
|
2069
2069
|
let {
|
|
2070
2070
|
data,
|
|
2071
2071
|
yScale,
|
|
@@ -2151,7 +2151,7 @@ const getLabel = labelPosition => {
|
|
|
2151
2151
|
};
|
|
2152
2152
|
|
|
2153
2153
|
const _excluded$4 = ["values"];
|
|
2154
|
-
const drawTooltip$2 = _ref => {
|
|
2154
|
+
const drawTooltip$2 = (_ref) => {
|
|
2155
2155
|
let {
|
|
2156
2156
|
svg,
|
|
2157
2157
|
node,
|
|
@@ -2194,7 +2194,7 @@ const drawTooltip$2 = _ref => {
|
|
|
2194
2194
|
lineData,
|
|
2195
2195
|
yScale
|
|
2196
2196
|
}) : marshalledData.reduce((acc, curr, index) => {
|
|
2197
|
-
const lineMin = d3.min(lineData, _ref2 => {
|
|
2197
|
+
const lineMin = d3.min(lineData, (_ref2) => {
|
|
2198
2198
|
let {
|
|
2199
2199
|
values
|
|
2200
2200
|
} = _ref2;
|
|
@@ -2286,7 +2286,7 @@ const drawTooltip$2 = _ref => {
|
|
|
2286
2286
|
}
|
|
2287
2287
|
|
|
2288
2288
|
if (lineData) {
|
|
2289
|
-
const currLineData = lineData.map(_ref4 => {
|
|
2289
|
+
const currLineData = lineData.map((_ref4) => {
|
|
2290
2290
|
let {
|
|
2291
2291
|
values
|
|
2292
2292
|
} = _ref4,
|
|
@@ -2336,7 +2336,7 @@ const drawTooltip$2 = _ref => {
|
|
|
2336
2336
|
className: barChartClassNames.barChartTooltip
|
|
2337
2337
|
}, currData && currData[0] && React__default.createElement(TooltipGroupName, {
|
|
2338
2338
|
className: barChartClassNames.barChartTooltipGroupName
|
|
2339
|
-
}, currData[0].groupName), currData && currData.map(_ref5 => {
|
|
2339
|
+
}, currData[0].groupName), currData && currData.map((_ref5) => {
|
|
2340
2340
|
let {
|
|
2341
2341
|
name,
|
|
2342
2342
|
value,
|
|
@@ -2382,7 +2382,7 @@ const drawTooltip$2 = _ref => {
|
|
|
2382
2382
|
const labelContainer = container.append('div').attr('class', barChartClassNames.barChartLabelContainer).style('position', 'absolute').style('top', y2 + "px");
|
|
2383
2383
|
|
|
2384
2384
|
if (labelPosition) {
|
|
2385
|
-
const concatedData = lineData ? marshalledData.map((stack, index) => stack.concat(lineData.map(_ref6 => {
|
|
2385
|
+
const concatedData = lineData ? marshalledData.map((stack, index) => stack.concat(lineData.map((_ref6) => {
|
|
2386
2386
|
let {
|
|
2387
2387
|
values,
|
|
2388
2388
|
name,
|
|
@@ -2438,7 +2438,7 @@ const drawTooltip$2 = _ref => {
|
|
|
2438
2438
|
};
|
|
2439
2439
|
|
|
2440
2440
|
const _excluded$5 = ["groupName"];
|
|
2441
|
-
const resizeBarWidth = _ref => {
|
|
2441
|
+
const resizeBarWidth = (_ref) => {
|
|
2442
2442
|
let {
|
|
2443
2443
|
data,
|
|
2444
2444
|
range,
|
|
@@ -2461,7 +2461,7 @@ const resizeBarWidth = _ref => {
|
|
|
2461
2461
|
return barWidth;
|
|
2462
2462
|
};
|
|
2463
2463
|
|
|
2464
|
-
const getBars = _ref => {
|
|
2464
|
+
const getBars = (_ref) => {
|
|
2465
2465
|
let {
|
|
2466
2466
|
groups,
|
|
2467
2467
|
barWidth
|
|
@@ -2532,13 +2532,13 @@ const draw$4 = (node, props) => {
|
|
|
2532
2532
|
minDomainValue,
|
|
2533
2533
|
maxDomainValue
|
|
2534
2534
|
});
|
|
2535
|
-
const min = typeof minValue === 'number' ? minValue : Math.min(d3.min(lineData, _ref => {
|
|
2535
|
+
const min = typeof minValue === 'number' ? minValue : Math.min(d3.min(lineData, (_ref) => {
|
|
2536
2536
|
let {
|
|
2537
2537
|
values
|
|
2538
2538
|
} = _ref;
|
|
2539
2539
|
return d3.min(values);
|
|
2540
2540
|
}) || Number.POSITIVE_INFINITY, barDomain.min || 0);
|
|
2541
|
-
const max = typeof maxValue === 'number' ? maxValue : Math.max(d3.max(lineData, _ref2 => {
|
|
2541
|
+
const max = typeof maxValue === 'number' ? maxValue : Math.max(d3.max(lineData, (_ref2) => {
|
|
2542
2542
|
let {
|
|
2543
2543
|
values
|
|
2544
2544
|
} = _ref2;
|
|
@@ -2725,7 +2725,7 @@ BarChart.defaultProps = {
|
|
|
2725
2725
|
|
|
2726
2726
|
const _excluded$6 = ["value"];
|
|
2727
2727
|
const hundred = 100;
|
|
2728
|
-
const useMarshaling = _ref => {
|
|
2728
|
+
const useMarshaling = (_ref) => {
|
|
2729
2729
|
let {
|
|
2730
2730
|
data,
|
|
2731
2731
|
fullExtent,
|
|
@@ -2733,7 +2733,7 @@ const useMarshaling = _ref => {
|
|
|
2733
2733
|
labels
|
|
2734
2734
|
} = _ref;
|
|
2735
2735
|
return React.useMemo(() => {
|
|
2736
|
-
const fullMax = d3.max(data, item => d3.sum(item, _ref2 => {
|
|
2736
|
+
const fullMax = d3.max(data, item => d3.sum(item, (_ref2) => {
|
|
2737
2737
|
let {
|
|
2738
2738
|
value
|
|
2739
2739
|
} = _ref2;
|
|
@@ -2744,7 +2744,7 @@ const useMarshaling = _ref => {
|
|
|
2744
2744
|
fullMax,
|
|
2745
2745
|
data: data.map((item, index) => {
|
|
2746
2746
|
if (!fullExtent) {
|
|
2747
|
-
scaleLinear.domain([0, typeof maxValue === 'number' ? maxValue : d3.sum(item, _ref3 => {
|
|
2747
|
+
scaleLinear.domain([0, typeof maxValue === 'number' ? maxValue : d3.sum(item, (_ref3) => {
|
|
2748
2748
|
let {
|
|
2749
2749
|
value
|
|
2750
2750
|
} = _ref3;
|
|
@@ -2752,7 +2752,7 @@ const useMarshaling = _ref => {
|
|
|
2752
2752
|
})]);
|
|
2753
2753
|
}
|
|
2754
2754
|
|
|
2755
|
-
return item.map(_ref4 => {
|
|
2755
|
+
return item.map((_ref4) => {
|
|
2756
2756
|
let {
|
|
2757
2757
|
value
|
|
2758
2758
|
} = _ref4,
|
|
@@ -2801,7 +2801,7 @@ const StackSumContainer = /*#__PURE__*/styled__default.div(_templateObject6$2 ||
|
|
|
2801
2801
|
const StackSum = /*#__PURE__*/styled__default.div(_templateObject7$1 || (_templateObject7$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n white-space: nowrap;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(0, -50%);\n"])));
|
|
2802
2802
|
const StackWrapper = /*#__PURE__*/styled__default.div(_templateObject8$1 || (_templateObject8$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n display: flex;\n justify-content: flex-start;\n height: 100%;\n"])));
|
|
2803
2803
|
|
|
2804
|
-
const Tooltip = _ref => {
|
|
2804
|
+
const Tooltip = (_ref) => {
|
|
2805
2805
|
let {
|
|
2806
2806
|
renderTooltip,
|
|
2807
2807
|
bars,
|
|
@@ -2837,7 +2837,7 @@ const Tooltip = _ref => {
|
|
|
2837
2837
|
};
|
|
2838
2838
|
|
|
2839
2839
|
const rootElement = /*#__PURE__*/document.createElement('div');
|
|
2840
|
-
const useTooltip = _ref => {
|
|
2840
|
+
const useTooltip = (_ref) => {
|
|
2841
2841
|
let {
|
|
2842
2842
|
renderTooltip,
|
|
2843
2843
|
tooltipBind,
|
|
@@ -2891,7 +2891,7 @@ const useTooltip = _ref => {
|
|
|
2891
2891
|
|
|
2892
2892
|
const _excluded$7 = ["item", "mouseMove", "mouseLeave", "tooltipBind"];
|
|
2893
2893
|
const useStackWrapper = stackedTooltip => {
|
|
2894
|
-
return React.useMemo(() => stackedTooltip ? _ref => {
|
|
2894
|
+
return React.useMemo(() => stackedTooltip ? (_ref) => {
|
|
2895
2895
|
let {
|
|
2896
2896
|
item,
|
|
2897
2897
|
mouseMove,
|
|
@@ -2906,7 +2906,7 @@ const useStackWrapper = stackedTooltip => {
|
|
|
2906
2906
|
onMouseMove: tooltipBind ? event => mouseMove(event, item) : void 0,
|
|
2907
2907
|
onMouseOut: mouseLeave
|
|
2908
2908
|
}, props));
|
|
2909
|
-
} : _ref2 => {
|
|
2909
|
+
} : (_ref2) => {
|
|
2910
2910
|
let {
|
|
2911
2911
|
children
|
|
2912
2912
|
} = _ref2;
|
|
@@ -2917,7 +2917,7 @@ const useStackWrapper = stackedTooltip => {
|
|
|
2917
2917
|
var _templateObject$c;
|
|
2918
2918
|
const BarStyled = /*#__PURE__*/styled__default.div(_templateObject$c || (_templateObject$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-flex;\n height: 100%;\n"])));
|
|
2919
2919
|
|
|
2920
|
-
const Bar = _ref => {
|
|
2920
|
+
const Bar = (_ref) => {
|
|
2921
2921
|
let {
|
|
2922
2922
|
withTooltip,
|
|
2923
2923
|
bar,
|
|
@@ -2952,7 +2952,7 @@ const Bar = _ref => {
|
|
|
2952
2952
|
};
|
|
2953
2953
|
|
|
2954
2954
|
const hundred$1 = 100;
|
|
2955
|
-
const useScale = _ref => {
|
|
2955
|
+
const useScale = (_ref) => {
|
|
2956
2956
|
let {
|
|
2957
2957
|
maxValue,
|
|
2958
2958
|
scaleTicks,
|
|
@@ -2973,7 +2973,7 @@ const TickTd = /*#__PURE__*/styled__default.td(_templateObject$d || (_templateOb
|
|
|
2973
2973
|
const Ticks = /*#__PURE__*/styled__default.div(_templateObject2$6 || (_templateObject2$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 1rem;\n"])));
|
|
2974
2974
|
const Tick = /*#__PURE__*/styled__default.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n white-space: nowrap;\n width: 0;\n height: 0;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
2975
2975
|
|
|
2976
|
-
const XScale = _ref => {
|
|
2976
|
+
const XScale = (_ref) => {
|
|
2977
2977
|
let {
|
|
2978
2978
|
maxValue,
|
|
2979
2979
|
scaleTicks,
|
|
@@ -3006,7 +3006,7 @@ const XScale = _ref => {
|
|
|
3006
3006
|
}))));
|
|
3007
3007
|
};
|
|
3008
3008
|
|
|
3009
|
-
const HorizontalBarChart = _ref => {
|
|
3009
|
+
const HorizontalBarChart = (_ref) => {
|
|
3010
3010
|
let {
|
|
3011
3011
|
data,
|
|
3012
3012
|
className,
|
|
@@ -3057,13 +3057,13 @@ const HorizontalBarChart = _ref => {
|
|
|
3057
3057
|
onMouseMove: fullChartTooltip ? event => mouseMove(event, marshalingData.flat()) : void 0,
|
|
3058
3058
|
onMouseOut: fullChartTooltip ? mouseLeave : void 0
|
|
3059
3059
|
}, thead, React__default.createElement("tbody", null, marshalingData.map((item, rowIndex) => {
|
|
3060
|
-
const stackSum = (withStackSum || renderDataTable) && d3.sum(item, _ref2 => {
|
|
3060
|
+
const stackSum = (withStackSum || renderDataTable) && d3.sum(item, (_ref2) => {
|
|
3061
3061
|
let {
|
|
3062
3062
|
value
|
|
3063
3063
|
} = _ref2;
|
|
3064
3064
|
return value;
|
|
3065
3065
|
});
|
|
3066
|
-
const sumWidth = d3.sum(item, _ref3 => {
|
|
3066
|
+
const sumWidth = d3.sum(item, (_ref3) => {
|
|
3067
3067
|
let {
|
|
3068
3068
|
width
|
|
3069
3069
|
} = _ref3;
|
|
@@ -3161,7 +3161,7 @@ const bubbleChartClassNames = {
|
|
|
3161
3161
|
const SvgWrapper$5 = /*#__PURE__*/styled__default(Wrapper)(_templateObject$e || (_templateObject$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n .", ",\n .", ",\n .", " {\n shape-rendering: crispEdges;\n }\n\n .", ",\n .", " {\n stroke: rgba(149, 149, 149, 0.24);\n }\n\n .", " {\n font-size: 10px;\n }\n"])), bubbleChartClassNames.bubbleChartYAxis, bubbleChartClassNames.bubbleChartXAxis, bubbleChartClassNames.bubbleChartGridGlobal, bubbleChartClassNames.bubbleChartGridLineX, bubbleChartClassNames.bubbleChartGridLineY, bubbleChartClassNames.bubbleChartYScaleLabel);
|
|
3162
3162
|
const TooltipStyles$2 = /*#__PURE__*/styled.createGlobalStyle(_templateObject2$7 || (_templateObject2$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n .", " {\n position: absolute;\n transition: opacity 150ms cubic-bezier(0.2, 1, 0.6, 1);\n pointer-events: none;\n z-index: 1;\n }\n"])), bubbleChartClassNames.bubbleChartTooltipContainer);
|
|
3163
3163
|
|
|
3164
|
-
const drawGrid$2 = _ref => {
|
|
3164
|
+
const drawGrid$2 = (_ref) => {
|
|
3165
3165
|
let {
|
|
3166
3166
|
svg,
|
|
3167
3167
|
yScale,
|
|
@@ -3187,7 +3187,7 @@ const drawGrid$2 = _ref => {
|
|
|
3187
3187
|
var _templateObject$f;
|
|
3188
3188
|
const Tooltip$1 = /*#__PURE__*/styled__default.div(_templateObject$f || (_templateObject$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 0;\n height: 0;\n display: flex;\n align-items: flex-end;\n justify-content: center;\n font-size: 12px;\n white-space: nowrap;\n"])));
|
|
3189
3189
|
|
|
3190
|
-
const drawTooltip$3 = _ref => {
|
|
3190
|
+
const drawTooltip$3 = (_ref) => {
|
|
3191
3191
|
let {
|
|
3192
3192
|
bubbles,
|
|
3193
3193
|
tooltipRoot,
|
|
@@ -3273,25 +3273,25 @@ const draw$5 = (node, props) => {
|
|
|
3273
3273
|
const width = props.width || nodeWidth;
|
|
3274
3274
|
const height = props.height || 0;
|
|
3275
3275
|
const yTicksCountDefault = 6;
|
|
3276
|
-
const minY = typeof minYValue === 'number' ? minYValue : d3.min(data, _ref => {
|
|
3276
|
+
const minY = typeof minYValue === 'number' ? minYValue : d3.min(data, (_ref) => {
|
|
3277
3277
|
let {
|
|
3278
3278
|
yValue
|
|
3279
3279
|
} = _ref;
|
|
3280
3280
|
return yValue;
|
|
3281
3281
|
});
|
|
3282
|
-
const maxY = typeof maxYValue === 'number' ? maxYValue : d3.max(data, _ref2 => {
|
|
3282
|
+
const maxY = typeof maxYValue === 'number' ? maxYValue : d3.max(data, (_ref2) => {
|
|
3283
3283
|
let {
|
|
3284
3284
|
yValue
|
|
3285
3285
|
} = _ref2;
|
|
3286
3286
|
return yValue;
|
|
3287
3287
|
});
|
|
3288
3288
|
const svg = appendSvg(node, width, height || 0);
|
|
3289
|
-
const sizeScale = d3.scaleLinear().domain([d3.min(data, _ref3 => {
|
|
3289
|
+
const sizeScale = d3.scaleLinear().domain([d3.min(data, (_ref3) => {
|
|
3290
3290
|
let {
|
|
3291
3291
|
sizeValue
|
|
3292
3292
|
} = _ref3;
|
|
3293
3293
|
return sizeValue;
|
|
3294
|
-
}), d3.max(data, _ref4 => {
|
|
3294
|
+
}), d3.max(data, (_ref4) => {
|
|
3295
3295
|
let {
|
|
3296
3296
|
sizeValue
|
|
3297
3297
|
} = _ref4;
|
|
@@ -3324,12 +3324,12 @@ const draw$5 = (node, props) => {
|
|
|
3324
3324
|
width: yAxisWidth
|
|
3325
3325
|
} = computeDimensions(yAxis);
|
|
3326
3326
|
const range = [marginLeft + yAxisWidth + (yAxisPadding || 0) + yScaleLabelHeight, width - marginRight];
|
|
3327
|
-
const xScale = d3.scaleLinear().domain([d3.min(data, _ref5 => {
|
|
3327
|
+
const xScale = d3.scaleLinear().domain([d3.min(data, (_ref5) => {
|
|
3328
3328
|
let {
|
|
3329
3329
|
xValue
|
|
3330
3330
|
} = _ref5;
|
|
3331
3331
|
return xValue;
|
|
3332
|
-
}), d3.max(data, _ref6 => {
|
|
3332
|
+
}), d3.max(data, (_ref6) => {
|
|
3333
3333
|
let {
|
|
3334
3334
|
xValue
|
|
3335
3335
|
} = _ref6;
|
|
@@ -3356,32 +3356,32 @@ const draw$5 = (node, props) => {
|
|
|
3356
3356
|
drawGridX
|
|
3357
3357
|
});
|
|
3358
3358
|
xAxis.attr('transform', "translate(0, " + (yScale(yTicks[0]) + (xAxisPadding || 0)) + ")");
|
|
3359
|
-
const bubbles = svg.append('g').selectAll('dot').data(data).enter().append('circle').attr('class', bubbleChartClassNames.bubbleChartCircle).attr('cx', _ref7 => {
|
|
3359
|
+
const bubbles = svg.append('g').selectAll('dot').data(data).enter().append('circle').attr('class', bubbleChartClassNames.bubbleChartCircle).attr('cx', (_ref7) => {
|
|
3360
3360
|
let {
|
|
3361
3361
|
xValue
|
|
3362
3362
|
} = _ref7;
|
|
3363
3363
|
return xScale(xValue);
|
|
3364
|
-
}).attr('cy', _ref8 => {
|
|
3364
|
+
}).attr('cy', (_ref8) => {
|
|
3365
3365
|
let {
|
|
3366
3366
|
yValue
|
|
3367
3367
|
} = _ref8;
|
|
3368
3368
|
return yScale(yValue);
|
|
3369
|
-
}).attr('r', _ref9 => {
|
|
3369
|
+
}).attr('r', (_ref9) => {
|
|
3370
3370
|
let {
|
|
3371
3371
|
sizeValue
|
|
3372
3372
|
} = _ref9;
|
|
3373
3373
|
return sizeScale(sizeValue) / 2;
|
|
3374
|
-
}).attr('fill', _ref10 => {
|
|
3374
|
+
}).attr('fill', (_ref10) => {
|
|
3375
3375
|
let {
|
|
3376
3376
|
color
|
|
3377
3377
|
} = _ref10;
|
|
3378
3378
|
return color || 'rgba(0, 176, 113, 0.6)';
|
|
3379
|
-
}).attr('stroke', _ref11 => {
|
|
3379
|
+
}).attr('stroke', (_ref11) => {
|
|
3380
3380
|
let {
|
|
3381
3381
|
stroke
|
|
3382
3382
|
} = _ref11;
|
|
3383
3383
|
return stroke || 'transparent';
|
|
3384
|
-
}).attr('style', _ref12 => {
|
|
3384
|
+
}).attr('style', (_ref12) => {
|
|
3385
3385
|
let {
|
|
3386
3386
|
style
|
|
3387
3387
|
} = _ref12;
|