Apache ECharts types of property 'trigger' are incompatible

Question

In this demo I'm trying to scaffold out some options and this is what I have so far.

  testOptions: EChartsOption = Object.assign(
    {},
    {
      backgroundColor: 'red',
      tooltip: {
        trigger: 'axis',
      },
    }
  );

And this produces the error:

Error in src/echart.component.ts (20:3)
Type '{ backgroundColor: string; tooltip: { trigger: string; }; }' is not assignable to type 'EChartsOption'.
Types of property 'tooltip' are incompatible.
Type '{ trigger: string; }' is not assignable to type 'TooltipOption | TooltipOption[] | undefined'.
Type '{ trigger: string; }' is not assignable to type 'TooltipOption'.
Types of property 'trigger' are incompatible.
Type 'string' is not assignable to type '"axis" | "item" | "none" | undefined'.

And we should be able to assign set trigger to axis according to the documentation, so just trying to figure out whether this is a an error in the EChartOption type?

Answer 1

OK figured it out ... It's because Object.assign is used to create the options instance.

If we just assign the options with an object instance it works fine.

  options: EChartsOption = {
    backgroundColor: 'red',
    tooltip: {
      trigger: 'axis',
    },
  };

Here's a demo.

https://stackblitz.com/edit/stackblitz-starters-prlywu?file=src%2Fechart.component.ts