You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@echarts.apache.org by Ovilia <ov...@gmail.com> on 2021/05/06 07:55:14 UTC

Re: Using Echarts on mobile application - iOS

Hope this helps:
https://github.com/Ovilia/echarts-with-ionics/blob/master/src/pages/home/home.ts

It's an old repo but the basic idea was the same.

Thanks

*Ovilia*


On Tue, May 4, 2021 at 9:14 PM Endrit Gojani <en...@kodelabs.com> wrote:

> I understand all this process, but how to request how to load a chart in
> webview if I configure options for that chart on iOS. I can not understand
> this part. For this I am asking for help, or any specific example in iOS.
>
> Thanks for your help.
>
> On Fri, Apr 30, 2021 at 3:41 PM Ovilia <ov...@gmail.com> wrote:
>
>> There is no extra requirement using Apache ECharts on iOS.
>>
>> I'm using ionic so it's slightly different from flutter but the idea is
>> the same.
>>
>> In HTML:
>> <div #chartContainer class="chart-container"></div>
>>
>>
>> import * as echarts from 'echarts';
>>
>> @ViewChild('chartContainer', {read: ElementRef}) protected _containerEl:
>> ElementRef;
>>
>> ngOnInit() {
>>   // whatever your logic here, you need to make sure el and its width and
>> height should not be undefined
>>   const el = this._containerEl.nativeElement;
>>   this.width = el.clientWidth;
>>   this.height = el.clientHeight;
>>
>>   if (this.chart) {
>>     this.chart.dispose();
>>   }
>>
>>   this.chart = echarts.init(el, null, {
>>     width: this.width,
>>     height: this.height
>>   });
>>
>>   this.chart.setOption(...);
>> }
>>
>>
>>
>> Thanks
>>
>> *Ovilia*
>>
>>
>> On Fri, Apr 30, 2021 at 9:21 PM Endrit Gojani <en...@kodelabs.com>
>> wrote:
>>
>>> Please can you send me any example how to use Echarts on iOS, that you
>>> know works well. Or do you have any documentation how to implement Echarts
>>> on iOS?
>>>
>>> Thank you very much.
>>>
>>> On Fri, Apr 30, 2021, 3:10 PM Ovilia <ov...@gmail.com> wrote:
>>>
>>>> Hi Endrit,
>>>>
>>>> I have used Apache ECharts with ionic (both UIWebView and WKWebView)
>>>> but found no memory problems.
>>>>
>>>> I would suggest you not using flutter_echarts but use ECharts by itself
>>>> so that it can help you debug if it's the problem of ECharts
>>>> or flutter_echarts.
>>>>
>>>> A few tips that may help:
>>>> Call "chart.dispose()" when the page destroys. For example, I'm using
>>>> Angular
>>>> so it looks like:
>>>> ngOnDestroy() {
>>>>   if (this.chart) {
>>>>     this.chart.dispose();
>>>>     this.chart = null;
>>>>   }
>>>> }
>>>> You should do something similar with flutter.
>>>>
>>>> Thanks
>>>>
>>>> *Ovilia*
>>>>
>>>>
>>>> On Fri, Apr 30, 2021 at 6:45 PM Endrit Gojani
>>>> <en...@kodelabs.com.invalid> wrote:
>>>>
>>>>> Hello,
>>>>>
>>>>> I wanted to ask you about an issue I am having of using Echarts on
>>>>> mobile.
>>>>> I am a Flutter developer and I need your help to solve a problem with
>>>>> chart
>>>>> that is occurring. Our app is huge and is used by big companies.
>>>>>
>>>>> Before Echarts, I have used Flutter charts and one month ago I decided
>>>>> to
>>>>> migrate to Echarts with one of the libraries (
>>>>> https://pub.dev/packages/flutter_echarts) that the Flutter community
>>>>> provide to us. But we are having a problem that this library uses
>>>>> Flutter
>>>>> WebView and on iOS devices after loading 2 or more charts, for an
>>>>> unknown
>>>>> reason that we do not know, the cache of the phone memory is fulled and
>>>>> application is crushing. This issue is in the communication between
>>>>> Flutter
>>>>> WebView and iOS and is open for a long time. Now I have decided to make
>>>>> this native.
>>>>>
>>>>>
>>>>>    1. *Can you provide me any example how to use Echarts in iOS to
>>>>> have as
>>>>>    little memory consumption. *
>>>>>    2. *What is the best way to implement it in iOS because in our
>>>>>    application we have a lot of charts.*
>>>>>
>>>>>
>>>>>
>>>>> *Please if you can send me or show me any exact example for Echarts to
>>>>> work
>>>>> properly on iOS.*
>>>>>
>>>>> Thank you. Regards
>>>>>
>>>>> --
>>>>>
>>>>> Endrit Gojani
>>>>>
>>>>> KODE Labs
>>>>>
>>>>> m:  +383 49 811 152
>>>>>
>>>>>  w:  kodelabs.com  e:  endrit@kodelabs.com
>>>>>
>>>>
>
> --
>
> Endrit Gojani
>
> KODE Labs
>
> m:  +383 49 811 152
>
>  w:  kodelabs.com  e:  endrit@kodelabs.com
>
>

Re: Using Echarts on mobile application - iOS

Posted by Endrit Gojani <en...@kodelabs.com.INVALID>.
Thank you so much.

On Thu, May 6, 2021, 9:55 AM Ovilia <ov...@gmail.com> wrote:

> Hope this helps:
>
> https://github.com/Ovilia/echarts-with-ionics/blob/master/src/pages/home/home.ts
>
> It's an old repo but the basic idea was the same.
>
> Thanks
>
> *Ovilia*
>
>
> On Tue, May 4, 2021 at 9:14 PM Endrit Gojani <en...@kodelabs.com> wrote:
>
>> I understand all this process, but how to request how to load a chart in
>> webview if I configure options for that chart on iOS. I can not understand
>> this part. For this I am asking for help, or any specific example in iOS.
>>
>> Thanks for your help.
>>
>> On Fri, Apr 30, 2021 at 3:41 PM Ovilia <ov...@gmail.com> wrote:
>>
>>> There is no extra requirement using Apache ECharts on iOS.
>>>
>>> I'm using ionic so it's slightly different from flutter but the idea is
>>> the same.
>>>
>>> In HTML:
>>> <div #chartContainer class="chart-container"></div>
>>>
>>>
>>> import * as echarts from 'echarts';
>>>
>>> @ViewChild('chartContainer', {read: ElementRef}) protected _containerEl:
>>> ElementRef;
>>>
>>> ngOnInit() {
>>>   // whatever your logic here, you need to make sure el and its width
>>> and height should not be undefined
>>>   const el = this._containerEl.nativeElement;
>>>   this.width = el.clientWidth;
>>>   this.height = el.clientHeight;
>>>
>>>   if (this.chart) {
>>>     this.chart.dispose();
>>>   }
>>>
>>>   this.chart = echarts.init(el, null, {
>>>     width: this.width,
>>>     height: this.height
>>>   });
>>>
>>>   this.chart.setOption(...);
>>> }
>>>
>>>
>>>
>>> Thanks
>>>
>>> *Ovilia*
>>>
>>>
>>> On Fri, Apr 30, 2021 at 9:21 PM Endrit Gojani <en...@kodelabs.com>
>>> wrote:
>>>
>>>> Please can you send me any example how to use Echarts on iOS, that you
>>>> know works well. Or do you have any documentation how to implement Echarts
>>>> on iOS?
>>>>
>>>> Thank you very much.
>>>>
>>>> On Fri, Apr 30, 2021, 3:10 PM Ovilia <ov...@gmail.com> wrote:
>>>>
>>>>> Hi Endrit,
>>>>>
>>>>> I have used Apache ECharts with ionic (both UIWebView and WKWebView)
>>>>> but found no memory problems.
>>>>>
>>>>> I would suggest you not using flutter_echarts but use ECharts by itself
>>>>> so that it can help you debug if it's the problem of ECharts
>>>>> or flutter_echarts.
>>>>>
>>>>> A few tips that may help:
>>>>> Call "chart.dispose()" when the page destroys. For example, I'm using
>>>>> Angular
>>>>> so it looks like:
>>>>> ngOnDestroy() {
>>>>>   if (this.chart) {
>>>>>     this.chart.dispose();
>>>>>     this.chart = null;
>>>>>   }
>>>>> }
>>>>> You should do something similar with flutter.
>>>>>
>>>>> Thanks
>>>>>
>>>>> *Ovilia*
>>>>>
>>>>>
>>>>> On Fri, Apr 30, 2021 at 6:45 PM Endrit Gojani
>>>>> <en...@kodelabs.com.invalid> wrote:
>>>>>
>>>>>> Hello,
>>>>>>
>>>>>> I wanted to ask you about an issue I am having of using Echarts on
>>>>>> mobile.
>>>>>> I am a Flutter developer and I need your help to solve a problem with
>>>>>> chart
>>>>>> that is occurring. Our app is huge and is used by big companies.
>>>>>>
>>>>>> Before Echarts, I have used Flutter charts and one month ago I
>>>>>> decided to
>>>>>> migrate to Echarts with one of the libraries (
>>>>>> https://pub.dev/packages/flutter_echarts) that the Flutter community
>>>>>> provide to us. But we are having a problem that this library uses
>>>>>> Flutter
>>>>>> WebView and on iOS devices after loading 2 or more charts, for an
>>>>>> unknown
>>>>>> reason that we do not know, the cache of the phone memory is fulled
>>>>>> and
>>>>>> application is crushing. This issue is in the communication between
>>>>>> Flutter
>>>>>> WebView and iOS and is open for a long time. Now I have decided to
>>>>>> make
>>>>>> this native.
>>>>>>
>>>>>>
>>>>>>    1. *Can you provide me any example how to use Echarts in iOS to
>>>>>> have as
>>>>>>    little memory consumption. *
>>>>>>    2. *What is the best way to implement it in iOS because in our
>>>>>>    application we have a lot of charts.*
>>>>>>
>>>>>>
>>>>>>
>>>>>> *Please if you can send me or show me any exact example for Echarts
>>>>>> to work
>>>>>> properly on iOS.*
>>>>>>
>>>>>> Thank you. Regards
>>>>>>
>>>>>> --
>>>>>>
>>>>>> Endrit Gojani
>>>>>>
>>>>>> KODE Labs
>>>>>>
>>>>>> m:  +383 49 811 152
>>>>>>
>>>>>>  w:  kodelabs.com  e:  endrit@kodelabs.com
>>>>>>
>>>>>
>>
>> --
>>
>> Endrit Gojani
>>
>> KODE Labs
>>
>> m:  +383 49 811 152
>>
>>  w:  kodelabs.com  e:  endrit@kodelabs.com
>>
>>