Echarts 相关操作
一个柱状图包含多个信息
数据
这里的statisticData 类型为:List<Map<Object,Object>>
series: [{
name: '统计信息',
type: 'bar',
data: statisticData,
}]
提示
tooltip:{
trigger:'axis',
axisPointer:{
type:'shadow',
},
formatter:function(params) {
return params[0].data.value + "<br>"+ params[0].data.test;
}
},
效果图
完整代码
var chartDom = document.getElementById('chartMain');
var myChart = echarts.init(chartDom);
var option;
option = {
tooltip:{
trigger:'axis',
axisPointer:{
type:'shadow',
},
formatter:function(params) {
console.log(params);
return "<b>"+params[0].axisValue+":</b><br>"+
"<div style='display: flex;justify-content: space-between;width: 300px'><span>常住农户加入合作经济组织比率(%):</span><span>"+params[0].data.value+"%</span></div>"+
"<div style='display: flex;justify-content: space-between;width: 300px'><span>入社入会农户数:</span><span>"+params[0].data.test+"</span></div>";
}
},
legend: {
data: ['统计信息'],
},
xAxis: {
type: 'category',
data: [1,2,3]
},
yAxis: {
type: 'value',
axisLabel: {
show: true,
interval: 'auto',
formatter: '{value}%'
},
},
series: [{
name: '统计信息',
type: 'bar',
data: [{value:1,test:23},{value:1,test:23},{value:1,test:23}],
}]
};
myChart.setOption(option);