React RangeSelector - export

Configures the exporting and printing features.

Selector: Export
Type:

Object

These features allow a user to export your UI component into a document or print it. When exporting is enabled, the "Exporting/Printing" button appears in the UI component. A click on it invokes a drop-down menu that lists exporting and printing commands. The following formats are supported for exporting into: PNG, PDF, JPEG, SVG and GIF.

See Also

backgroundColor

Specifies the color that will fill transparent regions in the resulting file or document.

Type:

String

Default Value: '#ffffff'

This property supports the following colors:

enabled

Enables the client-side exporting in the UI component.

Type:

Boolean

Default Value: false

fileName

Specifies a default name for the file to which the UI component will be exported.

Type:

String

Default Value: 'file'

formats

Specifies a set of export formats.

Selector: Format
Type:

Array<String>

Default Value: ['PNG', 'PDF', 'JPEG', 'SVG', 'GIF']
Accepted Values: 'GIF' | 'JPEG' | 'PDF' | 'PNG' | 'SVG'

NOTE
If the browser does not support exporting to a specific format, the format is excluded from the exporting menu when the UI component is viewed in this browser.

margin

Adds an empty space around the exported UI component; measured in pixels.

Type:

Number

Default Value: 10

printingEnabled

Enables the printing feature in the UI component. Applies only if the export.enabled property is true.

Type:

Boolean

Default Value: true

When printing is enabled, the export menu contains an item that invokes the Print window of the user's browser. It lets the user to select preferred printing properties and to send the print job to the printer.

proxyUrl Deprecated

IMPORTANT
Since v10, Safari browser supports API for saving files, and this property is no longer required.

Specifies the URL of the server-side proxy that streams the resulting file to the end user to enable exporting in the Safari browser.

Type:

String

Default Value: undefined

Generally, exporting is performed using client-side API in browsers. However, the Safari (integrated in Mac OS) browser does not implement an API for saving files. In this instance, the UI component can POST the content to a server-side proxy, which will stream the file back to the end user. To enable this functionality, set the export.proxyUrl property to the proxy, which will stream the file to the end user. When implementing the proxy, take the following information into account.

  • Your proxy will receive a POST request with the following parameters in the request body: fileName, contentType (the MIME type of the file) and base64 (the base-64 encoded file content).
  • The proxy should return the decoded file with the "Content-Disposition" header set to attachment; filename="".

svgToCanvas

A function that renders SVG markup on the HTML canvas. Required to export custom SVG elements (for example, markerTemplate).

Type:

Function

Function parameters:
svg:

SVGElement

An SVG element that will be parsed.

canvas:

HTMLCanvasElement

A container where the content of the SVG element is drawn.

Return Value:

Promise<void> (jQuery or native)

A Promise that is resolved after the HTML canvas content is rendered.

Default Value: undefined

View Demo