SpreadJS 生成报表
作者：互联网
空了再写个完整的demo吧
//报表控件 输入参数待定
function SpreadObj(response) {
var spread = null;
//数据列表
var dataArray = [
["位置", '至上期末位移值（mm）', '本期位移（mm）','至本期末位移(mm)', '最大位移量（mm）', '位移速率（mm/月）', '预警值（mm）', '控制值（mm）'],
];
//数据列表信息 端点坐标
var dataListInfo = {
x: 0,//顶点坐标（左上角） x
y: 4,//顶点坐标（左上角） y
rows: 5,//行数
cols: 7//列数
};
//基本信息
var baseInfo = {
reportName: '',
reportNum: '',
bridgeName: '',
monitorUnit: '',
monitorDate: ''
};
//加载控件
function loadSpread() {
InitBaseInfo();
spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"), {
sheetCount: 1
});
initSpread(spread);//初始化
//bindEvent(spread);//加载按钮事件
switchRowColumn(spread);
}
loadSpread();
//
this.ExportExcel = function (fileName) {
var excelIo = new GC.Spread.Excel.IO();
excelIo.save(spread.toJSON(), function (blob) {
saveAs(blob, fileName + '.xlsx');
}, function (e) {
console.error(e);//err
}, {
//password: '123'//设置密码
});
};
//初始化基础数据
function InitBaseInfo() {
baseInfo.reportName = response.reportName;
baseInfo.reportNum = response.reportnumber;
baseInfo.bridgeName = response.bridgeName;
baseInfo.monitorUnit = response.monitorUnit;
baseInfo.monitorDate = response.monitorDate;
for (var i = 0; i < response.ListData.length; i++) {
var item = response.ListData[i];
dataArray.push(item);
}
dataListInfo.cols = dataArray[0].length;
dataListInfo.rows = dataArray.length;
console.log(dataListInfo);
}
//跟按钮绑定事件
function bindEvent(spread) {
//切换行和列
document.getElementById("btn1").onclick = function () {
switchRowColumn(spread);
};
//打印
document.getElementById("btn2").onclick = function () {
spread.print();//参数为索引
//spread.print(sheetIndex?);
};
//导出
document.getElementById("btn3").onclick = function () {
var excelIo = new GC.Spread.Excel.IO();
//instance.save(json, successCallBack, errorCallBack, options);
console.log(JSON.stringify(spread.toJSON()));
excelIo.save(spread.toJSON(), function (blob) {
saveAs(blob, 'excel1.xlsx');
}, function (e) {
console.error(e);//err
}, {
//password: '123'//设置密码
});
};
}
//初始化 工作簿
function initSpread(spread) {
//设置工作表名称
var sheet1 = spread.sheets[0];
sheet1.name("Common Chart");
//定义图表类型
var chartType = [{
type: GC.Spread.Sheets.Charts.ChartType.line,
desc: "line",
}, {
type: GC.Spread.Sheets.Charts.ChartType.lineStacked,
desc: "lineStacked",
}, {
type: GC.Spread.Sheets.Charts.ChartType.lineStacked100,
desc: "lineStacked100",
}, {
type: GC.Spread.Sheets.Charts.ChartType.lineMarkers,
desc: "lineMarkers",
}, {
type: GC.Spread.Sheets.Charts.ChartType.lineMarkersStacked,
desc: "lineMarkersStacked",
}, {
type: GC.Spread.Sheets.Charts.ChartType.lineMarkersStacked100,
desc: "lineMarkersStacked100",
}];
spread.suspendPaint();
//初始化 工作表
initSheet(sheet1,chartType[3].desc);
//添加图表
initChart(sheet1,chartType[3].type);
spread.options.tabStripRatio = 0.8;
spread.resumePaint();
}
//初始化 工作表
function initSheet(sheet) {
sheet.suspendPaint();//挂起渲染
sheet.setArray(dataListInfo.y, dataListInfo.x, dataArray);//参数： y x data
sheet.resumePaint();//继续渲染
//var activeSheet = spread.getActiveSheet();//获取当前激活的工作表
var activeSheet = sheet;
//value = instance.getCell(row, col, sheetArea);
//cell.hAlign(GC.Spread.Sheets.HorizontalAlign.center);
activeSheet.getCell(0, 0).value(baseInfo.reportName).font("25pt 宋体").hAlign(GC.Spread.Sheets.HorizontalAlign.center);
activeSheet.getCell(1, 0).value("报表编号（" + baseInfo.reportNum + ")").font("15pt 宋体").hAlign(GC.Spread.Sheets.HorizontalAlign.center);
activeSheet.getCell(2, 0).value("桥梁名称：" + baseInfo.bridgeName);
activeSheet.getCell(2, 4).value("监测单位：" + baseInfo.monitorUnit);
activeSheet.getCell(3, 0).value("监测时间：" + baseInfo.monitorDate);
//行号自适应
activeSheet.getCell(dataListInfo.rows + 20, 0).value("说明").hAlign(GC.Spread.Sheets.HorizontalAlign.center);;
activeSheet.getCell(dataListInfo.rows + 21, 0).value("分析与建议").hAlign(GC.Spread.Sheets.HorizontalAlign.center);;
activeSheet.getCell(dataListInfo.rows + 22, 0).value("监控员： 分析员： 审核员：");
//单元格高宽自适应
//activeSheet.autoFitColumn(0);//列宽自适应 参数：columnIndex
activeSheet.autoFitRow(0);//行高自适应 参数：rowIndex
activeSheet.autoFitRow(1);
//单元格居中
//value = instance.getRange(row, col, rowCount, colCount, sheetArea);
activeSheet.getRange(dataListInfo.y, dataListInfo.x, dataListInfo.rows, dataListInfo.cols, GC.Spread.Sheets.SheetArea.viewport).hAlign(GC.Spread.Sheets.HorizontalAlign.center);
//列宽自适应
for (var i = dataListInfo.x + 1; i < dataListInfo.cols; i++) {
activeSheet.autoFitColumn(i);
}
//单元格合并
//value = instance.addSpan(row, column, rowCount, colCount, sheetArea);
var baseColumns = 8;//合并列最大宽度
activeSheet.addSpan(0, 0, 1, baseColumns, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.addSpan(1, 0, 1, baseColumns, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.addSpan(2, 0, 1, baseColumns / 2, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.addSpan(2, baseColumns / 2, 1, baseColumns / 2, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.addSpan(3, 0, 1, baseColumns, GC.Spread.Sheets.SheetArea.viewport);
//行号自适应
activeSheet.addSpan(dataListInfo.rows + 20, 0, 1, 2, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.addSpan(dataListInfo.rows + 20, 2, 1, baseColumns - 2, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.addSpan(dataListInfo.rows + 21, 0, 1, 2, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.addSpan(dataListInfo.rows + 21, 2, 1, baseColumns - 2, GC.Spread.Sheets.SheetArea.viewport);
activeSheet.addSpan(dataListInfo.rows + 22, 0, 1, baseColumns, GC.Spread.Sheets.SheetArea.viewport);
//activeSheet.getCell(0, 0).borderBottom(new GC.Spread.Sheets.LineBorder("", GC.Spread.Sheets.LineStyle.medium));
//activeSheet.getRange(-1, 3, -1, 1, GC.Spread.Sheets.SheetArea.viewport).borderBottom(new GC.Spread.Sheets.LineBorder("blue", GC.Spread.Sheets.LineStyle.mediumDashed));
//隐藏网格线
//activeSheet.options.gridline = {
// showVerticalGridline: false,
// showHorizontalGridline: false
//};
////数据列表不跟着列标题走，解决：写入空单元格写入空数据，就不会有那样的问题
//for (var i = 0; i < 4; i++) {
// //行
// activeSheet.getCell(i, 0).value("");
//}
//for (var i = 0; i < dataArray.length; i++) {
// //行
// for (var j = 0; j < dataArray[0].length; j++) {
// //列
// activeSheet.getCell(i + 4, j).value(dataArray[i][j]);
// }
//}
}
//初始化 图表
function initChart(sheet) {
//add common chart
//GC.Spread.Sheets.Charts.Chart(sheet, name, chartType, x, y, width, height, dataRange, dataOrientation);
//chartType：图表类型
// 位置：GC.Spread.Sheets.Charts Namespace : ChartType Enumeration:
// 类型：line，lineMarkers，columnClustered，pie
//dataOrientation：数据区域
//sheet.charts.add('Chart1', GC.Spread.Sheets.Charts.ChartType.lineMarkers, 0, 100, 800, 300, "A11:H14");
//根据列表自动调整图表的位置
//一个单元格默认为20的高度
var y = dataListInfo.rows * 20 + 6 * 20;
var width = dataListInfo.cols * 110;
var chart = sheet.charts.add('chart1', GC.Spread.Sheets.Charts.ChartType.lineMarkers, 0, y, width, 300, getArea());
var title = chart.title();
title.text = "";//图表的名称，缺省时不显示
title.fontSize = 18;
chart.title(title);
}
//根据 数据列表 得到 统计图表 的数据区域（dataOrientation）
function getArea() {
//例子
//A1:H4
//10, 0
//A11:H14
var x = dataListInfo.x;
var y = dataListInfo.y;
var character = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "X", "Y", "Z"];
//得到数据列表区域的 两个对角点的坐标
//左上角
var topPos = {
x: 1 + x,
y: 1 + y
};
//右下角
var endPos = {
x: 3 + x,
y: y + dataListInfo.rows
};
var startChar = character[x];//开始字母
var endChar = character[endPos.x - 1];//结束字母
return startChar + topPos.y + ':' + endChar + endPos.y;
}
//切换行和列
function switchRowColumn(spread) {
var activeChart = spread.getActiveSheet().charts.all()[0];
if (activeChart) {
var isSwitched = activeChart.switchDataOrientation();
if (!isSwitched) {
alert("'Can't switch row/column");
}
}
}
}
标签：SpreadJS,报表,dataListInfo,activeSheet,生成,Spread,GC,Sheets,var 来源： https://www.cnblogs.com/guxingy/p/11994463.html