Echarts 自定义数据视图

toolbox : {
show : true,
feature : {
dataView : {
optionToContent : function(option) {
// 行名称
var axisData = option.xAxis[0].data;
// 列名称
var header = option.legend[0].data;
var seriesarr = option.series;
var eldiv = '<div id="viewdata" style="width:100%;display:block;margin-left:85px;overflow:auto;">';
var firsttd = '<td></td>';
var table = '<table style="width:100%;text-align:left;overflow:scroll;"><tbody>'
+ '<tr>'
if (header != undefined) {
for (var i = 0; i < header.length; i++) {
firsttd += '<td>' + header[i] + '</td>'
}
} else {
table = '<table style="width:50%;text-align:left;overflow:scroll;"><tbody>';
for (var i = 0; i < 1; i++) {
firsttd += '<td>' + "分数" + '</td>'
}
}
// 表格列头拼装完毕
table += firsttd + '</tr>';
// 表格行头拼装完毕
for (var i = 0, l = axisData.length; i < l; i++) {
table += '<tr>' + '<td>' + axisData[i] + '</td>'
for (var j = 0; j < seriesarr.length; j++) {
table += '<td>' + seriesarr[j].data[i]
+ '</td>'

}
}
table += "</tr>";
table += '</tbody></table>';
return eldiv + table + "</div>";
}
},
magicType : {
show : true,
type : [ 'line', 'bar' ]
},
restore : {
show : true
},
saveAsImage : {
show : true
}
}
},

posted @ 2017-08-07 17:41  洞玄巅峰  阅读(892)  评论(0编辑  收藏  举报