New to Kendo UI for jQuery? Start a free 30-day trial

Pdf

configuration

Configures the export settings for the exportPDF method.

pdf

Object

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    dataSource: {
        data: [
            { date: new Date(2000, 1, 1), open: 10, high: 15, low: 8, close: 12 },
            { date: new Date(2000, 1, 2), open: 12, high: 18, low: 10, close: 16 }
        ]
    },
    dateField: "date",
    series: [{
        type: "candlestick",
        openField: "open",
        highField: "high",
        lowField: "low",
        closeField: "close"
    }],
    pdf: {
        fileName: "stock-chart.pdf",
        proxyURL: "/save",
        author: "John Doe",
        creator: "Kendo UI",
        title: "Stock Chart Export"
    }
});
</script>

pdf.author

String

The author of the PDF document.

Default: null

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          author: "John Doe"
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.creator

String

The creator of the PDF document.

Default: "Kendo UI PDF Generator"

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          creator: "John Doe"
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.date

Date

The date when the PDF document is created. Defaults to new Date().

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          date: new Date("2014/10/10")
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.fileName

String

Specifies the file name of the exported PDF file.

Default: "Export.pdf"

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          fileName: "Products.pdf"
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.forceProxy

Boolean

If set to true, the content will be forwarded to proxyURL even if the browser supports saving files locally.

Default: false

pseudo

    <div id="stock-chart"></div>
    <script>
      $("#stock-chart").kendoStockChart({
          pdf: {
              proxyURL: "/save",
              forceProxy: true
          },
          series: [{
            type: "line",
            field: "value",
            categoryField: "date",
            data: [
              { value: 1, date: new Date(2012, 1, 1) },
              { value: 2, date: new Date(2012, 1, 2) }
            ]
          }]
      });

      var chart = $("#stock-chart").getKendoStockChart();
      chart.saveAsPDF();
    </script>

pdf.keywords

String

Specifies the keywords of the exported PDF file.

Default: null

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          keywords: "monthly report"
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.landscape

Boolean

Set to true to reverse the paper dimensions if needed such that width is the larger edge.

Default: false

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          paperSize: "A4",
          landscape: true
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.margin

Object

Specifies the margins of the page (numbers or strings with units). Supported units are "mm", "cm", "in" and "pt" (default).

<div id="stock-chart" style="width: 600px; height: 400px;"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          margin: {
              left: 10,
              right: "10pt",
              top: "10mm",
              bottom: "1in"
          }
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.paperSize

String|Array

Specifies the paper size of the PDF document. The default "auto" means paper size is determined by content.

The size of the content in pixels will match the size of the output in points (1 pixel = 1/72 inch).

Supported values:

A predefined size: "A4", "A3" etc
An array of two numbers specifying the width and height in points (1pt = 1/72in)
An array of two strings specifying the width and height in units. Supported units are "mm", "cm", "in" and "pt".

Default: "auto"

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          paperSize: ["20cm", "20cm"]
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.proxyTarget

String

A name or keyword indicating where to display the document returned from the proxy.

If you want to display the document in a new window or iframe, the proxy should set the "Content-Disposition" header to inline; filename="<fileName.pdf>".

Default: "_self"

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          forceProxy: true,
          proxyURL: "/save",
          proxyTarget: "_blank"
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.proxyURL

String

The URL of the server side proxy which will stream the file to the end user.

A proxy will be used when the browser isn't capable of saving files locally. Such browsers are IE version 9 and lower and Safari.

The developer is responsible for implementing the server-side proxy.

The proxy will receive a POST request with the following parameters in the request body:

contentType: The MIME type of the file
base64: The base-64 encoded file content
fileName: The file name, as requested by the caller.

The proxy should return the decoded file with set "Content-Disposition" header.

Default: null

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          proxyURL: "/save"
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.subject

String

Sets the subject of the PDF file.

Default: null

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          subject: "Products"
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

pdf.title

String

Sets the title of the PDF file.

Default: null

<div id="stock-chart"></div>
<script>
  $("#stock-chart").kendoStockChart({
      pdf: {
          title: "Products"
      },
      series: [{
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) }
        ]
      }]
  });

  var chart = $("#stock-chart").getKendoStockChart();
  chart.saveAsPDF();
</script>

Related Members