@neo4j-ndl/react-charts
Version:
React implementation of charts from Neo4j Design System
87 lines • 3.42 kB
JavaScript
/**
*
* Copyright (c) "Neo4j"
* Neo4j Sweden AB [http://neo4j.com]
*
* This file is part of Neo4j.
*
* Neo4j is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import { getInstanceByDom } from 'echarts';
import { useCallback } from 'react';
import { isThresholdLine } from '../utils/threshold';
import { useChartRefsContext } from './use-chart-refs';
export const useLegendVisibility = (selectedSeries) => {
const { chartEchartRef } = useChartRefsContext();
const setOnlyVisible = useCallback((name) => {
if (chartEchartRef.current === null) {
return;
}
const chart = getInstanceByDom(chartEchartRef.current);
chart === null || chart === void 0 ? void 0 : chart.dispatchAction({
name: name,
type: 'legendSelect',
});
const otherNames = Object.keys(selectedSeries).filter((n) => n !== name);
otherNames.forEach((name) => {
if (isThresholdLine(name)) {
return;
}
chart === null || chart === void 0 ? void 0 : chart.dispatchAction({
name: name,
type: 'legendUnSelect',
});
});
}, [chartEchartRef, selectedSeries]);
const setAllVisible = useCallback(() => {
if (chartEchartRef.current === null) {
return;
}
const chart = getInstanceByDom(chartEchartRef.current);
chart === null || chart === void 0 ? void 0 : chart.dispatchAction({
type: 'legendAllSelect',
});
}, [chartEchartRef]);
/**
* Toggle the visibility of a legend series
*
* The toggle logic depends on the current state of the series:
* - If only the legend series that was selected is visible: show all series
* - If all series are visible: hide all except the series that was selected
* - Otherwise: toggle the legend series
*
* The isOnlyVisible and isAllSeriesSelected states can't be calculated in this
* function since different legend types require different logic.
*/
const toggleLegendVisibility = useCallback((name, isAllSeriesSelected, isOnlyVisible) => {
if (chartEchartRef.current === null || name === undefined) {
return;
}
if (isOnlyVisible) {
setAllVisible();
}
else if (isAllSeriesSelected) {
setOnlyVisible(name);
}
else {
const chart = getInstanceByDom(chartEchartRef.current);
chart === null || chart === void 0 ? void 0 : chart.dispatchAction({
name: name,
type: 'legendToggleSelect',
});
}
}, [chartEchartRef, setOnlyVisible, setAllVisible]);
return { toggleLegendVisibility };
};
//# sourceMappingURL=use-legend-visibility.js.map