entronad / flutter_echarts Goto Github PK

如何显示加载效果？如

在ListView中放多个图表，有柱形，曲线，或其它类型。
在界面初始化时，只加载了可见区域内的图表，不可见区域的未加载。
等滑动列表时，最初不可见区域内的是一个空白。
如果在图表初始化时迅速上下滑动列表，让不可见区域初始化一次后，图表将可以加载出来

when create gl 3d chart dont work on phone this code but this work on desktop.

var chart = echarts.init(document.getElementById('chart-panel'),'');

chart.on("click", (myScript) => {

alert(myScript);
});

this code add to the first of the code in this page https://echarts.apache.org/examples/en/editor.html?c=simple-surface&gl=1

this code just work on desktop device

Hello,

Flutter 1.7.1

when i test charts features chart stuck or hang and i cannot do anything.

import 'dart:async';
import 'dart:convert';

import 'package:flutter/material.dart';

import 'package:flutter_echarts/flutter_echarts.dart';
import 'package:number_display/number_display.dart';

final display = createDisplay(decimal: 2);

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
@OverRide
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}

class MyHomePage extends StatefulWidget {
MyHomePage({Key key}) : super(key: key);

@OverRide
_MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State {
final GlobalKey _scaffoldKey = new GlobalKey();

List<Map<String, Object>> _data1 = [{ 'name': 'Please wait', 'value': 0 }];

getData1() async {
await Future.delayed(Duration(seconds: 4));

const dataObj = [{
  'name': 'Jan',
  'value': 8726.2453,
}, {
  'name': 'Feb',
  'value': 2445.2453,
}, {
  'name': 'Mar',
  'value': 6636.2400,
}, {
  'name': 'Apr',
  'value': 4774.2453,
}, {
  'name': 'May',
  'value': 1066.2453,
}, {
  'name': 'Jun',
  'value': 4576.9932,
}, {
  'name': 'Jul',
  'value': 8926.9823,
}];

this.setState(() { this._data1 = dataObj;});

}

@OverRide
void initState() {
super.initState();

this.getData1();

}

@OverRide
Widget build(BuildContext context) {
return Scaffold(
key: _scaffoldKey,
appBar: AppBar(
title: Text('Echarts Demon'),
),
backgroundColor: Colors.white,
body: Center(
child: Column(
children: [

        Container(
          child: Echarts(
            option: '''
              {
                dataset: {
                  dimensions: ['name', 'value'],
                  source: ${jsonEncode(_data1)},
                },
                tooltip: {
  trigger: 'axis',
   
},
      
              dataZoom: [{
  type: 'inside',
  start: 0,
  end: 10
}, {
  start: 0,
  end: 100,
  handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
  handleSize: '100%',
  handleStyle: {
      color: '#fff',
      shadowBlur: 3,
      shadowColor: 'rgba(0, 0, 0, 0.6)',
      shadowOffsetX: 2,
      shadowOffsetY: 2
  }
}],
                color: ['#3398DB'],
                legend: {
                  data: ['直接访问', '背景'],
                  show: true,
                },
                grid: {
                  left: '0%',
                  right: '0%',
                  bottom: '5%',
                  top: '7%',
                  height: '85%',
                  containLabel: true,
                  z: 22,
                },
                xAxis: [{
                  type: 'category',
                  gridIndex: 0,
                  axisTick: {
                    show: true,
                  },
                  axisLine: {
                    lineStyle: {
                      color: '#000',
                    },
                  },
                  axisLabel: {
                    show: true,
                    color: 'rgb(170,170,170)',
                    formatter: function xFormatter(value, index) {
                      if (index === 6) {
                        return `\${value}\\n*`;
                      }
                      return value;
                    },
                  },
                }],
                yAxis: {
                  type: 'value',
                  gridIndex: 0,
                  splitLine: {
                    show: false,
                  },
                  axisTick: {
                      show: false,
                  },
                  axisLine: {
                    lineStyle: {
                      color: '#0c3b71',
                    },
                  },
                  axisLabel: {
                    color: 'rgb(170,170,170)',
                  },
                  splitNumber: 12,
                  splitArea: {
                    show: true,
                    areaStyle: {
                      color: ['rgba(250,250,250,0.0)', 'rgba(250,250,250,0.05)'],
                    },
                  },
                },
                series: [{
                  name: '合格率',
                  type: 'line',
                  barWidth: '50%',
                  xAxisIndex: 0,
                  yAxisIndex: 0,
                  itemStyle: {
                    normal: {
                      barBorderRadius: 5,
                      color: {
                        type: 'linear',
                        x: 0,
                        y: 0,
                        x2: 0,
                        y2: 1,
                        colorStops: [
                          {
                            offset: 0, color: '#00feff',
                          },
                          {
                            offset: 1, color: '#027eff',
                          },
                          {
                            offset: 1, color: '#0286ff',
                          },
                        ],
                      },
                    },
                  },
                  zlevel: 11,
                }],
              }
            ''',
            extraScript: '''
              chart.on('click', (params) => {
                if(params.componentType === 'series') {
                  Messager.postMessage(JSON.stringify({
                    type: 'select',
                    payload: params.dataIndex,
                  }));
                }
              });
            ''',
            onMessage: (String message) {
              Map<String, Object> messageAction = jsonDecode(message);
              print(messageAction);
              if (messageAction['type'] == 'select') {
                final item = _data1[messageAction['payload']];
                _scaffoldKey.currentState.showSnackBar(
                  SnackBar(
                    content: Text(item['name'].toString() + ': ' + display(item['value'])),
                    duration: Duration(seconds: 2),
                  ));
              }
            },
          ),
          width: 500,
          height: 500,
        ),
       
      
       
       
      ],
    ),
  ),
);

}
}

I am trying to show population for all countries by states using topojson file in my flutter app.
similar to https://echarts.apache.org/examples/en/editor.html?c=map-usa

geojson files are working but are very large compare and topojson files doesn't is there a way to use topojson file in echarts

if not I am not finding geojson file with smaller size for all countries can you please provide any source where I can find it geojson files of all countries with states.

as the example you have used
the usa geojson filesize it small compare to what I am finding on internet.
http://echarts.apache.org/examples/data/asset/geo/USA.json

I'm a dart/flutter begginer so I just may be missing something. Appreciate any feedback. In the android emulator (pixel 2, api 29) I just see a white, blank square (no bars). Below is as little code as I can provide. The current version I have is
pubspec.yaml:

version: 1.0.0+1

environment:
  sdk: ">=2.7.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter
  flutter_echarts: ^1.3.1

main.dart:

import 'package:flutter/material.dart';
import 'package:flutter_echarts/flutter_echarts.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: "My Charts",
        home: Scaffold(
            appBar: AppBar(
              title: Text("Charting App"),
              backgroundColor: Colors.deepPurple,
            ),
            body: Builder(
                builder: (context) => SingleChildScrollView(
                    child: Padding(
                        padding: EdgeInsets.all(20),
                        child: Center(
                            child: Column(children: [
                          Padding(
                            padding: EdgeInsets.all(10),
                            child: Text(
                              'Hello Chart App',
                              style: TextStyle(
                                  fontSize: 26,
                                  fontWeight: FontWeight.bold,
                                  color: Colors.blue[800]),
                            ),
                          ),
                          Padding(
                            padding: EdgeInsets.all(15),
                            child: Text(
                              'Discover Data',
                              style: TextStyle(
                                  fontSize: 20, color: Colors.deepPurpleAccent),
                            ),
                          ),
                          Container(
                              decoration: BoxDecoration(boxShadow: [
                                BoxShadow(
                                    color: Colors.blue,
                                    blurRadius: 10,
                                    spreadRadius: 2)
                              ]),
                              child: Echarts(
                                option: '''
                                      xAxis: {
                                        type: 'category',
                                        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
                                      },
                                      yAxis: {
                                        type: 'value'
                                      },
                                      series: [{
                                        data: [820, 932, 901, 934, 1290, 1330, 1320],
                                        type: 'bar'
                                      }]
                                    }
                                  ''',
                              ),
                              height: 400),
                          Padding(
                            padding: EdgeInsets.all(15),
                            child: RaisedButton(
                              child: Text('Contact Me!'),
                              onPressed: () => contactUs(context),
                            ),
                          )
                        ])))))));
  }

  void contactUs(BuildContext context) {
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return AlertDialog(
          title: Text('Contact Us'),
          content: Text('e-mail: [email protected]'),
          actions: <Widget>[
            FlatButton(
              child: Text('Close'),
              onPressed: () => Navigator.of(context).pop(),
            )
          ],
        );
      },
    );
  }
}

