json - 如何在flutter中显示带有json数据的饼图

Question

我还是新手，我一直在尝试在饼图中显示来自 http 请求的一些数据。我找不到任何例子。我已经在互联网上搜索了三天，没有完整的例子希望你能帮助我:)

我研究了这两个解决方案，但是两个示例的 json 文件都不可见，并且我无法 通过 Flutter 中的 API 调用 和 如何在 Flutter 图表中显示 json 数据来成功饼图

标签： jsonflutterdartchartsline

Answer 1

您可以使用pie_chart来创建一个简单的饼图。

你可以像这样实现它：

main.dart

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

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

final Map<String, double> sampleData = {
  "Flutter": 5,
  "React": 3,
  "Xamarin": 2,
  "Ionic": 2,
};

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: PieChartView(
        jsonData: sampleData,
      ),
    );
  }
}

class PieChartView extends StatelessWidget {
  const PieChartView({this.jsonData});

  final Map<String, double> jsonData;

  @override
  Widget build(BuildContext context) {
    return Center(child: PieChart(dataMap: jsonData));
  }
}