成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

spreadjs使用

madthumb / 3528人閱讀

摘要:設(shè)置單元格屬性設(shè)置文字設(shè)置背景色公式隨機(jī)數(shù)求和和之和到之和條件開啟引用基本操作添加行列設(shè)置背景圖片設(shè)置和的背景色獲取點(diǎn)擊的和所在的離開事件

初始化表單API
const spreadNS = GC.Spread.Sheets;
const SHEETS = new spreadNS.Workbook(this.refs["overseas"]);
// set sheet count
// SHEETS.setSheetCount(1);

const sheet = SHEETS.sheets[0];
設(shè)置默認(rèn)屬性
const defaultStyle = new GC.Spread.Sheets.Style();
// 設(shè)置默認(rèn)背景色
// @method1 defaultStyle.backColor = "LemonChiffon";
// @method2 SHEETS.options.backColor = "#ccc"; 
//defaultStyle.foreColor = "Red";
//defaultStyle.formatter = "0.00";
defaultStyle.font   = "bold normal 9px normal"
defaultStyle.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
defaultStyle.vAlign = GC.Spread.Sheets.VerticalAlign.center;
//defaultStyle.borderLeft = new GC.Spread.Sheets.LineBorder("Green",GC.Spread.Sheets.LineStyle.medium);
//defaultStyle.borderTop = new GC.Spread.Sheets.LineBorder("Green",GC.Spread.Sheets.LineStyle.medium);
//defaultStyle.borderRight = new GC.Spread.Sheets.LineBorder("Green",GC.Spread.Sheets.LineStyle.medium);
//defaultStyle.borderBottom = new GC.Spread.Sheets.LineBorder("Green",GC.Spread.Sheets.LineStyle.medium);
sheet.setDefaultStyle(defaultStyle, spreadNS.SheetArea.viewport);
表格的四個(gè)部分
spreadNS.SheetArea.viewport

// spreadNS.SheetArea include the following parts
// colHeader: 1 ,
//    corner: 0
// rowHeader: 2
//  viewport: 3

// 改變表頭的背景 Set the backcolor of second row header.
sheet.getCell(1, 0, GC.Spread.Sheets.SheetArea.rowHeader).backColor("Yellow");
其他配置
// 表格下邊的tab的顏色 
sheet.options.sheetTabColor = "red";

// 表格只讀 
sheet.options.isProtected = true

// 允許cell內(nèi)容移除
activeSheet.options.allowCellOverflow = true;

// 第一列不可見
sheet.setColumnVisible(0, false)

// 添加tips 
sheet.comments.add(4, 4, "不要修改!");

// 禁止用戶編輯公式 
spread.options.allowUserEditFormula = false;

// 不顯示格子的邊 
sheet.options.gridline = {
    color:"red", 
    showVerticalGridline: true,
    showHorizontalGridline: false
};

// 不顯示表頭 
activeSheet.options.colHeaderVisible = false;
activeSheet.options.rowHeaderVisible = false;
減少重繪
spread.reset() // 清空數(shù)據(jù) 
spread.suspendPaint();  //suspendPaint 暫停重繪  先這樣 很多操作之后 resumePaint
spread.addSheet(0);
spread.fromJSON(json);  // json data
spread.resumePaint();   // 調(diào)用resumePaint 重新激活Spread重繪 
excel 運(yùn)算符
引用運(yùn)算符 含義(示例)
:(冒號(hào)) 區(qū)域運(yùn)算符,產(chǎn)生對(duì)包括在兩個(gè)引用之間的所有單元格的引用 (B5:B15)
,(逗號(hào)) 聯(lián)合運(yùn)算符,將多個(gè)引用合并為一個(gè)引用 (SUM(B5:B15,D5:D15))
(空格) 交叉運(yùn)算符產(chǎn)生對(duì)兩個(gè)引用共有的單元格的引用。(B7:D7 C6:C8)
設(shè)置單元格屬性
      
sheet.getCell(2, 1).
text("huahua").             // 設(shè)置文字 
backColor("rgba(1,1,1,.3)") //設(shè)置背景色 
公式
// 隨機(jī)數(shù) 
 sheet.setFormula(1, 1, "RandBetween(45,85)");

// 求和 
sheet.setFormula(1, 1, "SUM(A1,B1)"); //A1和B1之和
sheet.setFormula(1, 1, "SUM(A1:H1)"); //A1到H1之和 

// 條件 
sheet.setFormula(4, 1, "IF(A1>10, A1*2, A1*3)");
開啟R1C1 引用
// open r1c1 reference
SHEETS.options.referenceStyle = 1;
基本操作
// 添加行/列 
sheet.addRows(1, 1);    sheet.addColumns(1, 1);

// 設(shè)置背景圖片
activeSheet.getCell(1, 1).backgroundImage("Image file path name");
設(shè)置row和column的背景色
/**
* @name set the bgColor of column
*
* @type1
* sheet.getRange(-1, 1, -1, 1).backColor("lightYellow").width(330);
*
* @name set the bgColor of row
*
* @type1
* sheet.getRange(0, -1, 1, -1).backColor("lightYellow").height(44)
*
* @type2
* const rowStyle1 = new spreadNS.Style();
* rowStyle1.backColor = "#bdcde3";
* sheet.setStyle(0, -1, rowStyle1, spreadNS.SheetArea.viewport);
*/
events
// 獲取點(diǎn)擊的cell和所在的sheet 
SHEETS.bind(spreadNS.Events.EnterCell, function (event, data) {
    console.log(data.col)
    console.log(data.row)
    console.log(data)
    var activeSheet = data.sheet;
    activeSheet.startEdit(true);
});

// 離開cell事件 
sheet.bind(GC.Spread.Sheets.Events.LeaveCell, function (event, infos) {
    //Reset the backcolor of cell before moving
    infos.sheet.getCell(infos.row, infos.col).backColor(undefined);
});

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/104239.html

相關(guān)文章

  • SpreadJS 純前端表格控件 V12.2 發(fā)布更新

    摘要:用不到行代碼,在前端實(shí)現(xiàn)的全部功能千萬(wàn)前端開發(fā)者翹首企盼,終發(fā)布更新六大功能特性,帶來(lái)更多便利,用不到行代碼,在前端實(shí)現(xiàn)的全部功能是一款基于的純前端電子表格控件,以高速低耗高度類似可無(wú)限擴(kuò)展為產(chǎn)品特色,提供移動(dòng)跨平臺(tái)和瀏覽器支持,同時(shí)滿足等 用不到100行代碼,在前端實(shí)現(xiàn)Excel的全部功能 千萬(wàn)前端開發(fā)者翹首企盼,SpreadJS V12.2 終發(fā)布更新:六大功能特性,帶來(lái)更多便利,...

    FrozenMap 評(píng)論0 收藏0
  • 從零開始,SpreadJS新人學(xué)習(xí)筆記【第5周】

    摘要:復(fù)制粘貼單元格格式和單元格類型本周,讓我們一起來(lái)學(xué)習(xí)的復(fù)制粘貼單元格格式和單元格類型,希望我的學(xué)習(xí)筆記能夠幫助你們,從零開始學(xué)習(xí),并逐步精通。 復(fù)制粘貼、單元格格式和單元格類型 本周,讓我們一起來(lái)學(xué)習(xí)SpreadJS 的復(fù)制粘貼、單元格格式和單元格類型,希望我的學(xué)習(xí)筆記能夠幫助你們,從零開始學(xué)習(xí) SpreadJS,并逐步精通。 在此前的學(xué)習(xí)筆記中,相信大家已經(jīng)學(xué)會(huì)并熟練掌握了Sprea...

    shadowbook 評(píng)論0 收藏0
  • SpreadJS 純前端表格控件推出新版本,正式支持Angular 2

    摘要:數(shù)百萬(wàn)前端開發(fā)人員翹首期待的,日前宣布版本正式發(fā)布,全面支持是一款純前端表格控件,也是目前市面上唯一的最接近的純前端控件。葡萄城公司成立于年,是全球領(lǐng)先的集開發(fā)工具商業(yè)智能解決方案管理系統(tǒng)設(shè)計(jì)工具于一身的軟件和服務(wù)提供商。 數(shù)百萬(wàn)前端開發(fā)人員翹首期待的SpreadJS,日前宣布V10.2版本正式發(fā)布,全面支持Angular2! SpreadJS 是一款純前端表格控件,也是目前市面上唯一...

    hizengzeng 評(píng)論0 收藏0
  • 純前端開發(fā)案例:用 SpreadJS 搭建信息系統(tǒng)軟件開發(fā)平臺(tái)

    摘要:葡萄城的是一個(gè)基于技術(shù)的純控件,控件性能流暢,有類似的在線表格編輯器,適合非專業(yè)程序員設(shè)計(jì)報(bào)表模板,很符合平臺(tái)部分無(wú)編碼開發(fā)的理念。葡萄城控件產(chǎn)品對(duì)于項(xiàng)目的價(jià)值控件主要用于本項(xiàng)目中的報(bào)表設(shè)計(jì),展示,打印等功能。 showImg(https://segmentfault.com/img/bVbalYk?w=1000&h=400); 華閩通達(dá) - R 平臺(tái)應(yīng)用所使用產(chǎn)品:SpreadJS ...

    Heier 評(píng)論0 收藏0
  • SpreadJS 在 Angular2 中支持哪些事件?

    摘要:在上一篇文章中,我們學(xué)習(xí)了在中支持綁定的屬性,今天我們來(lái)介紹在中支持哪些事件。詳細(xì)的事件說明,請(qǐng)參考博客。版本即將發(fā)布,更多更好的功能盡在新版本中,敬請(qǐng)期待登錄官網(wǎng),了解更多。 showImg(https://segmentfault.com/img/bVP1Wc?w=900&h=500);SpreadJS 純前端表格控件是基于 HTML5 的 JavaScript 電子表格和網(wǎng)格功能...

    姘擱『 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<