[{"id":"ff9bd47a-cd46-472d-af43-366f35920ef1","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"f674ca00-4cf2-4f53-9a08-4aa596ff5f02","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"5f9ed446-5e43-4e35-b070-bbedb3095625","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"c8f61bda-f911-4c26-aa5c-cf046d91d345","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"ffcf2b4f-0e46-41d0-b0b7-0cc510a2a482","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"4200be12-4188-42f3-9cf4-5fcaebbc57f7","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"7bc4edb3-af3c-4fe3-8820-973c7b43d825","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"af815243-c00f-4782-b362-bb52a9129e99","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"bd8aaf4e-1ba8-4025-8ba9-d57cfbefbc58","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"874f311d-9a12-4e41-9c01-e7aaa99ab496","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"5811b0f0-9142-4dec-87d5-11fbd1e001ec","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"cef428a7-3494-4942-81f6-6712e4b9d1e7","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"3be03770-5428-4ad4-8ebc-09708a22e209","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"563145bf-65b2-4718-851d-594d1b9cf1f6","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"b273295a-e4a0-45ad-be8a-5c3a2322d22c","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"76f8df3f-5d71-4244-8fa6-6be30e10170f","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"7990d3f5-9c4c-4c37-9a96-7e7b1cf0e531","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"a5d052e6-ac14-4b26-b51d-2042af4bd88c","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"4a6e9860-0849-40aa-8cdb-c16c5fb52ef4","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"b02661dd-4bf2-4e6a-94c0-c85827e19c52","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"06c9877a-acd0-49b6-8a35-52d10c942e21","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"b9cc95e6-4c7e-4ae6-9168-6270c8b9df48","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"81742c3e-102a-44f5-8e12-83cdddf79651","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"f6568a5c-eb38-4edb-af3a-8af10e64b122","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"f30f3e16-1db8-48eb-b7a8-de189c306e42","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"c38d9bd1-ec29-4861-bea2-e9939a1d40b8","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"c7f7e6eb-630d-4851-ab1a-eeafb6882ff9","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"e82078d4-d506-4d51-83ea-129c35f610c2","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"2cf396a7-8e6d-4ece-867e-2a346c855b76","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"7fdf2b77-d2f1-440f-8bde-79873ae161be","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"4bfbb7a7-db6a-4e62-9bb9-043090f29e06","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"4acb1bbe-766a-4271-a1e7-156999bf6da7","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"e2476b8f-2102-441c-9f8c-bbd9ca5f94c8","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"eeba73bc-77fb-4e4c-addd-f365b53e009b","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"604aae49-9273-455c-813b-c2c97aa713c7","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"fd995bda-fac2-4ef5-ab75-d8f6840b937a","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"24dbdbdf-1539-4e43-8f9f-036adaf28f36","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"6896e627-8625-484c-9487-48803c13019b","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"035cce7b-7cfc-405b-b003-419583668944","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"139bcd73-12b9-4e78-843c-dd63933e35b8","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"f38fe005-cfd6-4f25-9c83-f5a545aaa911","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"5fa9f1d8-ed73-4642-82cd-cb4f7a9a145a","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"09b280d0-fc2f-438a-8d57-e87c6ef02d8b","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]}]
        
(Showing Draft Content)

動的な列サイズ

Spread.Sheetsでは、動的な列サイズがサポートされています。このような動的なサイズ変更はスターサイズ指定および比例サイズ変更とも呼ばれます。

動的な列サイズとは

動的な列のサイズ変更は、ユーザーが指定する加重比率(「*」で表される)に従ってビューポートが正確に分散されるように、列の幅と行の高さを設定する際に使用されます。

動的な列サイズは、次のような場合に加重比率を定義するため、数字と組み合わせて使用できます。

  • 加重係数は、「*」(アスタリスク)または「n *」文字で表されます。nは、0.5*、1.5*、2 *、3 *などの任意の整数値または非整数値を使用できます。

  • 使用可能なサイズは、ビューポートのサイズから表示されている固定サイズを除いたサイズです。(「使用可能なサイズ) = 「ビューポートのサイズ」 - 「表示可能な固定サイズ」)

  • 使用可能なサイズは、ユーザーが定義した加重比率によって、表示されている行または列に分散されます。

  • 列の合計幅は、ビューポートの幅と同じです。(列の合計幅=ビューポートの幅)

使用例

動的な列サイズは、レポートを分析するか、大きなスプレッドシートを処理する際に、複数の列幅を均等に広げる必要がある場合に役立ちます。

たとえば、次の図は、列A、列B、列D、列Eにそれぞれ「1.5 *」、「1.5 *」、「*」、「*」の比率で動的な列サイズを適用したスプレッドシートを示しています。


上記の例では、サイズが「1.5 *」に設定されている列Aおよび列Bは、ビューポートで標準の「*」サイズ列の1.5倍の領域を占めます。

サポートされるユーザー操作

本機能は、行列の追加、削除、サイズ変更やビューポート自体のサイズ変更の場合、ワークシートの列と行が正確にビューポートを占めていることを保証します。

ワークシートで動的な列サイズを構成するには、setColumnWidth() および setRowHeight()メソッドを使用できます。本機能を適用した後、ユーザーがワークシートで次のアクションを実行すると、スター サイズ指定されている列と行のサイズが自動的に変更され、ビューポートはそれらの列や行で完全に占められます。

  • ビューポートのサイズを変更します。

  • ワークシートに列または行の追加、削除、またはサイズ変更を行います。

  • 行数または列数を変更します。

  • 行または列を非表示または再表示します。

  • 行と列をグループ化またはグループ解除します。

  • 行と列にフィルタリングを適用します。

  • ワークシートのアウトライン列を展開または折りたたみます。

JSONファイルをインポートまたはエクスポートする際、動的な列サイズを使用できます。

動的な列サイズ変更の規則

動的な列サイズ機能を使用する際、次の規則に留意する必要があります。

  • 単一のシートで行と列の両方をスターサイズの値に設定できます。

  • スターサイズ行・列のサイズ変更の場合、または、autoFitColumn() / autoFitRow()メソッドを呼び出す場合、対象行または列の実際のサイズが固定サイズに上書きされます。分割サイズ変更モード(nextToモードのみ)で作業する際、対象行または列とともにその次の行または列も固定サイズに上書きされます。

  • 最小のスターサイズ指定が1未満である場合又は、使用可能なサイズが1未満の場合、スターサイズ指定は動的サイズの計算を停止し、古いサイズを保持します。

  • スターサイズ指定されている行または列を「非表示」または「0*」に設定する場合、スターサイズ指定されている行または列を「非表示」または「0*」に設定する場合、getColumnWidth() および getRowHeight()メソッドが0を返します。

  • スターサイズ指定されている行または列を「abc」などのような無効な文字列に設定する場合、デフォルト値として処理されます。

  • ワークシートでズームを行うと、固定行または固定列がズームされ、スターサイズ指定がビューポートを占めるように拡大されます。

  • スターサイズ指定されている行または列が変更される場合、ワークシート内の図形、チャート、コメント、フローティングオブジェクトなどの連結オブジェクトも変更します。

注意: 動的な列サイズ機能には、次のような制限があります。

  • 行ヘッダーと列ヘッダーでは動的なサイズ機能がサポートされません。

  • MS Excelでは、動的な列サイズ機能がサポートされていないため、Excelファイルのインポートおよびエクスポートの際、本機能が適用されません。

  • PDFへの印刷、またはExcelへのエクスポートの場合、ビューサイズ(古いサイズ)で表示されます。

コードの使用

次のサンプルコードは、ワークシートで動的な列サイズを構成する方法を示します。

<script>
  $(document).ready(function()
  {
    // Spreadを初期化します。
    var spread = new GC.Spread.Sheets.Workbook(document.getElementById('ss'), {
      sheetCount: 1
    });
    // activesheetを取得します。
    var activeSheet = spread.getSheet(0);
    activeSheet.suspendPaint();
    var colHeader = GC.Spread.Sheets.SheetArea.colHeader;
    activeSheet.setRowCount(12);
    activeSheet.setColumnCount(5);
    // 動的な列サイズを設定します。
    activeSheet.setColumnWidth(0, "1.5*");
    activeSheet.setColumnWidth(1, "1.5*");
    activeSheet.setColumnWidth(3, "*");
    activeSheet.setColumnWidth(4, "*");
    // 行の高さを設定します。
    activeSheet.setRowHeight(0, 50, colHeader);
    for (var row = 0; row < 12; row++)
    {
      activeSheet.setRowHeight(row, "*");
      for (col = 0; col < 5; col++)
      {
        activeSheet.getCell(row, col)
          .cellPadding('0 0 0 10')
          .vAlign(GC.Spread.Sheets.VerticalAlign.center);
      }
    }
    activeSheet.setValue(0, 0, '会社名', colHeader);
    activeSheet.setValue(0, 1, '市', colHeader);
    activeSheet.setValue(0, 2, '州', colHeader);
    activeSheet.setValue(0, 3, '電話番号', colHeader);
    activeSheet.setValue(0, 4, 'Fax', colHeader);
    activeSheet.setArray(0, 0, [
      ["Super Mart of the West", "Bentonville", "Arkansas", "(800) 555-2797", "(800) 555-2171"],
      ["Electronics Depot", "Atlanta", "Georgia", "(800) 595-3232", "(800) 595-3231"],
      ["K&S Music", "Minneapolis", "Minnesota", "(612) 304-6073", "(612) 304-6074"],
      ["Tom's Club", "Issaquah", "Washington", "(800) 955-2292", "(800) 955-2293"],
      ["E-Mart", "Hoffman Estates", "Illinois", "(847) 286-2500", "(847) 286-2501"],
      ["Walters", "Deerfield", "Illinois", "(847) 940-2500", "(847) 940-2501"],
      ["StereoShack", "Fort Worth", "Texas", "(817) 820-0741", "(817) 820-0742"],
      ["Circuit Town", "Oak Brook", "Illinois", "(800) 955-2929", "(800) 955-9392"],
      ["Premier Buy", "Richfield", "Minnesota", "(612) 291-1000", "(612) 291-2001"],
      ["ElectrixMax", "Naperville", "Illinois", "(630) 438-7800", "(630) 438-7801"],
      ["Video Emporium", "Dallas", "Texas", "(214) 854-3000", "(214) 854-3001"],
      ["Screen Shop", "Mooresville", "North Carolina", "(800) 445-6937", "(800) 445-6938"]
    ]);
    spread.resumePaint();
  });
</script>