如何在颤振图中显示 JSON 数据

时间:2021-03-01 13:32:02

标签: json api flutter

我尝试将 JSON 数据放入 flutter chart,我使用了 syncfusion_flutter_charts 库,但它不起作用,它只显示 y 轴点而不显示 x 轴点,任何人都可以帮助我在 flutter SfCartesianChart 中显示 json 数据 要么 帮我把这个数据放到其他的flutter图表中

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
import 'package:syncfusion_flutter_charts/charts.dart';

class Graph extends StatefulWidget {
@override
_GraphState createState() => _GraphState();
}
class _GraphState extends State<Graph> {
Future<String> fetchUsers() async {
String url = 'http://us.rdigs.com/jsonData.php';
  var response = await http.get(url);
  print(response.body);
  return response.body.toString();
}

@override
  void initState() {
  loadSalesData();
  super.initState();
}

@override
Widget build(BuildContext context) {
    return Scaffold(
    appBar: AppBar(
      title: Text("Graph"),
    ),
    body: SfCartesianChart(
          title: ChartTitle(text: 'Leads'),
          primaryXAxis: CategoryAxis(),
          series: <LineSeries<LinearSales, String>>[
          LineSeries<LinearSales, String>(
            
            dataSource: chartData,
            xValueMapper: (LinearSales sales, _) => sales.name,
            yValueMapper: (LinearSales sales, _) => sales.leads,
          )
        ]));
      }

 List<LinearSales> chartData = [];
 Future loadSalesData() async {
  final jsonResponse = json.decode(jsonString);
 // print(jsonString);
 // print(jsonResponse);
 setState(() {
  for (Map i in jsonResponse) chartData.add(LinearSales.fromJson(i));
 });
 }
}
class LinearSales {
  LinearSales(this.name, this.leads);
  final String name;
  final int leads;
  factory LinearSales.fromJson(Map<String, dynamic> parsedJson) {
  //print(parsedJson);
  return LinearSales(
    parsedJson['name'],
    parsedJson['leads'],
  );
 }
}

0 个答案:

没有答案