根据 api 响应创建饼图

Question

我想使用API​​响应创建一个饼图，但它不起作用 以下是我获取数据的方式：

 Future getPie() async{
  final response = await http.get(Uri.parse("url"));
  final js = jsonDecode(response.body);
  return js;
}

然后，我在将来的构建器中创建PIE

 FutureBuilder(
            future: getPie(),
            builder: (ctx,AsyncSnapshot ss){
              if(ss.hasData){
                return SingleChildScrollView(
                  child: Container(
                    child: Center(
                      child: PieChart(
                        dataMap: ss.data,
                        chartRadius: MediaQuery.of(context).size.width / 1.7,
                        legendOptions: LegendOptions(
                          legendPosition: LegendPosition.bottom
                        ),
                        
                      )
                    ),
                  )
                );
              }else{
                return Center(child: CircularProgressIndicator());
              }
            }
        ),

这是API响应

 { 
   'a' : 2
   'b' : 5
 }

，但我会遇到一个错误：

类型'_internallinkedHashmap＆lt; string，dynamic＆gt;'不是类型'Map＆lt; string，double＆gt;'

的子类型

我还尝试使用地图，但手动工作，而从API中则无法使用：

Future getPie() async{


final response = await http.get(Uri.parse("url"));
final js = jsonDecode(response.body);
final  a= js['a'];
final  b= js['b'];

//this work
final Map<String, double> data = {};
data['a'] = 4;
data['b'] = 5;

//this doesn't
final Map<String, double> data = {};
data['a'] = a;
data['b'] = b;

print(data);

return data;
}

Answer 1

改为这样做：

Future getPie() async {
  final response = await http.get(Uri.parse("url"));
  final js = jsonDecode(response.body);
  var res = Map.fromEntries(js.entries.map((e) => MapEntry<String, double>(e.key, e.value.toDouble())));
  return res;
}