SpreadJS 是一款基于 HTML5 的纯前端电子表格控件，兼容 450 种以上的 Excel 公式，凭借其 “高性能、跨平台、与 Excel 高度兼容”的产品特性，备受以华为、苏宁易购、天弘基金等为表明的企业用户青睐。javascript
日前，SpreadJS 正式发布V14.0版本。从该版本开始，SpreadJS加入了数据透视表插件，进一步下降企业数据分析的门槛，提高系统数据处理的能力。css
此外，SpreadJS 还在 V14.0中发布了在线表格编辑器（控件版），做为 SpreadJS 的加强扩展插件，新的编辑器提供了更易嵌入、秒级加载、灵活定制的能力。在线表格编辑器（控件版）可与SpreadJS 集成，助力开发者在主流前端 JS 框架中，实现高性能的模板设计、在线编辑、填报和数据绑定等功能。html
下面的示例展现了如何使用 SpreadJS 建立商业关键业绩指标表单, 例如财务关键业绩指标表单。各项表格大小、位置只需“拖拉拽”便可完成！java
具体代码以下：node
app.js:app
window.onload = function () {
var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"), { sheetCount: 1 });
initSpread(spread);
};
function initSpread(spread) {
var sd = data;
if (sd.length > 0) {
if (!spread) {
return;
}
spread.suspendPaint();
spread.fromJSON(sd[0]);
spread.resumePaint();
}
}
index.html：框架
<!doctype html> <html style="height:100%;font-size:14px;"> <head> <meta name="spreadjs culture" content="zh-cn" /> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" type="text/css" href="$DEMOROOT$/zh/purejs/node_modules/@grapecity/spread-sheets/styles/gc.spread.sheets.excel2013white.css"> <script src="$DEMOROOT$/zh/purejs/node_modules/@grapecity/spread-sheets/dist/gc.spread.sheets.all.min.js" type="text/javascript"></script> <script src="$DEMOROOT$/zh/purejs/node_modules/@grapecity/spread-sheets-resources-zh/dist/gc.spread.sheets.resources.zh.min.js" type="text/javascript"></script> <script src="$DEMOROOT$/spread/source/js/license.js" type="text/javascript"></script> <script src="$DEMOROOT$/spread/source/data/financialKPIs.js" type="text/javascript"></script> <script src="app.js" type="text/javascript"></script> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <div class="sample-tutorial"> <div id="ss" style="width:100%;height:100%"></div> </div> </body> </html>
style.css：编辑器
.sample-tutorial {
position: relative;
height: 100%;
overflow: hidden;
}
body {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}