Echart website shows two other color palette along with default palette for charts. Is there a way we can utilize dark palette here in flutter_echarts? If so, how can we do it?

app底下有4个tabbar按钮，切换页面时会导致webview重新加载白屏

目前需求是图表需要实时更新
大约每秒即会刷新一次图表

但每次图表的更新, 都会重制当前缩放位置以及大小
例如
初始缩放是 x 轴的 0 到 50
此时使用手势缩放并移动至 40 到 100

那么在图表有新资料进行刷新时又会重置位置至 0 到 50
请问有什么方法可以保持位置以及缩放状态呢?

或者是在缩放以及更改位置时有回调可以接相关参数
方便在下次图表刷新时一并带入同步

在Sliver 控件中添加多个图表 在未见区域 图表会丢失 多发现象

按文档中的说明，引入相关库，get
然后Run .结果该显示曲线的地方一片空白 。
模拟器：iphone8 13.3
[✓] Flutter (Channel stable, v1.12.13+hotfix.5, on Mac OS X 10.15.2 19C57, locale zh-Hans-CN)
• Flutter version 1.12.13+hotfix.5 at /Users/kazeik/Documents/flutter
• Framework revision 27321ebbad (5 weeks ago), 2019-12-10 18:15:01 -0800
• Engine revision 2994f7e1e6
• Dart version 2.7.0

