@fluentui/react-charting 5.24.32 → 5.24.34
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/CHANGELOG.json +66 -1
- package/CHANGELOG.md +22 -2
- package/dist/react-charting.js +1 -1
- package/dist/react-charting.min.js +1 -1
- package/lib/components/ChartTable/ChartTable.base.js +12 -6
- package/lib/components/ChartTable/ChartTable.base.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +94 -16
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/LineChart/LineChart.base.js +40 -23
- package/lib/components/LineChart/LineChart.base.js.map +1 -1
- package/lib-amd/components/ChartTable/ChartTable.base.js +12 -7
- package/lib-amd/components/ChartTable/ChartTable.base.js.map +1 -1
- package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js +94 -16
- package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-amd/components/LineChart/LineChart.base.js +40 -23
- package/lib-amd/components/LineChart/LineChart.base.js.map +1 -1
- package/lib-commonjs/components/ChartTable/ChartTable.base.js +12 -6
- package/lib-commonjs/components/ChartTable/ChartTable.base.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +94 -16
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/LineChart/LineChart.base.js +40 -23
- package/lib-commonjs/components/LineChart/LineChart.base.js.map +1 -1
- package/package.json +2 -5
- package/project.json +2 -1
|
@@ -762,7 +762,7 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
762
762
|
// eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
763
763
|
LineChartBase.prototype._createLines = function (xElement, containerHeight) {
|
|
764
764
|
var _this_1 = this;
|
|
765
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26;
|
|
765
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27;
|
|
766
766
|
// eslint-disable-next-line @typescript-eslint/no-deprecated
|
|
767
767
|
var lines = [];
|
|
768
768
|
if (this.state.isSelectedLegend) {
|
|
@@ -806,12 +806,12 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
806
806
|
})
|
|
807
807
|
: 0;
|
|
808
808
|
if (this_1._points[i].data.length === 1) {
|
|
809
|
-
var
|
|
809
|
+
var _28 = this_1._points[i].data[0], x1_1 = _28.x, y1 = _28.y, xAxisCalloutData_1 = _28.xAxisCalloutData, xAxisCalloutAccessibilityData_1 = _28.xAxisCalloutAccessibilityData;
|
|
810
810
|
var xPoint = this_1._xAxisScale(x1_1);
|
|
811
811
|
var yPoint = yScale(y1);
|
|
812
812
|
if ((0, index_3.isPlottable)(xPoint, yPoint)) {
|
|
813
813
|
var circleId_1 = "".concat(this_1._circleId, "_").concat(i);
|
|
814
|
-
var
|
|
814
|
+
var isLegendSelected_1 = this_1._legendHighlighted(legendVal) || this_1._noLegendHighlighted() || this_1.state.isSelectedLegend;
|
|
815
815
|
var currentMarkerSize = this_1._points[i].data[0].markerSize;
|
|
816
816
|
var supportsTextMode = (_b = (_a = this_1._points[i].lineOptions) === null || _a === void 0 ? void 0 : _a.mode) === null || _b === void 0 ? void 0 : _b.includes('text');
|
|
817
817
|
var text = this_1._points[i].data[0].text;
|
|
@@ -820,14 +820,14 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
820
820
|
? (currentMarkerSize * extraMaxPixels) / maxMarkerSize
|
|
821
821
|
: activePoint === circleId_1
|
|
822
822
|
? 5.5
|
|
823
|
-
: 3.5, cx: xPoint, cy: yPoint, fill: activePoint === circleId_1 ? theme.semanticColors.bodyBackground : lineColor, opacity:
|
|
823
|
+
: 3.5, cx: xPoint, cy: yPoint, fill: activePoint === circleId_1 ? theme.semanticColors.bodyBackground : lineColor, opacity: isLegendSelected_1 ? 1 : 0.1, onMouseOver: this_1._handleHover.bind(this_1, x1_1, y1, verticaLineHeight, xAxisCalloutData_1, circleId_1, xAxisCalloutAccessibilityData_1, yScale, legendVal, lineColor), onMouseMove: this_1._handleHover.bind(this_1, x1_1, y1, verticaLineHeight, xAxisCalloutData_1, circleId_1, xAxisCalloutAccessibilityData_1, yScale, legendVal, lineColor), onMouseOut: this_1._handleMouseOut, strokeWidth: activePoint === circleId_1 ? DEFAULT_LINE_STROKE_SIZE : 0, stroke: activePoint === circleId_1 ? lineColor : '', role: "img", "aria-label": this_1._getAriaLabel(i, 0), "data-is-focusable": isLegendSelected_1, ref: function (e) {
|
|
824
824
|
_this_1._refCallback(e, circleId_1);
|
|
825
825
|
}, onFocus: function () {
|
|
826
826
|
return _this_1._handleFocus(circleId_1, x1_1, xAxisCalloutData_1, circleId_1, xAxisCalloutAccessibilityData_1);
|
|
827
827
|
}, onBlur: this_1._handleMouseOut }, this_1._getClickHandler(this_1._points[i].data[0].onDataPointClick))),
|
|
828
828
|
!this_1._isScatterPolar && supportsTextMode && text && (React.createElement("text", { key: "".concat(circleId_1, "-label"), x: xPoint, y: yPoint +
|
|
829
829
|
Math.max(currentMarkerSize ? (currentMarkerSize * extraMaxPixels) / maxMarkerSize : 3.5, 4) +
|
|
830
|
-
12, className: classNames.markerLabel, opacity:
|
|
830
|
+
12, className: classNames.markerLabel, opacity: isLegendSelected_1 ? 1 : 0.1 }, text))));
|
|
831
831
|
}
|
|
832
832
|
}
|
|
833
833
|
var gapIndex = 0;
|
|
@@ -845,7 +845,7 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
845
845
|
var lineId = "".concat(this_1._lineId, "_").concat(i);
|
|
846
846
|
var borderId = "".concat(this_1._borderId, "_").concat(i);
|
|
847
847
|
var strokeWidth = ((_f = this_1._points[i].lineOptions) === null || _f === void 0 ? void 0 : _f.strokeWidth) || this_1.props.strokeWidth || DEFAULT_LINE_STROKE_SIZE;
|
|
848
|
-
var
|
|
848
|
+
var isLegendSelected_2 = this_1._legendHighlighted(legendVal) || this_1._noLegendHighlighted() || this_1.state.isSelectedLegend;
|
|
849
849
|
var lineData = [];
|
|
850
850
|
for (var k = 0; k < this_1._points[i].data.length; k++) {
|
|
851
851
|
lineData.push([
|
|
@@ -858,7 +858,7 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
858
858
|
// Check if lines should be drawn based on mode
|
|
859
859
|
var lineMode = (_g = this_1._points[i].lineOptions) === null || _g === void 0 ? void 0 : _g.mode;
|
|
860
860
|
var shouldDrawLines = lineMode !== 'markers';
|
|
861
|
-
if (shouldDrawLines &&
|
|
861
|
+
if (shouldDrawLines && isLegendSelected_2) {
|
|
862
862
|
var lineBorderWidth = ((_h = this_1._points[i].lineOptions) === null || _h === void 0 ? void 0 : _h.lineBorderWidth)
|
|
863
863
|
? Number.parseFloat(this_1._points[i].lineOptions.lineBorderWidth.toString())
|
|
864
864
|
: 0;
|
|
@@ -877,7 +877,7 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
877
877
|
var showMarkers = (lineMode === null || lineMode === void 0 ? void 0 : lineMode.includes('markers')) || !lineMode; // Show markers by default if no mode specified
|
|
878
878
|
if (showMarkers) {
|
|
879
879
|
for (var k = 0; k < this_1._points[i].data.length; k++) {
|
|
880
|
-
var
|
|
880
|
+
var _29 = this_1._points[i].data[k], x = _29.x, y = _29.y;
|
|
881
881
|
var xPoint = this_1._xAxisScale(x instanceof Date ? x.getTime() : x);
|
|
882
882
|
var yPoint = yScale(y);
|
|
883
883
|
if ((0, index_3.isPlottable)(xPoint, yPoint)) {
|
|
@@ -889,7 +889,7 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
889
889
|
? 5.5
|
|
890
890
|
: 3.5, cx: xPoint, cy: yPoint, fill: activePoint === this_1._circleId
|
|
891
891
|
? theme.semanticColors.bodyBackground
|
|
892
|
-
: perPointColor || ((_u = this_1._points[i]) === null || _u === void 0 ? void 0 : _u.color) || lineColor, stroke: perPointColor || lineColor, strokeWidth: 1, opacity:
|
|
892
|
+
: perPointColor || ((_u = this_1._points[i]) === null || _u === void 0 ? void 0 : _u.color) || lineColor, stroke: perPointColor || lineColor, strokeWidth: 1, opacity: isLegendSelected_2 ? 1 : 0.1, onMouseMove: this_1._onMouseOverLargeDataset.bind(this_1, i, verticaLineHeight, yScale), onMouseOver: this_1._onMouseOverLargeDataset.bind(this_1, i, verticaLineHeight, yScale), onMouseOut: this_1._handleMouseOut }));
|
|
893
893
|
}
|
|
894
894
|
}
|
|
895
895
|
}
|
|
@@ -902,14 +902,14 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
902
902
|
var lineId = "".concat(this_1._lineId, "_").concat(i, "_").concat(j);
|
|
903
903
|
var borderId = "".concat(this_1._borderId, "_").concat(i, "_").concat(j);
|
|
904
904
|
var circleId = "".concat(this_1._circleId, "_").concat(i, "_").concat(j);
|
|
905
|
-
var
|
|
906
|
-
var
|
|
905
|
+
var _30 = this_1._points[i].data[j - 1], x1 = _30.x, y1 = _30.y, xAxisCalloutData = _30.xAxisCalloutData, xAxisCalloutAccessibilityData = _30.xAxisCalloutAccessibilityData;
|
|
906
|
+
var _31 = this_1._points[i].data[j], x2 = _31.x, y2 = _31.y;
|
|
907
907
|
var xPoint1 = this_1._xAxisScale(x1);
|
|
908
908
|
var yPoint1 = yScale(y1);
|
|
909
909
|
var xPoint2 = this_1._xAxisScale(x2);
|
|
910
910
|
var yPoint2 = yScale(y2);
|
|
911
911
|
var strokeWidth = ((_v = this_1._points[i].lineOptions) === null || _v === void 0 ? void 0 : _v.strokeWidth) || this_1.props.strokeWidth || DEFAULT_LINE_STROKE_SIZE;
|
|
912
|
-
var
|
|
912
|
+
var isLegendSelected_3 = this_1._legendHighlighted(legendVal) || this_1._noLegendHighlighted() || this_1.state.isSelectedLegend;
|
|
913
913
|
var currentPointHidden = this_1._points[i].hideNonActiveDots && activePoint !== circleId;
|
|
914
914
|
var supportsTextMode = (_x = (_w = this_1._points[i].lineOptions) === null || _w === void 0 ? void 0 : _w.mode) === null || _x === void 0 ? void 0 : _x.includes('text');
|
|
915
915
|
var text = this_1._points[i].data[j - 1].text;
|
|
@@ -917,21 +917,21 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
917
917
|
if ((0, index_3.isPlottable)(xPoint1, yPoint1)) {
|
|
918
918
|
var path = this_1._getPath(xPoint1, yPoint1, circleId, j, false, this_1._points[i].index);
|
|
919
919
|
pointsForLine.push(((_z = (_y = this_1._points[i].lineOptions) === null || _y === void 0 ? void 0 : _y.mode) === null || _z === void 0 ? void 0 : _z.includes('markers')) || supportsTextMode ? (React.createElement(React.Fragment, null,
|
|
920
|
-
React.createElement("circle", tslib_1.__assign({ id: circleId, key: circleId, r: currentMarkerSize ? (currentMarkerSize * extraMaxPixels) / maxMarkerSize : 4, cx: xPoint1, cy: yPoint1, "data-is-focusable":
|
|
920
|
+
React.createElement("circle", tslib_1.__assign({ id: circleId, key: circleId, r: currentMarkerSize ? (currentMarkerSize * extraMaxPixels) / maxMarkerSize : 4, cx: xPoint1, cy: yPoint1, "data-is-focusable": isLegendSelected_3, onMouseOver: this_1._handleHover.bind(this_1, x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, yScale, legendVal, lineColor), onMouseMove: this_1._handleHover.bind(this_1, x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, yScale, legendVal, lineColor), onMouseOut: this_1._handleMouseOut, onFocus: function () {
|
|
921
921
|
return _this_1._handleFocus(lineId, x1, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData);
|
|
922
|
-
}, onBlur: this_1._handleMouseOut }, this_1._getClickHandler(this_1._points[i].data[j - 1].onDataPointClick), { opacity:
|
|
922
|
+
}, onBlur: this_1._handleMouseOut }, this_1._getClickHandler(this_1._points[i].data[j - 1].onDataPointClick), { opacity: isLegendSelected_3 && !currentPointHidden ? 1 : 0.01, fill: ((_0 = this_1._points[i].data[j - 1]) === null || _0 === void 0 ? void 0 : _0.markerColor) || this_1._getPointFill(lineColor, circleId, j, false), stroke: ((_1 = this_1._points[i].data[j - 1]) === null || _1 === void 0 ? void 0 : _1.markerColor) || lineColor, strokeWidth: strokeWidth, role: "img", "aria-label": (_2 = this_1._points[i].data[j - 1].text) !== null && _2 !== void 0 ? _2 : this_1._getAriaLabel(i, j - 1) })),
|
|
923
923
|
!this_1._isScatterPolar && supportsTextMode && text && (React.createElement("text", { key: "".concat(circleId, "-label"), x: xPoint1, y: yPoint1 +
|
|
924
924
|
Math.max(currentMarkerSize ? (currentMarkerSize * extraMaxPixels) / maxMarkerSize : 4, 4) +
|
|
925
|
-
12, className: classNames.markerLabel, opacity:
|
|
925
|
+
12, className: classNames.markerLabel, opacity: isLegendSelected_3 && !currentPointHidden ? 1 : 0.01 }, text)))) : (React.createElement("path", tslib_1.__assign({ id: circleId, key: circleId, d: path, "data-is-focusable": isLegendSelected_3, onMouseOver: this_1._handleHover.bind(this_1, x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, yScale, legendVal, lineColor), onMouseMove: this_1._handleHover.bind(this_1, x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, yScale, legendVal, lineColor), onMouseOut: this_1._handleMouseOut, onFocus: function () {
|
|
926
926
|
return _this_1._handleFocus(lineId, x1, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData);
|
|
927
|
-
}, onBlur: this_1._handleMouseOut }, this_1._getClickHandler(this_1._points[i].data[j - 1].onDataPointClick), { opacity:
|
|
927
|
+
}, onBlur: this_1._handleMouseOut }, this_1._getClickHandler(this_1._points[i].data[j - 1].onDataPointClick), { opacity: isLegendSelected_3 && !currentPointHidden ? 1 : 0.01, fill: ((_3 = this_1._points[i].data[j - 1]) === null || _3 === void 0 ? void 0 : _3.markerColor) || this_1._getPointFill(lineColor, circleId, j, false), stroke: ((_4 = this_1._points[i].data[j - 1]) === null || _4 === void 0 ? void 0 : _4.markerColor) || lineColor, strokeWidth: strokeWidth, role: "img", "aria-label": this_1._getAriaLabel(i, j - 1) }))));
|
|
928
928
|
}
|
|
929
929
|
if (j + 1 === this_1._points[i].data.length) {
|
|
930
930
|
// If this is last point of the line segment.
|
|
931
931
|
var lastCircleId_1 = "".concat(circleId).concat(j, "L");
|
|
932
932
|
var hiddenHoverCircleId = "".concat(circleId).concat(j, "D");
|
|
933
933
|
var lastPointHidden = this_1._points[i].hideNonActiveDots && activePoint !== lastCircleId_1;
|
|
934
|
-
var
|
|
934
|
+
var _32 = this_1._points[i].data[j], lastCirlceXCallout_1 = _32.xAxisCalloutData, lastCirlceXCalloutAccessibilityData_1 = _32.xAxisCalloutAccessibilityData;
|
|
935
935
|
currentMarkerSize = this_1._points[i].data[j].markerSize;
|
|
936
936
|
var lastSupportsTextMode = (_6 = (_5 = this_1._points[i].lineOptions) === null || _5 === void 0 ? void 0 : _5.mode) === null || _6 === void 0 ? void 0 : _6.includes('text');
|
|
937
937
|
var lastText = this_1._points[i].data[j].text;
|
|
@@ -939,21 +939,21 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
939
939
|
var path = this_1._getPath(xPoint2, yPoint2, lastCircleId_1, j, true, this_1._points[i].index);
|
|
940
940
|
pointsForLine.push(React.createElement(React.Fragment, { key: "".concat(lastCircleId_1, "_container") },
|
|
941
941
|
((_8 = (_7 = this_1._points[i].lineOptions) === null || _7 === void 0 ? void 0 : _7.mode) === null || _8 === void 0 ? void 0 : _8.includes('markers')) || lastSupportsTextMode ? (React.createElement(React.Fragment, null,
|
|
942
|
-
React.createElement("circle", tslib_1.__assign({ id: lastCircleId_1, key: lastCircleId_1, r: currentMarkerSize ? (currentMarkerSize * extraMaxPixels) / maxMarkerSize : 4, cx: xPoint2, cy: yPoint2, "data-is-focusable":
|
|
942
|
+
React.createElement("circle", tslib_1.__assign({ id: lastCircleId_1, key: lastCircleId_1, r: currentMarkerSize ? (currentMarkerSize * extraMaxPixels) / maxMarkerSize : 4, cx: xPoint2, cy: yPoint2, "data-is-focusable": isLegendSelected_3, onMouseOver: this_1._handleHover.bind(this_1, x2, y2, verticaLineHeight, lastCirlceXCallout_1, lastCircleId_1, lastCirlceXCalloutAccessibilityData_1, yScale, legendVal, lineColor), onMouseMove: this_1._handleHover.bind(this_1, x2, y2, verticaLineHeight, lastCirlceXCallout_1, lastCircleId_1, lastCirlceXCalloutAccessibilityData_1, yScale, legendVal, lineColor), onMouseOut: this_1._handleMouseOut, onFocus: function () {
|
|
943
943
|
return _this_1._handleFocus(lineId, x2, lastCirlceXCallout_1, lastCircleId_1, lastCirlceXCalloutAccessibilityData_1);
|
|
944
|
-
}, onBlur: this_1._handleMouseOut }, this_1._getClickHandler(this_1._points[i].data[j].onDataPointClick), { opacity:
|
|
944
|
+
}, onBlur: this_1._handleMouseOut }, this_1._getClickHandler(this_1._points[i].data[j].onDataPointClick), { opacity: isLegendSelected_3 && !lastPointHidden ? 1 : 0.01, fill: this_1._getPointFill(lineColor, lastCircleId_1, j, true), stroke: lineColor, strokeWidth: strokeWidth, role: "img", "aria-label": (_9 = this_1._points[i].data[j].text) !== null && _9 !== void 0 ? _9 : this_1._getAriaLabel(i, j) })),
|
|
945
945
|
!this_1._isScatterPolar && lastSupportsTextMode && lastText && (React.createElement("text", { key: "".concat(lastCircleId_1, "-label"), x: xPoint2, y: yPoint2 +
|
|
946
946
|
Math.max(currentMarkerSize ? (currentMarkerSize * extraMaxPixels) / maxMarkerSize : 4, 4) +
|
|
947
|
-
12, className: classNames.markerLabel, opacity:
|
|
947
|
+
12, className: classNames.markerLabel, opacity: isLegendSelected_3 && !currentPointHidden ? 1 : 0.01 }, text)))) : (React.createElement("path", tslib_1.__assign({ id: lastCircleId_1, key: lastCircleId_1, d: path, "data-is-focusable": isLegendSelected_3, onMouseOver: this_1._handleHover.bind(this_1, x2, y2, verticaLineHeight, lastCirlceXCallout_1, lastCircleId_1, lastCirlceXCalloutAccessibilityData_1, yScale, legendVal, lineColor), onMouseMove: this_1._handleHover.bind(this_1, x2, y2, verticaLineHeight, lastCirlceXCallout_1, lastCircleId_1, lastCirlceXCalloutAccessibilityData_1, yScale, legendVal, lineColor), onMouseOut: this_1._handleMouseOut, onFocus: function () {
|
|
948
948
|
return _this_1._handleFocus(lineId, x2, lastCirlceXCallout_1, lastCircleId_1, lastCirlceXCalloutAccessibilityData_1);
|
|
949
|
-
}, onBlur: this_1._handleMouseOut }, this_1._getClickHandler(this_1._points[i].data[j].onDataPointClick), { opacity:
|
|
949
|
+
}, onBlur: this_1._handleMouseOut }, this_1._getClickHandler(this_1._points[i].data[j].onDataPointClick), { opacity: isLegendSelected_3 && !lastPointHidden ? 1 : 0.01, fill: ((_10 = this_1._points[i].data[j]) === null || _10 === void 0 ? void 0 : _10.markerColor) || this_1._getPointFill(lineColor, lastCircleId_1, j, true), stroke: ((_11 = this_1._points[i].data[j]) === null || _11 === void 0 ? void 0 : _11.markerColor) || lineColor, strokeWidth: strokeWidth, role: "img", "aria-label": this_1._getAriaLabel(i, j) }))),
|
|
950
950
|
React.createElement("circle", { id: hiddenHoverCircleId, key: hiddenHoverCircleId, r: 8, cx: xPoint2, cy: yPoint2, opacity: 0, width: 0, onMouseOver: this_1._handleHover.bind(this_1, x2, y2, verticaLineHeight, lastCirlceXCallout_1, lastCircleId_1, lastCirlceXCalloutAccessibilityData_1, yScale, legendVal, lineColor), onMouseMove: this_1._handleHover.bind(this_1, x2, y2, verticaLineHeight, lastCirlceXCallout_1, lastCircleId_1, lastCirlceXCalloutAccessibilityData_1, yScale, legendVal, lineColor), onMouseOut: this_1._handleMouseOut, strokeWidth: 0, focusable: false, onBlur: this_1._handleMouseOut })));
|
|
951
951
|
}
|
|
952
952
|
}
|
|
953
953
|
if ((0, index_3.isPlottable)(xPoint1, yPoint1) &&
|
|
954
954
|
(0, index_3.isPlottable)(xPoint2, yPoint2) &&
|
|
955
955
|
(!this_1._hasMarkersMode || ((_13 = (_12 = this_1._points[i].lineOptions) === null || _12 === void 0 ? void 0 : _12.mode) === null || _13 === void 0 ? void 0 : _13.includes('lines')))) {
|
|
956
|
-
if (
|
|
956
|
+
if (isLegendSelected_3) {
|
|
957
957
|
// don't draw line if it is in a gap
|
|
958
958
|
if (!isInGap) {
|
|
959
959
|
var lineBorderWidth = ((_14 = this_1._points[i].lineOptions) === null || _14 === void 0 ? void 0 : _14.lineBorderWidth)
|
|
@@ -978,12 +978,29 @@ define(["require", "exports", "tslib", "react", "d3-selection", "d3-array", "../
|
|
|
978
978
|
_loop_2(j);
|
|
979
979
|
}
|
|
980
980
|
}
|
|
981
|
+
// Add filled area for scatterpolar charts
|
|
982
|
+
var fillMode = (_26 = this_1._points[i].lineOptions) === null || _26 === void 0 ? void 0 : _26.fill;
|
|
983
|
+
var isLegendSelected = this_1._legendHighlighted(legendVal) || this_1._noLegendHighlighted() || this_1.state.isSelectedLegend;
|
|
984
|
+
if (fillMode === 'toself' && this_1._points[i].data.length >= 3 && isLegendSelected && this_1._isScatterPolar) {
|
|
985
|
+
var getScaledXValue_1 = function (dataPoint) {
|
|
986
|
+
return _this_1._xAxisScale(dataPoint.x instanceof Date ? dataPoint.x : dataPoint.x);
|
|
987
|
+
};
|
|
988
|
+
var fillPathGenerator = (0, d3_shape_1.line)()
|
|
989
|
+
.x(function (dataPoint) { return getScaledXValue_1(dataPoint); })
|
|
990
|
+
.y(function (dataPoint) { return yScale(dataPoint.y); })
|
|
991
|
+
.curve((0, index_3.getCurveFactory)(lineCurve))
|
|
992
|
+
.defined(function (dataPoint) { return (0, index_3.isPlottable)(getScaledXValue_1(dataPoint), yScale(dataPoint.y)); });
|
|
993
|
+
var fillPath = fillPathGenerator(this_1._points[i].data);
|
|
994
|
+
if (fillPath) {
|
|
995
|
+
linesForLine.push(React.createElement("path", { key: "scatterpolar_fill_".concat(i), d: "".concat(fillPath, "Z"), fill: lineColor, fillOpacity: 0.5, stroke: lineColor, strokeWidth: 2, strokeOpacity: 0.8, pointerEvents: "none" }));
|
|
996
|
+
}
|
|
997
|
+
}
|
|
981
998
|
if (this_1._isScatterPolar) {
|
|
982
999
|
pointsForLine.push.apply(pointsForLine, (0, scatterpolar_utils_1.renderScatterPolarCategoryLabels)({
|
|
983
1000
|
xAxisScale: this_1._xAxisScale,
|
|
984
1001
|
yAxisScale: yScale,
|
|
985
1002
|
className: classNames.markerLabel || '',
|
|
986
|
-
lineOptions: (
|
|
1003
|
+
lineOptions: (_27 = this_1._points[i]) === null || _27 === void 0 ? void 0 : _27.lineOptions,
|
|
987
1004
|
}));
|
|
988
1005
|
}
|
|
989
1006
|
lines.push(React.createElement("g", { key: "line_".concat(i), role: "region", "aria-label": "".concat(legendVal, ", line ").concat(i + 1, " of ").concat(this_1._points.length, " with ").concat(this_1._points[i].data.length, " data points.") },
|