[{"id":"924e5c0c-0717-4fae-9bbc-0b496941985e","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"22646924-f1ae-4a94-ac8e-e3e8ea2931f2","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"827318c4-10fd-462b-aa96-fab2cff174a9","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"8f626f70-8570-4934-a0e5-fc0ca6584738","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"1029bbcc-399c-42e6-b412-a0437395d2d5","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"7e6097ce-e53b-416c-89c8-a3708db50528","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"3d1b1e48-357c-4999-985c-d9422356690a","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"e6cb5248-c20b-4d3e-adaf-b5c547e29548","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"58695f0f-7cb8-4bad-b617-dda90b01f606","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"081f453a-0e9a-4f06-a70b-18085a1f0d81","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"2c1d8bf8-2b69-4b16-bac9-9c46901abb6a","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"a042f416-d318-415c-b294-ed88a5010572","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"7a454c88-860a-4e28-b52c-b18bae07dfe8","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"63b1ec03-c852-40ec-860e-f025c5791091","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"6b7d135b-71b4-4af7-828c-b28bf70b8ec7","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"5937193e-fd56-4296-8e32-ba41dba8e564","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"8ed468db-93ce-4cb3-8e2b-3249d9d464a7","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"4169f34f-3e9b-45c1-91bf-41c02c3ad5a4","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"411aa66d-8df8-4466-896a-d8de68cf7066","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"7fc8dcfc-27ff-4496-96c2-d92dfe1fb4b2","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"02afd225-87f7-4f6d-8be1-0a303c8beade","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"8040235f-6c53-447e-a7f0-4fe5911e066b","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"0610b0d6-03c7-461b-9dd4-f8d1b1787e7c","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"7919ac2f-121b-447c-82ed-15d13b45df0b","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"1d01b943-eac8-480b-8d85-19bd093c8b3d","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"1f4d1309-e22c-413f-848d-2c0ca8450b0e","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"66d78fb1-e833-4bbf-ac7c-6bdfce9a80b0","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"ed5ad6f1-f5a2-47b8-a915-b185e8471ca3","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"6e9decb7-47f3-4871-81b9-65504bc293f1","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"836dcc3b-2afe-4351-bf9f-bd9e2b0c8510","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"80633614-e86b-4b0b-9129-9f7acab69f6d","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"1aaae15a-3496-43eb-a681-b077034832e4","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"70ce0595-eb94-4eb3-84f6-3a89ab8a4409","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"f3e379ff-ca52-44d8-a15e-966f89904220","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"c1228456-1b5c-429d-b231-25c10a2b41cc","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"58e7444a-12e4-4161-81db-0bb54d09eca9","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"f70c6c85-addd-43e7-8e2b-69dfe4a0a2fd","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"de70365b-d7c6-4355-a59b-3e77a6a374ae","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]}]
ピボットテーブルは、PivotTableクラスとPivotTableManagerクラスを使用して管理されます。ピボットテーブルを作成するには、次の手順を実行します。
プロジェクトにデータソースを追加します。
PivotTables クラスのaddメソッドを使用して、ピボットテーブルを作成します。
PivotTableFieldType列挙体を使用して、さまざまなフィールドにデータを表示します。
通常のデータソースまたは既存のテーブルシートをソースとして使用して、ピボットテーブルを作成できます。
JSONをデータソースとして使用して、ピボットテーブルを作成できます。 例として、さまざまな国で食品や飲料を販売する食品販売会社があるとします。同社は、製品の販売データを毎日管理しています。JSONデータを使用して、ピボットテーブルを作成し、次の情報を提供します。
さまざまな国で販売された各製品の合計数量
各都市で販売された製品の合計数量
次の画像に示すように、ピボットテーブルを使用すると、売上データを簡単に分類し、小計と総計を自動的に計算できます。
次のサンプルコードは、ピボットテーブルを作成し、フィールド領域にフィールドを追加します。
$(document).ready(function () {
// Spreadを初期化します。
var spread = new GC.Spread.Sheets.Workbook(document.getElementById('ss'), { sheetCount: 2 });
spread.suspendPaint();
// シーツを取得します。
var pivotLayoutSheet = spread.getSheet(0);
var dataSourceSheet = spread.getSheet(1);
// シート名を設定します。
pivotLayoutSheet.name("ピボットレイアウト");
dataSourceSheet.name("データソース");
// 行数を設定します。
dataSourceSheet.setRowCount(245);
// データソースを設定します。
dataSourceSheet.setArray(0, 0, pivotDB_UseCase);
// dataSourceSheetにテーブルを追加します。
dataSourceSheet.tables.add('tableSales', 0, 0, 245, 8);
spread.resumePaint();
// ピボットテーブルを初期化します。
initPivotTable(pivotLayoutSheet);
// 両方のシートの列を自動調整します。
autoFit(pivotLayoutSheet);
autoFit(dataSourceSheet);
});
function initPivotTable(sheet) {
// ピボットテーブルを追加します。
var myPivotTable = sheet.pivotTables.add("myPivotTable", "tableSales", 0, 0, GC.Spread.Pivot.PivotTableLayoutType.tabular, GC.Spread.Pivot.PivotTableThemes.dark3);
myPivotTable.suspendLayout();
// ピボットテーブルのrowHeaderとcolumnHeaderを表示します。
myPivotTable.options.showRowHeader = true;
myPivotTable.options.showColumnHeader = true;
// 列フィールドを追加します。
myPivotTable.add("カテゴリ", "カテゴリ", GC.Spread.Pivot.PivotTableFieldType.columnField);
myPivotTable.add("製品", "製品", GC.Spread.Pivot.PivotTableFieldType.columnField);
// 行フィールドを追加します。
myPivotTable.add("県", "県", GC.Spread.Pivot.PivotTableFieldType.rowField);
myPivotTable.add("都市", "都市", GC.Spread.Pivot.PivotTableFieldType.rowField);
// SubtotalType.sumを使用して値フィールドを追加します。
myPivotTable.add("数量", "合計数量", GC.Spread.Pivot.PivotTableFieldType.valueField, GC.Pivot.SubtotalType.sum);
// フィルターフィールドを追加します。
myPivotTable.add("注文日", "注文日", GC.Spread.Pivot.PivotTableFieldType.filterField);
myPivotTable.resumeLayout();
return myPivotTable;
}
function autoFit(sheet) {
// 列を自動調整します。
let columnCount = sheet.getColumnCount();
for (let i = 0; i < columnCount; i++) {
sheet.autoFitColumn(i);
}
}
テーブルシートをデータソースとして使用して、ピボットテーブルを作成できます。この方法を使用すると、データに簡単にアクセスして、ピボットテーブルとテーブルシートの両方の情報を比較および表示できます。また、テーブルシートからピボットテーブルに計算フィールドを追加し、より詳細な分析を行うことができます。
PivotTableManager.addメソッドは、テーブルシート名を sourceData パラメータ値として受け取ります。
次の図は、テーブルシートのデータを使用して、パッケージを購入する際の最低税率や最高税率などをまとめたピボットテーブルを示します。
次のサンプルコードは、既存のテーブルシートのデータを使用してピボットテーブルを作成する方法を示します。
// テーブルシートを初期化します。
var sheet = spread.addSheetTab(0, "TableSheet1", GC.Spread.Sheets.SheetType.tableSheet);
var tableSheetName = "TableSheet1";
// ビューをテーブルシートにバインドします。
myTable.fetch().then(function () {
var view = myTable.addView("myView", [
{ value: "stockItemKey", width: 150, caption: "Stock Item Key" },
{ value: "stockItem", width: 120, caption: "Stock Item" },
{ value: "buyingPackage", width: 120, caption: "Buying Package" },
{ value: "sellingPackage", width: 120, caption: "Selling Package" },
{ value: "unitPrice", width: 150, caption: "Unit Price" },
{ value: "taxRate", width: 120, caption: "Tax Rate" },
{ value: "validFrom", width: 200, caption: "Valid From" }
]);
sheet.setDataView(view);
}).then(() => {
var ptSheet = spread.getSheet(0);
var myPivotTable = ptSheet.pivotTables.add("pivot1", "TableSheet1", 1, 1, GC.Spread.Pivot.PivotTableLayoutType.outline, GC.Spread.Pivot.PivotTableThemes.dark3);
// 行フィールドを追加します。
myPivotTable.add("buyingPackage", "Buying Package", GC.Spread.Pivot.PivotTableFieldType.rowField);
// SubtotalTypeの最小値と最大値を持つ値フィールドを追加します。
myPivotTable.add("taxRate", "Minimum Tax Rate", GC.Spread.Pivot.PivotTableFieldType.valueField, GC.Pivot.SubtotalType.min);
myPivotTable.add("taxRate", "Maximum Tax Rate", GC.Spread.Pivot.PivotTableFieldType.valueField, GC.Pivot.SubtotalType.max);
// 列幅の自動調整。
for (let i = 1; i < 4; i++) {
ptSheet.autoFitColumn(i);
}
});
ピボットテーブルは、次のケースを除いて、テーブルシートのアクセス可能なデータを使用します。
ピボットテーブルには、グループ化した後に、テーブルシートからの新しく追加されたグループを含めることはできません。
ピボットテーブルは、テーブルシートで非表示に設定されている場合でも、フィールドのデータを表示します。
ピボットテーブルの列は、設定されたキャプションではなく、テーブルシートの列名を使用します。したがって、計算された列は、ピボットテーブルで非常に長い名前を持ちます。