[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
• Android SDK at /Users/kazeik/Library/Android/sdk
• Android NDK location not configured (optional; useful for native profiling support)
• Platform android-29, build-tools 29.0.2
• Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
• All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.3)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 11.3, Build version 11C29
• CocoaPods version 1.8.4

[✓] Android Studio (version 3.5)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin version 42.1.1
• Dart plugin version 191.8593
• Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)

[✓] IntelliJ IDEA Ultimate Edition (version 2017.2)
• IntelliJ at /Applications/IntelliJ IDEA.app
• Flutter plugin version 21.2.2
• Dart plugin version 172.3317.48

[✓] IntelliJ IDEA Community Edition (version 2019.3.1)
• IntelliJ at /Applications/IntelliJ IDEA CE.app
• Flutter plugin version 42.1.4
• Dart plugin version 193.5731

[✓] VS Code (version 1.41.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.7.1

[✓] Connected device (1 available)
• iPhone 8 • BC9C76F0-9C58-4744-B5F1-2AEFD129F290 • ios • com.apple.CoreSimulator.SimRuntime.iOS-13-3 (simulator)

加入**地图后 但是不显示

Hello there, first of all, amazing library :)

Whenever I add a chart to some scrollable widget, like SingleChildScrollView the chart stops being "realtime" responsive.

