98 lines
5.1 KiB
JavaScript
98 lines
5.1 KiB
JavaScript
import { createSelector } from 'reselect';
|
|
import { computeArea } from '../../cartesian/Area';
|
|
import { selectAxisWithScale, selectStackGroups, selectTicksOfGraphicalItem, selectUnfilteredCartesianItems } from './axisSelectors';
|
|
import { selectChartLayout } from '../../context/chartLayoutContext';
|
|
import { selectChartDataWithIndexesIfNotInPanoramaPosition3 } from './dataSelectors';
|
|
import { getBandSizeOfAxis, isCategoricalAxis } from '../../util/ChartUtils';
|
|
import { getStackSeriesIdentifier } from '../../util/stacks/getStackSeriesIdentifier';
|
|
import { selectChartBaseValue } from './rootPropsSelectors';
|
|
import { selectXAxisIdFromGraphicalItemId, selectYAxisIdFromGraphicalItemId } from './graphicalItemSelectors';
|
|
var selectXAxisWithScale = (state, graphicalItemId, isPanorama) => selectAxisWithScale(state, 'xAxis', selectXAxisIdFromGraphicalItemId(state, graphicalItemId), isPanorama);
|
|
var selectXAxisTicks = (state, graphicalItemId, isPanorama) => selectTicksOfGraphicalItem(state, 'xAxis', selectXAxisIdFromGraphicalItemId(state, graphicalItemId), isPanorama);
|
|
var selectYAxisWithScale = (state, graphicalItemId, isPanorama) => selectAxisWithScale(state, 'yAxis', selectYAxisIdFromGraphicalItemId(state, graphicalItemId), isPanorama);
|
|
var selectYAxisTicks = (state, graphicalItemId, isPanorama) => selectTicksOfGraphicalItem(state, 'yAxis', selectYAxisIdFromGraphicalItemId(state, graphicalItemId), isPanorama);
|
|
var selectBandSize = createSelector([selectChartLayout, selectXAxisWithScale, selectYAxisWithScale, selectXAxisTicks, selectYAxisTicks], (layout, xAxis, yAxis, xAxisTicks, yAxisTicks) => {
|
|
if (isCategoricalAxis(layout, 'xAxis')) {
|
|
return getBandSizeOfAxis(xAxis, xAxisTicks, false);
|
|
}
|
|
return getBandSizeOfAxis(yAxis, yAxisTicks, false);
|
|
});
|
|
var pickAreaId = (_state, id) => id;
|
|
|
|
/*
|
|
* There is a race condition problem because we read some data from props and some from the state.
|
|
* The state is updated through a dispatch and is one render behind,
|
|
* and so we have this weird one tick render where the displayedData in one selector have the old dataKey
|
|
* but the new dataKey in another selector.
|
|
*
|
|
* A proper fix is to either move everything into the state, or read the dataKey always from props
|
|
* - but this is a smaller change.
|
|
*/
|
|
var selectSynchronisedAreaSettings = createSelector([selectUnfilteredCartesianItems, pickAreaId], (graphicalItems, id) => graphicalItems.filter(item => item.type === 'area').find(item => item.id === id));
|
|
var selectNumericalAxisType = state => {
|
|
var layout = selectChartLayout(state);
|
|
var isXAxisCategorical = isCategoricalAxis(layout, 'xAxis');
|
|
return isXAxisCategorical ? 'yAxis' : 'xAxis';
|
|
};
|
|
var selectNumericalAxisIdFromGraphicalItemId = (state, graphicalItemId) => {
|
|
var axisType = selectNumericalAxisType(state);
|
|
if (axisType === 'yAxis') {
|
|
return selectYAxisIdFromGraphicalItemId(state, graphicalItemId);
|
|
}
|
|
return selectXAxisIdFromGraphicalItemId(state, graphicalItemId);
|
|
};
|
|
var selectNumericalAxisStackGroups = (state, graphicalItemId, isPanorama) => selectStackGroups(state, selectNumericalAxisType(state), selectNumericalAxisIdFromGraphicalItemId(state, graphicalItemId), isPanorama);
|
|
export var selectGraphicalItemStackedData = createSelector([selectSynchronisedAreaSettings, selectNumericalAxisStackGroups], (areaSettings, stackGroups) => {
|
|
var _stackGroups$stackId;
|
|
if (areaSettings == null || stackGroups == null) {
|
|
return undefined;
|
|
}
|
|
var {
|
|
stackId
|
|
} = areaSettings;
|
|
var stackSeriesIdentifier = getStackSeriesIdentifier(areaSettings);
|
|
if (stackId == null || stackSeriesIdentifier == null) {
|
|
return undefined;
|
|
}
|
|
var groups = (_stackGroups$stackId = stackGroups[stackId]) === null || _stackGroups$stackId === void 0 ? void 0 : _stackGroups$stackId.stackedData;
|
|
var found = groups === null || groups === void 0 ? void 0 : groups.find(v => v.key === stackSeriesIdentifier);
|
|
if (found == null) {
|
|
return undefined;
|
|
}
|
|
return found.map(item => [item[0], item[1]]);
|
|
});
|
|
export var selectArea = createSelector([selectChartLayout, selectXAxisWithScale, selectYAxisWithScale, selectXAxisTicks, selectYAxisTicks, selectGraphicalItemStackedData, selectChartDataWithIndexesIfNotInPanoramaPosition3, selectBandSize, selectSynchronisedAreaSettings, selectChartBaseValue], (layout, xAxis, yAxis, xAxisTicks, yAxisTicks, stackedData, _ref, bandSize, areaSettings, chartBaseValue) => {
|
|
var {
|
|
chartData,
|
|
dataStartIndex,
|
|
dataEndIndex
|
|
} = _ref;
|
|
if (areaSettings == null || layout !== 'horizontal' && layout !== 'vertical' || xAxis == null || yAxis == null || xAxisTicks == null || yAxisTicks == null || xAxisTicks.length === 0 || yAxisTicks.length === 0 || bandSize == null) {
|
|
return undefined;
|
|
}
|
|
var {
|
|
data
|
|
} = areaSettings;
|
|
var displayedData;
|
|
if (data && data.length > 0) {
|
|
displayedData = data;
|
|
} else {
|
|
displayedData = chartData === null || chartData === void 0 ? void 0 : chartData.slice(dataStartIndex, dataEndIndex + 1);
|
|
}
|
|
if (displayedData == null) {
|
|
return undefined;
|
|
}
|
|
return computeArea({
|
|
layout,
|
|
xAxis,
|
|
yAxis,
|
|
xAxisTicks,
|
|
yAxisTicks,
|
|
dataStartIndex,
|
|
areaSettings,
|
|
stackedData,
|
|
displayedData,
|
|
chartBaseValue,
|
|
bandSize
|
|
});
|
|
}); |