Add support for replaceMerge option like official Echarts `setOptions`

[NattapongSiri]

See: https://echarts.apache.org/en/api.html#echartsInstance.setOption
There's an option replaceMerge which work in combination with notMerge option.

It seem like the only place to be modified is https://github.com/hustcc/echarts-for-react/blob/master/src/types.ts
because

echarts-for-react/src/core.tsx

Lines 69 to 71 in 0ab3861

	if (!isEqual(pick(this.props, pickKeys), pick(prevProps, pickKeys))) {
	this.updateEChartsOption();
	}

will automatically set this option to underlying Echart instance.

[hustcc]

Are there any bugs with current code?

echarts support 2 way to config notMerge.

[RogerWenXin]

how can I set replaceMerge with react-echarts

[toeyps]

The problem with it is the lack of support for functionality like replaceMerge.
I'm not sure about meaning behind "2 way to config notMerge.
Do you mean that it is currently possible to simulate replaceMerge by using notMerge ?

[omuelle]

will this be fixed anytime soon?

[fedotenko-qs]

This option is really helpful to solve apache/echarts#6202
See: apache/echarts#6202 (comment)

[ayden-canvass]

would love to see this added, it's a huge issue for my project

[lebaudantoine]

Partial echartInstances.setOption method's parameters are supported in react-echart mapping. Refer to the method documentation for more details.

echartInstances.setOption accepts either :
parameters

(option: Object, notMerge?: boolean, lazyUpdate?: boolean)

or

(option: Object, opts?: {
    notMerge?: boolean;
    replaceMerge?: string | string[];
    lazyUpdate?: boolean;
})

As the official documentation explains :

There are two ways to remove components:
Totally removal: use notMerge: true, all of the components will be removed.
Partially removal: use replaceMerge: [...], the specified types of components will be removed if no id matched. This mode is useful to keep the state (e.g., highlight / animation / selected area) of the other components while make removal.

Unfortunately, the react-echart library currently lacks support for the replaceMerge parameter. You can check the component internal logic and component props for further details.

[jakkik]

My current workaround is to call the setOption method of the ECharts instance directly (along with the prop update) with the replaceMerge parameter whenever the options change.

For example:

useEffect(() => {
  const echarts = echartsRef.current.getEchartsInstance();
  echarts.setOption(option, { replaceMerge: ["series"] });
}, [option]);