For example, if I have a candlestick chart (like this one https://www.echartsjs.com/examples/en/editor.html?c=candlestick-touch ) and want to move the chart data, it will not redraw the chart in realtime, it will only redraw after I release the click.

The chart works as expected if I insert it not inside a scrollable widget.

Please check both thepubspec.yaml and pubspec.lock files.

[✓] Flutter (Channel unknown, v1.12.13+hotfix.5, on Linux, locale en_US.UTF-8)
• Flutter version 1.12.13+hotfix.5 at /home/something/Dev-tools/flutter
• Framework revision 27321ebbad (3 months ago), 2019-12-10 18:15:01 -0800
• Engine revision 2994f7e1e6
• Dart version 2.7.0

[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
• Android SDK at /home/something/Android/Sdk
• Android NDK location not configured (optional; useful for native profiling support)
• Platform android-29, build-tools 29.0.2
• ANDROID_HOME = /home/something/Android/Sdk
• Java binary at: /home/something/.local/share/JetBrains/Toolbox/apps/AndroidStudio/ch-0/193.6224510/jre/bin/java
• Java version OpenJDK Runtime Environment (build 1.8.0_212-release-1586-b4-5784211)
• All Android licenses accepted.

[✓] Android Studio (version 4.1)
• Android Studio at /home/something/.local/share/JetBrains/Toolbox/apps/AndroidStudio/ch-0/193.6224510
• Flutter plugin version 44.0.3
• Dart plugin version 193.6494.35
• Java version OpenJDK Runtime Environment (build 1.8.0_212-release-1586-b4-5784211)

[!] IntelliJ IDEA Community Edition (version 2019.3)
• IntelliJ at /home/something/.local/share/JetBrains/Toolbox/apps/IDEA-C/ch-0/193.6494.35
✗ Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
• For information about installing plugins, see
https://flutter.dev/intellij-setup/#installing-the-plugins

[✓] Connected device (1 available)
• H8314 • BH900VN9BZ • android-arm64 • Android 10 (API 29)

would I like to draw a load with a complete boot component, any listening function or finish loading the object?

似乎在Container里设置高宽无效, 始终是满屏显示. 请指教. 谢谢!

I try to run this examplle, but get below error, please support, thanks:

• What went wrong:
  A problem occurred configuring project ':webview_flutter'.

Could not resolve all artifacts for configuration ':webview_flutter:classpath'.
Could not download guava.jar (com.google.guava:guava:26.0-jre)
> Could not get resource 'https://jcenter.bintray.com/com/google/guava/guava/26.0-jre/guava-26.0-jre.jar'.
> Could not GET 'https://d29vzk4ow07wi7.cloudfront.net/a0e9cabad665bc20bcd2b01f108e5fc03f756e13aea80abaadb9f407033bea2c?response-content-disposition=attachment%3Bfilename%3D%22guava-26.0-jre.jar%22&Policy=eyJTdGF0ZW1lbnQiOiBbeyJSZXNvdXJjZSI6Imh0dHAqOi8vZDI5dnprNG93MDd3aTcuY2xvdWRmcm9udC5uZXQvYTBlOWNhYmFkNjY1YmMyMGJjZDJiMDFmMTA4ZTVmYzAzZjc1NmUxM2FlYTgwYWJhYWRiOWY0MDcwMzNiZWEyYz9yZXNwb25zZS1jb250ZW50LWRpc3Bvc2l0aW9uPWF0dGFjaG1lbnQlM0JmaWxlbmFtZSUzRCUyMmd1YXZhLTI2LjAtanJlLmphciUyMiIsIkNvbmRpdGlvbiI6eyJEYXRlTGVzc1RoYW4iOnsiQVdTOkVwb2NoVGltZSI6MTU4NTYzNzEzMH0sIklwQWRkcmVzcyI6eyJBV1M6U291cmNlSXAiOiIwLjAuMC4wLzAifX19XX0_&Signature=AmBLgQMHdkrkg6XNLlgbut1gDmSSzu-MQm7S0dxCvJFpZe3KCo-PQE5Sp6calp9nQa9BdQfld4sIRdGUnBw0Wmq6ohbHhOf2rLl~rXV18mjxAzeb4v3a-6-5GaMXYEFdTMT9DX4r5HsXikBOxSkPie~ZqM9lkb8yuWnLmCVJajrL~rvlt~7nez9WPOSPIp0Nr5q2SYmaC3JB3Z1ArzuAXcWhFKPSFCvluKPu1EOa28X9yWSgc5ygj2z1ylYVrIsOILsDHXeeKoPb-ZwjmBk0FeREnDaqqNY1GNJEllDMI1t6KCp7Lg01FVCwNaPMV8l6QUCeNztTUglGSScdFwaFDg__&Key-Pair-Id=APKAIFKFWOMXM2UMTSFA'.

Hello,
I use translation because I don't have English.
I am using echarts-gl surface with flutter. But the 'click' method does not work on mobile devices.
It's your example:
"
extraScript: '''
chart.on('click', (params) => {
if(params.componentType === 'series') {
Messager.postMessage('anything');
}
});
''',
"
But this code not working in surface with mobile devices.

Also, I cannot scroll the image in any direction. rotating by drag. How do I add scrool feature with double finger touch function?
Thank you.

Wrapping the chart widget in a SizedBox with a specific height does not work as expected. The chart stays the same natural height no matter the value I provide. Here are some screenshots. The 2 color bands mark the top and bottom of the SizedBox that contains the chart widget.

Hi there,
when i try to install Echarts it works fine but I get much of these warnings in the console :
D/BufferQueueProducer(28647): SurfaceTexture-0-28647-0 cancelBuffer: slot 0
D/BufferQueueProducer(28647): SurfaceTexture-0-28647-0 cancelBuffer: slot 2
D/BufferQueueProducer(28647): SurfaceTexture-0-28647-0 cancelBuffer: slot 0
D/BufferQueueProducer(28647): SurfaceTexture-0-28647-0 cancelBuffer: slot 2

like forever

Probably throws this error:

E/flutter (32506): [ERROR:flutter/lib/ui/ui_dart_state.cc(157)] Unhandled Exception: PlatformException(error, java.lang.IllegalStateException: Trying to create an already created platform view, view id: 0
E/flutter (32506): 	at io.flutter.plugin.platform.PlatformViewsController$1.createPlatformView(PlatformViewsController.java:85)
E/flutter (32506): 	at io.flutter.embedding.engine.systemchannels.PlatformViewsChannel$1.create(PlatformViewsChannel.java:96)
E/flutter (32506): 	at io.flutter.embedding.engine.systemchannels.PlatformViewsChannel$1.onMethodCall(PlatformViewsChannel.java:60)
E/flutter (32506): 	at io.flutter.plugin.common.MethodChannel$IncomingMethodCallHandler.onMessage(MethodChannel.java:231)
E/flutter (32506): 	at io.flutter.embedding.engine.dart.DartMessenger.handleMessageFromDart(DartMessenger.java:93)
E/flutter (32506): 	at io.flutter.embedding.engine.FlutterJNI.handlePlatformMessage(FlutterJNI.java:642)
E/flutter (32506): 	at android.os.MessageQueue.nativePollOnce(Native Method)
E/flutter (32506): 	at android.os.MessageQueue.next(MessageQueue.java:363)
E/flutter (32506): 	at android.os.Looper.loop(Looper.java:173)
E/flutter (32506): 	at android.app.ActivityThread.main(ActivityThread.java:8147)
E/flutter (32506): 	at java.lang.reflect.Method.invoke(Native Method)
E/flutter (32506): 	at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:513)
E/flutter (32506): 	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1101)

I am trying to create a world map using below code. But the map does not display

Echarts(
    option: '''
          {
    title : {
        text: 'World Population (2010)',
        x:'left',
        y:'top',
    },
    tooltip : {
        trigger: 'item',
        formatter : function (params) {
            var value = (params.value + '').split('.');
            value = value[0].replace(/(\d{1,3})(?=(?:\d{3})+(?!\d))/g, '$1,');
            return params.name + ' : ' + value;
        }
    },
    toolbox: {
        show : true,
        orient : 'vertical',
        x: 'right',
        feature : {
            restore : {show: true},
            mark : {show: true},
        }
    },
    dataRange: {
        min: 0,
        max: 1000000,
        text:['High','Low'],
        realtime: false,
        calculable : true,
        color: ['#ED6F61','#faa700','#327589','#75FAD7']
    },
    series : [
        {
            name: 'World Population (2010)',
            type: 'map',
            mapType: 'world',
            roam: true,
            itemStyle:{
                emphasis:{label:{show:true}}
            },
            data:[
                {name : 'Afghanistan', value : 28397.812},
                {name : 'Angola', value : 19549.124},
                {name : 'Albania', value : 3150.143},
                .....
                {name : 'Zimbabwe', value : 13076.978}
            ]
        }
    ]
}
    ''',
)

This is result:

I have a flutter project using flutter_echarts.
I want to add icons to my yAxis, using rich text. the icons are in assets/images/imageName.png,
but when I use it like this in 'rich'

backgroundColor: {
                           image: './assets/images/imageName.png'
                           },
                      },

or like this

backgroundColor: {
                           image: 'assets/images/imageName.png'
                           },
                      },

the icon is not displayed.
is there another way?

在模拟器上图表初次渲染非常慢，大概十秒才渲染出来

i have add a method dispatchaction like this
extraScript: '''
chart.dispatchAction({
type:'highlight',
seriesIndex: 1,
dataIndex: 0
});
''',
but this chart is not any display

在App上正常，但是在Flutter Web上报错：Uncaught (in promise) Error: PlatformException(Unregistered factory, No factory registered for viewtype 'plugins.flutter.io/webview', null)

初始化y轴数值小时可以显示完整，当挪动底部 datazoom 时y轴数值变大就显示不完整了。

import 'package:flutter/material.dart';
import 'package:flutter_echarts/flutter_echarts.dart';

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new Scaffold(
      appBar: AppBar(
        title: Text('首页'),
      ),
      body: Container(
        child: Echarts(
          option: '''
    {
      xAxis: {
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
      },
      yAxis: {
        type: 'value'
      },
      series: [{
        data: [820, 932, 901, 934, 1290, 1330, 1320],
        type: 'line'
      }]
    }
  ''',
        ),
        width: 300,
        height: 250,
      ),
    );
  }
}

测试结果是页面一片空白

When the EChart widget is disposed (e.g. because the current screen is being popped), the following error is thrown:

