Export Custom Size

• Overview
• Setting Up Custom Size
• Resizing Modes
• Recalculate
• Stretch
• Fit
• RecalculateByProportions
• Combined (Interactive PDF format only)
• Using the cut_extra_space attribute

Overview

By default, when exporting chart to a file of any format, for the width and height of the image or PDF document AnyChart Stock uses the width and height of the flash player for the moment the export is being called.

Some cases require greater flexibility in size when exporting charts. For example, inserting charts into a report as static images with a different layout.

AnyChart Stock gives complete and very flexible control over the size of images and PDF documents being exported. Besides the custom size, the component also allows defining the mode - how the chart would appear when exported at a certain custom size.

Just like the other export settings, the custom size and all the options related to it are configured for each file format individually.

For the sake of better clearness, the component comes with a number of examples; along the course of using them you can quickly familiarize yourself with all the export functions and in particular those that are related to using custom size when exporting.

Below are the links to these examples in all the formats:

Setting Up Custom Size

To export a chart at a custom size, you need to switch the output size mode and set the desired width and height - in pixels - for the desired format.

Here is a sample syntax for setting up a custom size to the JPG/PNG and PDF formats:

As you can see it on the listing, to switch export to a custom size for all the formats, you need to use the size attribute and set its value to "Custom". After that, set the desired chart width and height in pixels with the width and height attributes respectively.

Here is a live example where you can try out this configuration in action. Right-click on the chart area, then select "Save as PNG..." on the menu that appears and save the chart to your hard drive or, save the chart using the "PNG" button on the toolbar under the chart. Once you have saved the chart, you can see for yourself that regardless of the size of the window displaying the chart, the size of the exported image will always be 640 by 480 pixels.

Resizing Modes

When using a custom size, different than the original size of the chart, for the image or PDF document being exported, the component changes the appearance of the chart and makes it fit the new width and height. This operation can use several chart recalculation mechanisms, the so-called "resizing modes".

Here is a sample syntax for setting up the Resizing Mode by the example of exporting to a PNG image:

As you can see it on the listing, the mode is set by the resizing_mode attribute, which can accept the following values: Recalculate, Stretch, Fit, RecalculateByProportions and Combined. The Combined mode is supported exclusively for the Interactive PDF format. By default, for all the formats, the resizing_mode attribute is set to Fit.

The sections below provide vivid description and demonstration of the modes.

Resizing Mode: Recalculate

In the Recalculate mode, the chart uses absolute coordinates for recalculating its content when obtaining a new width and height. All the elements on the chart, after the recalculation, have the same scale as on the original chart.

Here is a set of illustrations demonstrating the behavior of a chart when exporting in the Recalculate resizing mode using different input image dimensions (click on the thumbnails to view the illustrations in full size):

Original	Exported: 1280x960	Exported: 350x250

Here is a sample syntax for enabling this mode for all the exported file types:

Here is a live sample that demonstrates the functioning of the Recalculate mode: Open the sample, resize the window as required and then save the chart to any format using the context menu or the toolbar under the chart:

Resizing Mode: Stretch

In the Stretch mode, the chart, obtaining a new width and height, stretches all the elements, maintaining their original geometrical shape. For example, if the original chart height was 400 pixels, and the exported chart height was 800 pixels, provided that the exported chart width is identical to the original one - after exporting the chart becomes two times higher, and all the elements on it are stretched vertically, yet maintaining their original dimensions horizontally.

Here is a set of illustrations demonstrating the behavior of a chart when exporting in the Stretch resizing mode using different input image dimensions (click on the thumbnails to view the illustrations in full size):

Original	Exported: 1280x960	Exported: 350x250

Here is a sample syntax for enabling this mode for all the exported file types:

Here is a live sample that demonstrates the functioning of the Stretch mode: Open the sample, resize the window as required and then save the chart to any format using the context menu or the toolbar under the chart:

Resizing Mode: Fit

When exporting in the Fit mode, the chart embeds into the exported image or PDF document with specified custom width and height. In such case, the only thing that changes is the scale of the chart elements - upwards or downwards against the original chart size.

Here is a set of illustrations demonstrating the behavior of a chart when exporting in the Fit resizing mode using different input image dimensions (click on the thumbnails to view the illustrations in full size):

Original	Exported: 1280x960	Exported: 350x250

Here is a sample syntax for enabling this mode for all the exported file types:

Here is a live sample that demonstrates the functioning of the Fit mode: Open the sample, resize the window as required and then save the chart to any format using the context menu or the toolbar under the chart:

When using the Fit mode, if the original chart size and the exported chart size are disproportional - the chart will be embedded by the bounds of the exported image, and the vertical or horizontal sides will have blank areas filled with the background color. These areas can be cropped automatically. To find out how to do that, please refer to the Using the cut_extra_space Attribute section.

Resizing Mode: RecalculateByProportions

The RecalculateByProportions mode is a sort of a combination of the two modes: Recalculate and Fit. The chart is embedded by the bounds of the new width and height; at the same time, it is not scaled - instead, it is recalculated using the absolute coordinates.

Here is a set of illustrations demonstrating the behavior of a chart when exporting in the RecalculateByProportions resizing mode using different input image dimensions (click on the thumbnails to view the illustrations in full size):

Original	Exported: 1280x960	Exported: 350x250

Here is a sample syntax for enabling this mode for all the exported file types:

Here is a live sample that demonstrates the functioning of the RecalculateByProportions mode: Open the sample, resize the window as required and then save the chart to any format using the context menu or the toolbar under the chart:

When using the RecalculateByProportions mode, if the original chart size and the exported chart size are disproportional - the chart will be embedded by the bounds of the exported image, and the vertical or horizontal sides will have blank areas filled with the background color. These areas can be cropped automatically. To find out how to do that, please refer to the Using the cut_extra_space Attribute section.

Resizing Mode: Combined (Interactive PDF format only)

Combined Mode can also have fixed width set, though it is intended for use with unknown variable width and height.

Syntax:

Using the "cut_extra_space" Attribute

When using the RecalculateByProportions or Fit modes, if the original chart size and the exported chart size are disproportional - the chart will be embedded by the bounds of the exported image, and the vertical or horizontal sides will have blank areas filled with the background color. These areas can be cropped automatically.

To enable cropping blank areas automatically, set the cut_extra_space attribute to true in the node for the respective format.

Illustrations below show how the exported chart looks like with and without extra space:

Original	Exported: 500x500 with extra space	Exported:500x500 extra space cut

Here is a sample syntax for enabling this option for all the exported formats: