クライアントウィジェットをブラウザページに追加するには、次の手順を実行します。
- ページのJavaScriptを追加します。一般的なコードは次のとおりです。
JavaScript コードのコピー<!DOCTYPE html> <html> <head> <title>Spread HTML test page</title> - Spread.Sheetsスクリプトを追加します。Spreadには、小型化されたデバッグ済みのスクリプトが用意されています。gc.spread.sheets.all.xxxx.min.jsは、Spreadのすべての機能をサポートします。gc.spread.sheets.xxxx.min.jsは、Spreadのコア機能をサポートします。gc.spread.sheets.functions.xxxx.minは、拡張機能を実現する最小化されたjsファイルです。
<script src="[Your_Scripts_Path]/gc.spread.sheets.all.xxxx.min.js" type="text/javascript"></script> - 外観を変更するためのCSSファイルを追加します。デフォルトの外観を使用するには、gc.spread.sheets.xxxx.cssファイルを使用します。デフォルトの外観は、スクロールバー、フィルタダイアログ、子要素、セル、およびタブストリップのスタイルに適用されます。
<link href="[Your_CSS_Path]/gc.spread.sheets.xxxx.css" rel="stylesheet" type="text/css"/>
//OR
<link href="[Your_CSS_Path]/bootstrap/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link href="[Your_CSS_Path]/bootstrap/bootstrap-theme.min.css" rel="stylesheet" type="text/css"/> - 製品のライセンスを追加します。 たとえば、GC.Spread.Sheets.LicenseKey = "xxx"; "
-
初期化と、その他のすべてのコードを実装します。次の例は、idを「ss」とするDOM要素内で、Spread.Sheetsウィジェットを初期化します。JavaScript コードのコピー<script type="text/javascript"> window.onload = function(){ //初期化 var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"),{sheetCount:3}); //シートの取得 var sheet = spread.getActiveSheet();
// 次の例は、A1セルの値を「A1」に、前景色を赤に設定します。 // TODO: ここに、その他の初期化コードを追加します} } </script> </head> <body> -
Spread.SheetsウィジェットのターゲットとなるDOM要素を作成します。JavaScript コードのコピー<div id="ss" style="height: 500px; width: 800px"></div> </body> </html>
 |
<!DOCTYPE html>は、ウィジェットを正しく表示するために必要です。 |