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

ExportOptions.image

configuration

Parameters for the exported Image.

options.width Number

The width of the exported image. Defaults to the scene width.

options.height Number

The height of the exported image. Defaults to the scene height.

options.cors String (default: "anonymous")

Specifies how cross-origin images should be requested.

Requesting images without CORS will "taint" the canvas. It will still be visible on the page, but all script access to it is disabled to prevent information disclosure.

exportOptions.image

Object

<div id="chartwizard"></div>
<script>
$("#chartwizard").kendoChartWizard({
            dataSource: [
                [
                    { field: 'Product Name', value: 'Calzone' },
                    { field: 'Quantity', value: 1 },
                    { field: 'Price', value: 12.39 },
                    { field: 'Tax', value: 2.48 },
                    { field: 'Total', value: 14.87 }
                ],
            ],
            exportOptions: {
                image: {
                    width: 1900,
                    height: 1200
                }
            }
        });
</script>

exportOptions.image.cors

String

Specifies how cross-origin images should be requested.

Requesting images without CORS will "taint" the canvas. It will still be visible on the page, but all script access to it is disabled to prevent information disclosure.

Can be set to:

"anonymous" - do not send user credentials as part of the request
"use-credentials" - send credentials as part of the request
false - fetch images without CORS, possibly tainting the canvas

Default: "anonymous"

<div id="chartwizard"></div>
<script>
$("#chartwizard").kendoChartWizard({
            dataSource: [
                [
                    { field: 'Product Name', value: 'Calzone' },
                    { field: 'Quantity', value: 1 },
                    { field: 'Price', value: 12.39 },
                    { field: 'Tax', value: 2.48 },
                    { field: 'Total', value: 14.87 }
                ],
            ],
            exportOptions: {
                image: {
                    cors: "use-credentials",
                }
            }
        });
</script>

exportOptions.image.height

Number

The width of the exported image. Defaults to the scene width.

<div id="chartwizard"></div>
<script>
$("#chartwizard").kendoChartWizard({
            dataSource: [
                [
                    { field: 'Product Name', value: 'Calzone' },
                    { field: 'Quantity', value: 1 },
                    { field: 'Price', value: 12.39 },
                    { field: 'Tax', value: 2.48 },
                    { field: 'Total', value: 14.87 }
                ],
            ],
            exportOptions: {
                image: {
                    height: 1200,
                }
            }
        });
</script>

exportOptions.image.width

Number

The width of the exported image. Defaults to the scene width.

<div id="chartwizard"></div>
<script>
$("#chartwizard").kendoChartWizard({
            dataSource: [
                [
                    { field: 'Product Name', value: 'Calzone' },
                    { field: 'Quantity', value: 1 },
                    { field: 'Price', value: 12.39 },
                    { field: 'Tax', value: 2.48 },
                    { field: 'Total', value: 14.87 }
                ],
            ],
            exportOptions: {
                image: {
                    width: 1900,
                }
            }
        });
</script>