[PivotGrid] PDF出力

by Wijmo5_jp

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.grapecity.com/wijmo/5.latest/styles/wijmo.min.css">
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.input.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.filter.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.olap.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.pdf.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.grid.pdf.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/cultures/wijmo.culture.ja.min.js"></script>
<script src="https://demo.grapecity.com/wijmo/sample/scripts/sample.js"></script>
<link rel="stylesheet" href="https://demo.grapecity.com/wijmo/sample/styles/sample.css">
<div class="container">

  <h3>PDF出力</h3>
  <p>PivotGridコントロールをPDFファイルに出力します。</p>
  <form name="form" class="form-inline">
    <button id="savePdf" type="button" class="btn btn-default">PDFに保存</button>
  </form>
  <div id="pivotGrid"></div>
  <div id="pivotPanel"></div>

</div>

CSS

#pivotPanel {
  width: 300px;
}
#pivotGrid {
  height: 500px;
  margin-top: 20px;
}

JavaScript

var pivotPanel = new wijmo.olap.PivotPanel('#pivotPanel', {
  itemsSource: sample.ordersDetail(10000)
});
pivotPanel.rowFields.push('分類名', '商品名');
pivotPanel.rowFields[1].width = 200;
pivotPanel.columnFields.push('受注日');
pivotPanel.columnFields[0].format = 'EEEE年度';
pivotPanel.valueFields.push('金額');
pivotPanel.engine.showColumnTotals = 'Subtotals';
pivotPanel.engine.showRowTotals = 'Subtotals';
var pivotGrid = new wijmo.olap.PivotGrid('#pivotGrid', {
  itemsSource: pivotPanel
});

var fontFile = { source: 'http://demo.grapecity.com/wijmo/sample/fonts/ipaexg.ttf', name: 'ipaexg' },
    font = new wijmo.pdf.PdfFont('ipaexg');
document.form.savePdf.addEventListener('click', function (e) {
  wijmo.grid.pdf.FlexGridPdfConverter.export(pivotGrid, 'PivotGrid.pdf', {
    embeddedFonts: [fontFile],
    styles: {
      cellStyle: { font: font }
    }
  });
});