@neo4j-ndl/react-charts
Version:
React implementation of charts from Neo4j Design System
91 lines • 3.69 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/>.
*/
Object.defineProperty(exports, "__esModule", { value: true });
exports.useLegendVisibility = void 0;
const echarts_1 = require("echarts");
const react_1 = require("react");
const threshold_1 = require("../utils/threshold");
const use_chart_refs_1 = require("./use-chart-refs");
const useLegendVisibility = (selectedSeries) => {
const { chartEchartRef } = (0, use_chart_refs_1.useChartRefsContext)();
const setOnlyVisible = (0, react_1.useCallback)((name) => {
if (chartEchartRef.current === null) {
return;
}
const chart = (0, echarts_1.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 ((0, threshold_1.isThresholdLine)(name)) {
return;
}
chart === null || chart === void 0 ? void 0 : chart.dispatchAction({
name: name,
type: 'legendUnSelect',
});
});
}, [chartEchartRef, selectedSeries]);
const setAllVisible = (0, react_1.useCallback)(() => {
if (chartEchartRef.current === null) {
return;
}
const chart = (0, echarts_1.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 = (0, react_1.useCallback)((name, isAllSeriesSelected, isOnlyVisible) => {
if (chartEchartRef.current === null || name === undefined) {
return;
}
if (isOnlyVisible) {
setAllVisible();
}
else if (isAllSeriesSelected) {
setOnlyVisible(name);
}
else {
const chart = (0, echarts_1.getInstanceByDom)(chartEchartRef.current);
chart === null || chart === void 0 ? void 0 : chart.dispatchAction({
name: name,
type: 'legendToggleSelect',
});
}
}, [chartEchartRef, setOnlyVisible, setAllVisible]);
return { toggleLegendVisibility };
};
exports.useLegendVisibility = useLegendVisibility;
//# sourceMappingURL=use-legend-visibility.js.map