获得echarts饼图需要的series中的data格式

最新推荐文章于 2024-06-13 09:33:21 发布

原创最新推荐文章于 2024-06-13 09:33:21 发布 · 1.9w 阅读

16 ·

CC 4.0 BY-SA版权

文章标签：

#Java #JavaScript #Echarts

Java 同时被 2 个专栏收录

11 篇文章

订阅专栏

前端

7 篇文章

订阅专栏

本文介绍了Echarts饼图series中data的正确格式，并提供了后台Java和前端JavaScript处理数据的示例代码，帮助开发者理解如何生成符合要求的数据。

部署运行你感兴趣的模型镜像

需求格式

series中的data

series : [
    {
        name: '风险等级',
        type: 'pie',
        radius: '55%',
        center: ['50%', '60%'],
       /*  data: [
            {value:300, name:'0~5'},
            {value:310, name:'6~10'},
            {value:2342, name:'11~20'},
            {value:1357, name:'20+'},
        ], */
        data: seriesData,
        itemStyle: {
            emphasis: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
            },
            normal:{ 
            label:{ 
                show: true, 
                formatter: '{b} : {c} ({d}%)' 
              }, 
              labelLine :{show:true} 
            } 
        }
    }
]

后台java代码

Map<String, Object> seriesItemMap = null;
Map<String, Object> mapObj = null;
List<Map<String, Object>> seriesList = new ArrayList<>();

for (Map.Entry<String, Long> entry : RankMap.entrySet()) {
    seriesItemMap = new HashMap<String, Object>();
    mapObj = new HashMap<String, Object>();
    System.out.println("key= " + entry.getKey() + " and value= " + entry.getValue()); 
    // key= 0~5 and value= 588
    // key= 20+ and value= 196
    // key= 10~20 and value= 205
    // key= 6~10 and value= 66
    legend.add(entry.getKey());
    seriesItemMap.put("value", entry.getValue());
    seriesItemMap.put("name", entry.getKey());
    mapObj.put("series", seriesItemMap);
    seriesList.add(mapObj);
}     
dataMap.put("seriesList", seriesList);
map.put("data", dataMap);
return map;

前端js代码

$.ajax({
    url : url2, 
    data : {
        "start" : "",
        "end" : ""
    },
    type : 'POST',
    dataType : 'json',
    cache : false,
    async : true,
    success : function(data) {
        var obj = data.data.seriesList;
        console.log(obj); // 输出如下图所示
        var seriesData = [];    
        for(var key in obj) {
            console.log("属性：" + key); // 输出如下图所示
            console.log("值："); // 输出如下图所示
            console.log(obj[key]);
            seriesData.push(obj[key].series);
        }
        console.log(seriesData);
    }
})