Package not able to handle different format of dataset provided in a line chart

[guri8751]

Describe the bug The line chart is not able to handle a different format of dataset.

Following are two sets of echarts configuration which work as expected when run in echarts code example executor:

demoConfig1 = { tooltip: { trigger: 'axis' }, xAxis: { type: 'category', boundaryGap: false, data: ['Mon', 'Tue', 'Wed'] }, yAxis: { type: 'value' }, series: [ { name: 'Email', type: 'line', stack: 'Total', data: [120, 132, 101] }, { name: 'Union Ads', type: 'line', stack: 'Total', data: [220, 182, 191] } ] };

demoConfig2 = { tooltip: { trigger: 'axis' }, xAxis: { type: 'category', boundaryGap: false }, yAxis: { type: 'value' }, series: [ { name: 'Email', type: 'line', stack: 'Total', }, { name: 'Union Ads', type: 'line', stack: 'Total', } ], "dataset": { "source": [ ["Monday", 120, 220, ], [ "Tuesday", 132, 182, ], [ "Wednesday", 101, 191, ] ], } };

As you can see both the configs are actually the same thing and produce the same chart, the only difference is the format in which the dataset is provided. In demoConfig2, the dataset is provided separately in a "dataset" object. Both the configs (demoConfig1 and demoConfig2) work as expected when run on ehcarts renderer on their website (https://echarts.apache.org/examples/en/editor.html?c=line-stack) meaning both are correct, and the demoConfig1 when passed to the package works well in the app but when demoConfig2 is passed to the package, it doesn't displays the graph data. The code being used to render the graphs in the app is the same as specified in the readme section of the library's github repository.

Output of demoConfig1:

Output of demoConfig2:

We are actually working with a large dataset and it is more feasible for us to work the format as specified in demoConfig2.

Please let me know if this issue is faced by others as well. Thanks!

[zhiqingchen]

The DatasetComponent needs to be used

import {
  DatasetComponent,
} from 'echarts/components';

echarts.use([
  DatasetComponent,
]);

[guri8751]

Importing DatasetComponent as you mentioned worked for me! Now it's displaying the line chart. Thank you :)

[guri8751]

@zhiqingchen Quick question, in the snack link you shared earlier, you are importing "echarts" from the library itself like this: "import { SVGRenderer, SkiaChart, echarts } from '@wuba/react-native-echarts'". And then you used "echarts.use([SVGRenderer]);" to register the renderer. This way is different from the one specified in the documentation and is much neater as we don't have to individually import all the charts and components.

When I tried importing "echarts" from the package, it says that it is undefined. Why is it throwing the exception in my case? Also is there a way to import all the charts and components and use the SVGRenderer without doing it individually? Thanks

[zhiqingchen]

https://wuba.github.io/react-native-echarts/docs/expo-snacks/intro

Doing so will bring in all the echarts components and charts. You can do this, but it is not the recommended usage.