Skip to content

Commit

Permalink
Enable chart selection based on legends in declarative charts (#33460)
Browse files Browse the repository at this point in the history
  • Loading branch information
Anush2303 authored Dec 14, 2024
1 parent ed3876a commit b5d571f
Show file tree
Hide file tree
Showing 10 changed files with 18 additions and 11 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"type": "patch",
"comment": "Enable chart selection based on legends in declarative charts",
"packageName": "@fluentui/react-charting",
"email": "74965306+Anush2303@users.noreply.github.com",
"dependentChangeType": "patch"
}
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,7 @@ export class AreaChartBase extends React.Component<IAreaChartProps, IAreaChartSt
super(props);
this._createSet = memoizeFunction(this._createDataSet);
this.state = {
selectedLegend: '',
selectedLegend: props.legendProps?.selectedLegend ?? '',
activeLegend: '',
hoverXValue: '',
isCalloutVisible: false,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ export class DonutChartBase extends React.Component<IDonutChartProps, IDonutChar
color: '',
xCalloutValue: '',
yCalloutValue: '',
selectedLegend: '',
selectedLegend: props.legendProps?.selectedLegend ?? '',
focusedArcId: '',
};
this._hoverCallback = this._hoverCallback.bind(this);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -141,7 +141,7 @@ export class GaugeChartBase extends React.Component<IGaugeChartProps, IGaugeChar

this.state = {
hoveredLegend: '',
selectedLegend: '',
selectedLegend: props.legendProps?.selectedLegend ?? '',
focusedElement: '',
calloutTarget: null,
isCalloutVisible: false,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,7 @@ export class GroupedVerticalBarChartBase extends React.Component<
dataForHoverCard: 0,
isCalloutVisible: false,
refSelected: null,
selectedLegend: '',
selectedLegend: props.legendProps?.selectedLegend ?? '',
xCalloutValue: '',
yCalloutValue: '',
YValueHover: [],
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,7 @@ export class HeatMapChartBase extends React.Component<IHeatMapChartProps, IHeatM
): DataSet => this._createNewDataSet(data, xDate, xNum, yDate, yNum),
);
this.state = {
selectedLegend: '',
selectedLegend: props.legendProps?.selectedLegend ?? '',
activeLegend: '',
isCalloutVisible: false,
target: null,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,7 @@ export class HorizontalBarChartWithAxisBase extends React.Component<
isLegendSelected: false,
isLegendHovered: false,
refSelected: null,
selectedLegendTitle: '',
selectedLegendTitle: props.legendProps?.selectedLegend ?? '',
xCalloutValue: '',
yCalloutValue: '',
activeXdataPoint: null,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -186,7 +186,7 @@ export class LineChartBase extends React.Component<ILineChartProps, ILineChartSt
activeLegend: '',
YValueHover: [],
refSelected: '',
selectedLegend: '',
selectedLegend: props.legendProps?.selectedLegend ?? '',
isCalloutVisible: false,
selectedLegendPoints: [],
selectedColorBarLegend: [],
Expand Down Expand Up @@ -1192,7 +1192,7 @@ export class LineChartBase extends React.Component<ILineChartProps, ILineChartSt
() => `translate(${this._xAxisScale(pointToHighlight.x)}, ${this._yAxisScale(pointToHighlight.y)})`,
)
.attr('visibility', 'visibility')
.attr('y2', `${lineHeight - 5 - this._yAxisScale(pointToHighlight.y)}`);
.attr('y2', `${lineHeight - this._yAxisScale(pointToHighlight.y)}`);

this.setState({
nearestCircleToHighlight: pointToHighlight,
Expand Down Expand Up @@ -1278,7 +1278,7 @@ export class LineChartBase extends React.Component<ILineChartProps, ILineChartSt
d3Select(`#${this._verticalLine}`)
.attr('transform', () => `translate(${_this._xAxisScale(x)}, ${_this._yAxisScale(y)})`)
.attr('visibility', 'visibility')
.attr('y2', `${lineHeight - 5 - _this._yAxisScale(y)}`);
.attr('y2', `${lineHeight - _this._yAxisScale(y)}`);
if (this._uniqueCallOutID !== circleId) {
this._uniqueCallOutID = circleId;
this.setState({
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,7 @@ export class VerticalBarChartBase extends React.Component<IVerticalBarChartProps
dataForHoverCard: 0,
isCalloutVisible: false,
refSelected: null,
selectedLegend: '',
selectedLegend: props.legendProps?.selectedLegend ?? '',
activeLegend: '',
xCalloutValue: '',
yCalloutValue: '',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ export class VerticalStackedBarChartBase extends React.Component<
super(props);
this.state = {
isCalloutVisible: false,
selectedLegend: '',
selectedLegend: props.legendProps?.selectedLegend ?? '',
activeLegend: '',
refSelected: null,
dataForHoverCard: 0,
Expand Down

0 comments on commit b5d571f

Please sign in to comment.