E/flutter (10195): [ERROR:flutter/lib/ui/ui_dart_state.cc(157)] Unhandled Exception: 'package:webview_flutter/webview_flutter.dart': Failed assertion: line 546 pos 12: 'url != null': is not true.
E/flutter (10195): #0 _AssertionError._doThrowNew (dart:core-patch/errors_patch.dart:42:39)
E/flutter (10195): #1 _AssertionError._throwNew (dart:core-patch/errors_patch.dart:38:5)
E/flutter (10195): #2 WebViewController.loadUrl
package:webview_flutter/webview_flutter.dart:546
E/flutter (10195): #3 _EchartsState.dispose

This error is thrown because the loadUrl function does not accept null as an argument:

Future<void> loadUrl( String url, { Map<String, String> headers, }) async { **assert(url != null);** _validateUrlString(url); return _webViewPlatformController.loadUrl(url, headers); }

But null is passed to it here:

// --- FIX_IOS_LEAK --- @override void dispose() { super.dispose(); _controller.loadUrl(null).then((_) { _controller.clearCache(); }); } // --- FIX_IOS_LEAK ---

Though I set the background color, background color before display is white on a tick. If my app background is no white, even is black, it will be disharmony.

尽管设置了背景颜色，但在视图显示之前，会有一瞬间的白色。如果我的APP背景颜色不是白色，甚至是黑色，将导致严重的色差冲突。

FAILURE: Build failed with an exception.

• What went wrong:
  Could not determine the dependencies of task ':app:compileDebugJavaWithJavac'.

Could not resolve all task dependencies for configuration ':app:debugCompileClasspath'.
Could not resolve io.flutter:flutter_embedding_debug:1.0.0-540786dd51f112885a89792d678296b95e6622e5.
Required by:
project :app
project :app > project :webview_flutter
> Skipped due to earlier error
> Skipped due to earlier error
> Skipped due to earlier error
Could not resolve io.flutter:x86_64_debug:1.0.0-540786dd51f112885a89792d678296b95e6622e5.
Required by:
project :app
> Skipped due to earlier error
> Skipped due to earlier error
> Skipped due to earlier error
Could not resolve io.flutter:x86_debug:1.0.0-540786dd51f112885a89792d678296b95e6622e5.
Required by:
project :app
> Skipped due to earlier error
> Skipped due to earlier error
> Skipped due to earlier error

• Try:
  Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

• Get more help at https://help.gradle.org

BUILD FAILED in 2m 41s
Exception: Gradle task assembleDebug failed with exit code 1

echarts渲染出来以前，会在渲染区域闪一下黑色，这个有没有解决办法啊

