在Flutter中解析复杂的JSON

时间:2019-08-29 10:08:01

标签: flutter dart

我作为http响应获得的地图列表

    final List<dynamic> scoresByDay = httpResponse[0]['days']['averageScores'];    
    print(scoresByDay);

看起来像:

   [
     {"date":"27\/08\/2019","score":"30.00"},
     {"date":"28\/08\/2019","score":"67.67"},
     {"date":"29\/08\/2019","score":"73.00"},
     {"date":"30\/08\/2019","score":"59.80"},
     {"date":"31\/08\/2019","score":"57.18"},
     {"date":"01\/09\/2019","score":"50.75"},
     {"date":"02\/09\/2019","score":"50.78"},
     {"date":"03\/09\/2019","score":"50.85"},
     {"date":"04\/09\/2019","score":"48.18"},
     {"date":"05\/09\/2019","score":"58.12"}
    ]

我想从这个json数组中得到的是我可以用于Flutter Charting库(简单条形图)的列表。 为了使用此简单条形图,此数组应如下所示:

     final data = [
          new OrdinalSales('27', 30),
          new OrdinalSales('28', 68),
          new OrdinalSales('29', 74),
          new OrdinalSales('30', 60),
          new OrdinalSales('31', 57),
          new OrdinalSales('01', 51),
          new OrdinalSales('02', 51),
          new OrdinalSales('03', 51),
          new OrdinalSales('04', 48),
          new OrdinalSales('05', 58),

];

有什么方法可以使用现有的地图列表来创建显示简单条形图所需的json数组?

编辑:

我设法用简单条形图(https://google.github.io/charts/flutter/example/bar_charts/simple)所需的数据创建了一个数组(simpleBarArrayData)。但是,当我尝试插入该数组而不是简单条形图中的示例数组时,会发生错误:

    type 'List<dynamic>' is not a subtype of type List<OrdinalSales>' 

示例数据数组:

    final data = [
      new OrdinalSales('27', 30),
      new OrdinalSales('28', 68),
      new OrdinalSales('29', 74),
      new OrdinalSales('30', 60),
      new OrdinalSales('31', 57),
      new OrdinalSales('01', 51),
      new OrdinalSales('02', 51),
      new OrdinalSales('03', 51),
      new OrdinalSales('04', 48),
      new OrdinalSales('05', 58),
    ];

创建的数组(simpleBarArrayData)如下:

   print(simpleBarArrayData);

    [
     new OrdinalSales('27',30), 
     new OrdinalSales('28',68), 
     new OrdinalSales('29',73), 
     new OrdinalSales('30',60), 
     new OrdinalSales('31',57), 
     new OrdinalSales('01',51), 
     new OrdinalSales('02',51), 
     new OrdinalSales('03',51), 
     new OrdinalSales('04',48), 
     new OrdinalSales('05',58)
    ]

我试图用以下代码替换现有数据:

    final data = simpleBarArrayData;

并且发生错误。

3 个答案:

答案 0 :(得分:0)

比方说您

List json = [YOUR_GIVEN_JSON_IN_LIST];

您可以创建此方法,并且这里的日期将仅具有您的datesscores的得分。

List<String> dates = [];
List<int> scores = [];

void _fetch() {
  for (var item in json) {
    String date = item["date"];
    dates.add(date.split("\/")[0]);

    String score = item["score"];
    int element = int.parse(score.split("\.")[0]);
    scores.add(element);
  }
}

void _merge() {
  // you can merge by iterating it over
  List<OrdinalSales> data = [];
  for (int i = 0; i < dates.length; i++) {
    data.add(OrdinalSales(dates[i], scores[i]));
  }
}

答案 1 :(得分:0)

给出一个OrdinalSales示例规范,例如

class OrdinalSales {
  String day;
  num score;

  OrdinalSales.fromMap(Map<String, dynamic>  m){
    day = m["date"].substring(0,2); // serious date parsing should be here
    score = num.parse(m["score"]).round();
  }
}

您可以像使用它

List<dynamic> scoresByDay = [
     {"date":"27\/08\/2019","score":"30.00"},
     {"date":"28\/08\/2019","score":"67.67"},
     {"date":"29\/08\/2019","score":"73.00"},
     {"date":"30\/08\/2019","score":"59.80"},
     {"date":"31\/08\/2019","score":"57.18"},
     {"date":"01\/09\/2019","score":"50.75"},
     {"date":"02\/09\/2019","score":"50.78"},
     {"date":"03\/09\/2019","score":"50.85"},
     {"date":"04\/09\/2019","score":"48.18"},
     {"date":"05\/09\/2019","score":"58.12"}
    ];
// parse j with
var result = scoresByDay.map((i) => OrdinalSales.fromMap(i)).toList();
print(result[0].day); // 27
print(result[0].score); // 30

答案 2 :(得分:0)

这是您的json模型

// To parse this JSON data, do
//
//     final ordinalSales = ordinalSalesFromJson(jsonString);

import 'dart:convert';

List<OrdinalSales> ordinalSalesFromJson(String str) => 
new List<OrdinalSales>.from(json.decode(str).map((x) => 
OrdinalSales.fromJson(x)));

String ordinalSalesToJson(List<OrdinalSales> data) => 
json.encode(new List<dynamic>.from(data.map((x) => x.toJson())));

class OrdinalSales {
String date;
String score;

OrdinalSales({
    this.date,
    this.score,
});

factory OrdinalSales.fromJson(Map<String, dynamic> json) => 
new OrdinalSales(
    date: json["date"] == null ? null : json["date"],
    score: json["score"] == null ? null : json["score"],
);

Map<String, dynamic> toJson() => {
    "date": date == null ? null : date,
    "score": score == null ? null : score,
};
}

您可以使用以下URL为JSON创建模型 https://app.quicktype.io/