Retina support

Enterprise+ subscription only

Retina support is only enabled in Enterprise+ subscriptions

Retina displays

Retina is a marketing term coined by Apple that refers to devices and monitors that have a resolution and pixel density so high — roughly 300 or more pixels per inch – that a person is unable to discern the individual pixels at a normal viewing distance.

In order to generate beautiful charts for these Retina displays, Image-Charts supports a retina mode that can be activated through the icretina=1 parameter. If the chart URL contains icretina=1 parameter, the generated chart output will have its width and height size doubled.

Syntax

icretina=<retina_activation>

<retina_activation> set to 1 to activate retina mode and double image size.

Example

Here is a graph of 700 pixels x 200 pixels without retina

chart

icretina=0

Here is a graph of 700 pixels x 200 pixels with retina, image output size as doubled and no pixel will be seen on retina displays.

chart

icretina=1

Usage with `srcset`

The ideal solution is to send the high-resolution image chart version to devices that can use them, while maintaining a standard resolution for others, thus reducing bandwidth usage. The srcset HTML attribute with the x designator does just that and here is the basic idea:

<img src="image-charts-url.jpg" srcset="image-charts-url.jpg 1x, image-charts-url-with-icretina.jpg 2x" alt="My awesome chart">

image-charts-url.jpg will be loaded on usual, standard-resolution device
image-charts-url-with-icretina.jpg will be loaded on high-resolution device (e.g. Retina devices)

Considering that Image-Charts does not requires us to store our own image for our own good (it leverages word-wide CDNs), let's change this example to a more production-ready one: