SpreadJS製品ヘルプ
行と列の操作
機能 > 行列 > 行と列の操作

以下に説明するように、行と列に対してさまざまな操作を実行できます。

行および列の追加

次のサンプルコードは、列と行を追加します。

JavaScript
コードのコピー 
window.onload = function()
{
 var spread =
 new GC.Spread.Sheets.Workbook(document.getElementById("ss"),{sheetCount:3});
 var sheet = spread.getActiveSheet();
 var sheet = spread.getActiveSheet();

 // 行数を3に設定します。
 sheet.setRowCount(3, GC.Spread.Sheets.SheetArea.viewport);
 sheet.setValue(0, 0, "Row 1", GC.Spread.Sheets.SheetArea.viewport);
 sheet.setValue(1, 0, "Row 2", GC.Spread.Sheets.SheetArea.viewport);
 sheet.setValue(2, 0, "Row 3", GC.Spread.Sheets.SheetArea.viewport);
 sheet.setColumnWidth(0, 90.0, GC.Spread.Sheets.SheetArea.viewport);

 $("#button1").click(function()
   {
     // 行2の後に1行追加します。
     sheet.addRows(1, 1);
     sheet.setValue(1, 0, "Added row");
   });

 $("#button2").click(function()
   {
    // 行2の後に1行追加します。
    sheet.addColumns(1, 1);
    sheet.setValue(0, 1, "Added column");
  });
}

行および列の削除

次のサンプルコードは、列と行を削除します。

JavaScript
コードのコピー 
 $(document).ready(function ()
  {
    var spread =
    new GC.Spread.Sheets.Workbook(document.getElementById("ss"),{sheetCount:3});
    var sheet = spread.getActiveSheet();
   
    // 行数を3に設定します。
    sheet.setRowCount(3, GC.Spread.Sheets.SheetArea.viewport);
    sheet.setValue(0, 0, "The 1st row", GC.Spread.Sheets.SheetArea.viewport);
    sheet.setValue(1, 0, "The 2st row", GC.Spread.Sheets.SheetArea.viewport);
    sheet.setValue(2, 0, "The 3st row", GC.Spread.Sheets.SheetArea.viewport);
    sheet.setColumnWidth(0, 90.0, GC.Spread.Sheets.SheetArea.viewport);
    $("#button1").click(function()
     {
        // 行2を削除します。
        spread.getActiveSheet().deleteRows(1, 1);
     });
   
    $("#button2").click(function()
     {
       //列2を削除します。
       spread.getActiveSheet().deleteColumns(1, 1);
     });
});

行数と列数の設定

次のサンプルコードは、行数および列数を設定します。

JavaScript
コードのコピー 
$(document).ready(function ()
{
    var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"),
    {sheetCount:3});
    var sheet = spread.getActiveSheet();
   
    // 行数および列数を3に設定します。
    sheet.setRowCount(3, GC.Spread.Sheets.SheetArea.viewport);
    sheet.setColumnCount(3, GC.Spread.Sheets.SheetArea.viewport);
});

行の高さと列幅の変更

次のサンプルコードは、行の高さと列幅を変更できます。

Custom row height and column width

JavaScript
コードのコピー 
$(document).ready(function ()
{
    var spread =
    new GC.Spread.Sheets.Workbook(document.getElementById("ss"),{sheetCount:3});
    var sheet = spread.getActiveSheet();
   
    // 2番目の行の高さを変更します。
    sheet.setRowHeight(1, 90.0,GC.Spread.Sheets.SheetArea.viewport);
   
    // 2番目の列の幅を変更します。
    sheet.setColumnWidth(1, 120.0,GC.Spread.Sheets.SheetArea.viewport);
});

選択領域の作成と削除

次のサンプルコードは、選択領域を作成および削除します。

JavaScript
コードのコピー 
window.onload = function()
{
  var spread =
  new GC.Spread.Sheets.Workbook(document.getElementById("ss"),{sheetCount:3});
  var activeSheet = spread.getActiveSheet();
  activeSheet.setColumnCount(5);
     $("#button1").click(function()
     {
         // 行4全体を選択します。
        activeSheet.addSelection(3, -1, 1, -1);
     });
    
     $("#button2").click(function()
      {
         // シート内のすべての選択領域を削除します。
         activeSheet.clearSelection();
     });
}

最上行および最左列の設定

Sheet with custom top row and column

次のサンプルコードは、最上行および最左列を設定します。

JavaScript
コードのコピー 
$("#button1").click(function ()
{
    var activeSheet = spread.getActiveSheet();
    activeSheet.showRow(9, GC.Spread.Sheets.VerticalPosition.top);
});

$("#button2").click(function()
{
    var activeSheet = spread.getActiveSheet();
    activeSheet.showColumn(9, GC.Spread.Sheets.HorizontalPosition.left);
});

表示セルのインデックスの取得

次のサンプルコードは、行および列インデックスを取得します。

JavaScript
コードのコピー 
$("#button1").click(function ()
{
    var spread =
    new GC.Spread.Sheets.Workbook(document.getElementById("ss"),{sheetCount:3});
    var sheet = spread.getActiveSheet();
   
    // 最上行および最左列のインデックスを取得します。
    var topRow = sheet.getViewportTopRow(1);
    var leftCol = sheet.getViewportLeftColumn(1);
    alert("Index of top row being displayed: " + topRow + "\n" +
        "Index of first column being displayed: " + leftCol);
});

 

 

Copyright © 2016 GrapeCity inc. All rights reserved.