Skip to content

Commit

Permalink
Merge 2a735e2 into 520d255
Browse files Browse the repository at this point in the history
  • Loading branch information
zbigg authored Apr 19, 2024
2 parents 520d255 + 2a735e2 commit d7711d8
Show file tree
Hide file tree
Showing 4 changed files with 39 additions and 11 deletions.
6 changes: 5 additions & 1 deletion CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

## Not released

- TimeSeriesWidget: support removing series in mounted widget [#863](https://github.com/CartoDB/carto-react/pull/863)
- TimeSeriesWidget: fix echarts props update, to keep state of control when clicking [#865](https://github.com/CartoDB/carto-react/pull/865)

## 3.0.0

Expand All @@ -12,6 +12,10 @@

## 2.5

### 2.5.3 (2024-04-18)

- TimeSeriesWidget: support removing series in mounted widget [#863](https://github.com/CartoDB/carto-react/pull/863)

### 2.5.2 (2024-04-10)

- configurable timeseries y axis [#861](https://github.com/CartoDB/carto-react/pull/861)
Expand Down
14 changes: 14 additions & 0 deletions packages/react-ui/src/custom-components/echarts-for-react/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,20 @@ export default class ReactEcharts extends _ReactEcharts {
}
}

updateEChartsOption() {
const { option, lazyUpdate, showLoading, loadingOption = null } = this.props;
const echartInstance = this.getEchartsInstance();

echartInstance.setOption(option, { replaceMerge: ['series'], lazyUpdate });

if (showLoading) {
echartInstance.showLoading(loadingOption);
} else {
echartInstance.hideLoading();
}
return echartInstance;
}

offEvents(instance, events) {
if (!events) return;
// loop and off
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -197,6 +197,7 @@ export default function TimeSeriesChart({
: theme.palette.action.disabledBackground;

return {
id: name,
name,
markLine: i === 0 ? markLine : undefined,
markArea: i === 0 ? markArea : undefined,
Expand Down Expand Up @@ -293,7 +294,6 @@ export default function TimeSeriesChart({
return (
<ReactEcharts
option={options}
notMerge
onEvents={onEvents}
onChartReady={onChartReady}
style={{ height }}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,18 +25,26 @@ export default function useTimeSeriesInteractivity({

const updateCursor = useCallback((cursor) => zr?.setCursorStyle(cursor), [zr]);

const firstCategory = data?.[0]?.category;
const seriesFinder = useMemo(() => {
if (firstCategory) {
return { seriesId: firstCategory };
}
return { seriesIndex: 0 };
}, [firstCategory]);

const updateTimelineByCoordinate = useCallback(
(params) => {
if (echartsInstance) {
const [x] = echartsInstance.convertFromPixel({ seriesIndex: 0 }, [
const [x] = echartsInstance.convertFromPixel(seriesFinder, [
params.offsetX,
params.offsetY
]);
const itemIndex = findItemIndexByTime(x, data);
setTimeWindow(itemIndex !== undefined ? [data[itemIndex].name] : []);
}
},
[data, echartsInstance, setTimeWindow]
[data, echartsInstance, setTimeWindow, seriesFinder]
);

// Echarts events
Expand Down Expand Up @@ -87,7 +95,7 @@ export default function useTimeSeriesInteractivity({

// Move markArea
if (timeWindow.length === 2) {
const [x] = echartsInstance.convertFromPixel({ seriesIndex: 0 }, [
const [x] = echartsInstance.convertFromPixel(seriesFinder, [
params.offsetX,
params.offsetY
]);
Expand All @@ -101,7 +109,7 @@ export default function useTimeSeriesInteractivity({

if (echartsInstance) {
setIsMarkAreaSelected(true);
const [x] = echartsInstance.convertFromPixel({ seriesIndex: 0 }, [
const [x] = echartsInstance.convertFromPixel(seriesFinder, [
params.offsetX,
params.offsetY
]);
Expand All @@ -111,7 +119,7 @@ export default function useTimeSeriesInteractivity({
}

return addEventWithCleanUp(zr, 'mousedown', mouseDownEvent);
}, [zr, echartsInstance, timeWindow, updateCursor, filterable]);
}, [zr, echartsInstance, timeWindow, updateCursor, filterable, seriesFinder]);

useEffect(() => {
function mouseMoveEvent(params) {
Expand All @@ -125,7 +133,7 @@ export default function useTimeSeriesInteractivity({
}

if (isMarkAreaSelected && echartsInstance) {
const [x] = echartsInstance.convertFromPixel({ seriesIndex: 0 }, [
const [x] = echartsInstance.convertFromPixel(seriesFinder, [
params.offsetX,
params.offsetY
]);
Expand All @@ -145,7 +153,8 @@ export default function useTimeSeriesInteractivity({
isMarkLineSelected,
setTimeWindow,
updateCursor,
updateTimelineByCoordinate
updateTimelineByCoordinate,
seriesFinder
]);

useEffect(() => {
Expand All @@ -164,7 +173,7 @@ export default function useTimeSeriesInteractivity({
}

if (isMarkAreaMoving && echartsInstance) {
const [x] = echartsInstance.convertFromPixel({ seriesIndex: 0 }, [
const [x] = echartsInstance.convertFromPixel(seriesFinder, [
params.offsetX,
params.offsetY
]);
Expand All @@ -187,7 +196,8 @@ export default function useTimeSeriesInteractivity({
oldMarkAreaPosition,
setTimeWindow,
timeWindow,
updateCursor
updateCursor,
seriesFinder
]);

useEffect(() => {
Expand Down

0 comments on commit d7711d8

Please sign in to comment.