echarts 是一款可視化的數(shù)據(jù)展示工具,在使用時需要對數(shù)據(jù)進(jìn)行處理后再使用。如果有多個 json 數(shù)據(jù)需要展示,那么需要對每個數(shù)據(jù)進(jìn)行格式化處理,以便于 echarts 的使用。
// 示例代碼 var data1 = [ {name: "A", value: 20}, {name: "B", value: 40}, {name: "C", value: 60}, ]; var data2 = [ {name: "D", value: 80}, {name: "E", value: 100}, {name: "F", value: 120}, ]; var option1 = { ... }; var option2 = { ... }; // 對數(shù)據(jù)進(jìn)行格式化處理 var formattedData1 = { xAxis: {}, yAxis: {}, series: [{ data: data1, ... }] }; var formattedData2 = { xAxis: {}, yAxis: {}, series: [{ data: data2, ... }] }; // 使用格式化后的數(shù)據(jù)渲染 echarts 圖表 echarts.init(document.getElementById('chart1')).setOption(option1); echarts.init(document.getElementById('chart2')).setOption(option2);
根據(jù)以上示例代碼,我們可以發(fā)現(xiàn),針對每個 json 數(shù)據(jù),需要對其中的數(shù)據(jù)項(xiàng)進(jìn)行提取,再根據(jù) echarts 圖表的要求進(jìn)行格式化處理,最終才能使用。因此,在對多個 json 數(shù)據(jù)進(jìn)行格式化時,需要根據(jù)數(shù)據(jù)項(xiàng)的格式進(jìn)行提取處理,并結(jié)合 echarts 組件進(jìn)行格式化處理,以符合需要。