如何和异步接口协作，获取数据前显示loading，结束后关闭loading?
目前只能通过以下方式显示loading
extraScript: '''
chart.showLoading();
'''

控制台显示
ViewRootImpl: jank_removeInvalidNode jank list is null

图表在手机上加载显示出来后，x,y轴文字显示比例很小，
有点看不清楚。

Hello! The library is amazing but I must notify an error that made me lose 1 hour to understand why the library doesn't work.
In the example, the option terminates with the use of ; and this breaks the chart.

Error Domain=WKErrorDomain Code=4 "A JavaScript exception occurred" UserInfo={WKJavaScriptExceptionLineNumber=1, WKJavaScriptExceptionMessage=TypeError: chart.setOption is not a function. (In 'chart.setOption', 'chart.setOption' is undefined), WKJavaScriptExceptionSourceURL=data:text/html;base64,ICAgIDwhRE9DVFlQRSBodG1sPgogICAgPGh0bWw+CiAgICAgIDxoZWFkPgogICAgICAgIDxtZXRhIGNoYXJzZXQ9InV0Zi04Ij ... PgogIA==, NSLocalizedDescription=A JavaScript exception occurred, WKJavaScriptExceptionColumnNumber=22})
0 StandardMethodCodec.decodeEnvelope (package:flutter/src/services/message_codecs.dart:569:7)
1 MethodChannel.invokeMethod (package:flutter/src/services/platform_channel.dart:321:33)

2 MethodChannelWebViewPlatform.evaluateJavascript (package:webview_flutter/src/webview_method_channel.dart:95:21)
3 WebViewController.evaluateJavascript (package:webview_flutter/webview_flutter.dart:655:39)
4 _EchartsState.init (package:flutter_echarts/flutter_echarts.dart:112:24)
5 _EchartsState.echartWidget. (package:flutter_echarts/flutter_echarts.dart:141:9)
6 _PlatformCallbacksHandler.onPageFinished (package:webview_flutter/webview_flutter.dart:481:15)
7 MethodChannelWebViewPlatform._onMethodCall (package:webview_flutter/src/webview_method_channel.dart:41:35)
8 MethodChannel._handleAsMethodCall (package:flutter/src/services/platform_channel.dart:402:55)
9 MethodChannel.setMethodCallHandler. (package:flutter/src/services/platform_channel.dart:370:54)
10 _DefaultBinaryMessenger.handlePlatformMessage (package:flutter/src/services/binding.dart:200:33)
11 _invoke3. (dart:ui/hooks.dart:303:15)
12 _rootRun (dart:async/zone.dart:1126:13)
13 _CustomZone.run (dart:async/zone.dart:1023:19)
14 _CustomZone.runGuarded (dart:async/zone.dart:925:7)
15 _invoke3 (dart:ui/hooks.dart:302:10)
16 _dispatchPlatformMessage (dart:ui/hooks.dart:162:5)

This is caused by a known issue of webview_flutter: flutter/flutter#44039 .
It seems related to the GPU accelaration of Android WebView.
We temporarily fixed it by Adding a controlled Opacity Widget.
Please upgrade to version 1.3.1

我想在 toolbox 中自定义按钮监听，可以让 flutter 获得点击事件通知么？

按这个圆形中的大小，应该是50%啊，怎么只有30%啊？能不能根据数字的大小，实现水量的大小啊？跪求一下实现代码，谢谢！

is there a way to give a background color for the whole area of the axis labels, instead of giving each axis label it's own background , which doesn't look good when scaling?

in addition, I have this y axis on the left-

and I want to give each label a different background, but that the background would take the entire label container, meaning each label will have 20% of the bg (5 labels). it doesn't work with this code of rich text :
` rich:
{
One:
{
width: '20%',
height:27,
color:'#33334d',
fontSize: 12,
backgroundColor:'rgba(194, 156, 215, 0.8)',
},

                 Two:{
                  width:'20%',
                  height:27,
                    color:'#33334d',
                  fontSize: 12,
                  backgroundColor:'rgba(210, 210, 210, 0.8)',
                 
                     }...,`

thank you.