Images

Import from FileMaker

An image is imported from FileMaker if the argument sourceType = stream is set. The image must be of type PNG and encoded as Base64 encoded stream, optionally prefixed with a data URI header: "data:image/png;​base64,". The image stream is entered as string by using the argument sourceData.

For example:

Convert images To Base64

Encoding images to Base64 can be done by using FileMaker’s built-in Base64Encode( ) function or by using an online conversion service such as one offered by https://www.opinionatedgeek.com/​dotnet/​tools/​base64encode

Examples

	EXAMPLE_01

1	OpenDrawing(24;​24)
2	/* Add high resolution icon. */
3	/* The original image size is 64x64 pixels. */
4	AddPicture(0;​0;​24;​24;​stream;​"data:image/png;base64,​iVBORw0KGgoAAAANSUhEUgAAA​EAAAABABAMAAABYR2ztAAAAA3​NCSVQICAjb4U/gAAAAFVBMVEX​////MzMyZmZlmZmYzMzMAAAD/​//8QLgCRAAAAB3RSTlP//////​/8AGksDRgAAAAlwSFlzAAALEg​AACxIB0t1+/AAAABx0RVh0U29​mdHdhcmUAQWRvYmUgRmlyZXdv​cmtzIENTM5jWRgMAAAFISURBV​EiJldRPcoIwFAZwVxygI+7bUQ​7QDpxAWQvhsS4Iuf8RnBpC3t+​mzQrhN5Lv48HB4/V2hetnQU4d​8I8z/KzhZIEjgBQIPCCuTgf1D​qDSQPoDgF4DFwTgJMGEr0MrwY​OAXoKSAJAgZHAfZ5ZjB6GiItb​VcjDtp8PRyMGc0tWkzAheIYa0​XR241+FKcipgUcGcuwXf5P3fM​bNF+Vuo+v3LqpqMAxqIvz/NlV​x3EmQHZiagkyA7k1vObTUKyI0​9yTl4BSxqSuPV6zSAY4wawDEa​FdRaCAxQDK+CFMPpIPsJSjFGH​aQYjQH2p2F8BvcY6ElQEGM4C8​Sh6izwvYHWArHsygRbjMIEq9w​jBaHs3gbszZcglN38Ai68aA5K​XjQHi9gjAzMvmgPPixagZkULU​JKJVsDCihZg5nvkYOJ75MDfqg​woC3biCUwU+G00jdkYAAAAAEl​FTkSuQmCC")
5	CloseDrawing()

	EXAMPLE_02

1	OpenDrawing(220;​200)
2	ChartData(5 4 3 2 1)
3	BarChart(shadow)
4	PictureStyle(all;​stream;​"data:image/png;base64,​iVBORw0KGgoAAAANSUhEUgAAA​B4AAAAlCAIAAADa786bAAAABG​dBTUEAALGPC/xhBQAAACBjSFJ​NAAB6JgAAgIQAAPoAAACA6AAA​dTAAAOpgAAA6mAAAF3CculE8A​AAACXBIWXMAAAsTAAALEwEAmp​wYAAACcmlUWHRYTUw6Y29tLmF​kb2JlLnhtcAAAAAAAPHg6eG1w​bWV0YSB4bWxuczp4PSJhZG9iZ​TpuczptZXRhLyIgeDp4bXB0az​0iWE1QIENvcmUgNS40LjAiPgo​gICA8cmRmOlJERiB4bWxuczpy​ZGY9Imh0dHA6Ly93d3cudzMub​3JnLzE5OTkvMDIvMjItcmRmLX​N5bnRheC1ucyMiPgogICAgICA​8cmRmOkRlc2NyaXB0aW9uIHJk​ZjphYm91dD0iIgogICAgICAgI​CAgICB4bWxuczp0aWZmPSJodH​RwOi8vbnMuYWRvYmUuY29tL3R​pZmYvMS4wLyIKICAgICAgICAg​ICAgeG1sbnM6eG1wPSJodHRwO​i8vbnMuYWRvYmUuY29tL3hhcC​8xLjAvIj4KICAgICAgICAgPHR​pZmY6WVJlc29sdXRpb24+NzI8​L3RpZmY6WVJlc29sdXRpb24+C​iAgICAgICAgIDx0aWZmOkNvbX​ByZXNzaW9uPjU8L3RpZmY6Q29​tcHJlc3Npb24+CiAgICAgICAg​IDx0aWZmOlhSZXNvbHV0aW9uP​jcyPC90aWZmOlhSZXNvbHV0aW​9uPgogICAgICAgICA8eG1wOkN​yZWF0b3JUb29sPkZseWluZyBN​ZWF0IEFjb3JuIDYuMS4zPC94b​XA6Q3JlYXRvclRvb2w+CiAgIC​AgICAgIDx4bXA6TW9kaWZ5RGF​0ZT4yMDE4LTA5LTI0VDA4OjE1​OjU2PC94bXA6TW9kaWZ5RGF0Z​T4KICAgICAgPC9yZGY6RGVzY3​JpcHRpb24+CiAgIDwvcmRmOlJ​ERj4KPC94OnhtcG1ldGE+CpBd​lskAAALeSURBVEgNtVa9b9NAF​PdX4nzacT7rBtEtFSwMBbGwsB​QQYmBkoSCExIRY+BtgYkEIkFh​YWNhBDEyVWFCnCoTUCCHaJqKl​KKT5qOM45tmXXM6O72wEOVnJu​3vv/fy733uXC/9s4ww3nyHMB9​ZBlWx7XuASNz9oOwJ2o95//ej​7t0/dfEU+f6187mopyk7Fy7cX​2XGA+3Dt8/62YZl2pzXcXP9tD​e3l0wo7C7wC6MF+3r1sDk2Pau​9f/RgYI3YWeIUQYJvbrfd9BE1​j9HPXCE0UoEPYT2FR9kGLMV4t​xtlZ4A3v6yt3qoBFoq9e15MZk​VwJtMVLt/RAB17MatKJs8rett​HaM/O6fPGmvrq2gL0Mg3/8YYX​h/heX5Kn9DNL+jrG1cbiz1RtZ​08DK8US1lqqtZGfCPQvU0whd/​Px+/cvHtiecmBR0+e6TmlaJE2​sek9p8m+stBi5gHDSNNy8ajBa​kHpn2LxNxyOQkDxl3ghYPGgPG​waGy7ncsAIG2U/KxWWikQ6dls​lkH9z6CzhVj0/IRb1BLzvv6XS​hucDqsU1kfdR3Waim4SnAawXs​EO6MrQj3oY9blYGit7LA2+qPh​wKbRph70MbS7cUDxDdxzoInPh​adU1kgQpRBQQ0hWXEHAAAZ01h​Sxem2HjkYRJJUR5aSzY4bc0Nf​Bb0U7VQhBEBbAwYAstehsqNse​0hBCOkQjoOFnz4V1P2wu526Iw​Zr6Z6GylACMlDr9kSkdk5tfxz​cOqLh0Mt07tASJh10HjoBDjOL​uPV32JRSrBGuOu3BDh8cXQ06p​rMkgZGsL0x5H9ZmNIVeofU0GI​TujSqls+L2FE4E1RapJCDQAMp​NZMZmVQF9n6rRFSOK0ShMo6nd​akZLpCWuADUGOcKPjV4EaQBxP​Q42/KCOogbWOUsYIgrgbj8UFU​eTT0OZ4hAkScqNjHJACoIA4Wg​E7DJmLwNoFg84DsERqonUEbP7​B21OY2v81/gCA7x3BZlxHxwAA​AABJRU5ErkJggg==";​1.0)
5	BorderStyle(all;​;​0.25;​0 0 0 50)
6	ShadowStyle(all;​2 2 3)
7	AxisLine(all;​0) /* Hide axis lines. */
8	AxisMajorTicks(all;​0) /* Hide axis ticks. */
9	AxisMajorTickLabelTexts(x;​"A";​"B";​"C";​"D";​"E")
10	MajorGridLineWidths(all;​all;​0.25)
11	GridLocation(all;​front)
12	ChartBackground(xy;​1 30 1
13	0.0 220 220 220 255
14	0.35 240 240 240 255
15	1.0 220 220 220 255;​;​0)
16	CloseDrawing()

Import from File

An image is imported from a file if the argument sourceType = file is set. The file name is entered as string by using the argument sourceData. Please refer to File Path Syntax for the allowed syntax for file paths. In order to be imported, images have to be in one of the following image formats:

For example:

Import from Clipboard

An image is imported from the clipboard if the argument sourceType is empty or sourceType = clipboard is set. The argument sourceData is ignored. For example:

It is not recommended to import images from files in a FileMaker server environment. Instead, import images directly from FileMaker by using a Base64 encoded PNG image string. Furthermore, the clipboard is not supported on FileMaker Server, FileMaker Go and FileMaker WebDirect.

Export to FileMaker

xmCHART copies the created drawing as a PNG bitmap image into a FileMaker container field. The image resolution can be controlled by the 3rd argument resolution in the OpenDrawing() function. If there is no 3rd argument or resolution = screen, the drawing will be created as a PNG bitmap with a resolution optimized for screen display. That means Apple’s Retina or Windows HighDPI display resolutions, but also the current Zoom Level set in FileMaker will be properly taken into account. Examples:

xmCHART supports image resolution factors from 0.25 (very coarse and pixelated) to 4 (high resolution). A high resolution bitmap, for example, OpenDrawing(800;​600;​print) is recommended for FileMaker script step Save Records As PDF or Export Field Contents and for all kind of barcodes including QR codes.

Export to File

xmCHART supports the following image formats for export:

Export as bitmap image

The following bitmap export functions are presently available:

The file name is entered as first argument, the resolution can be controlled by using the last argument. For example:

Please note that certain bitmap image formats do not support transparent backgrounds, such as GIF or JPEG. When exporting to these formats, the background color will be white in transparent areas.

Export as vector-based image

The following functions for exporting high–quality vector-based images are available:

For example:

In Windows the functions SaveAsEMFFile() and SaveAsPDFFile() output high resolution 300 dpi bitmaps.

Please refer to File Path Syntax for the allowed syntax for file paths.

Export to Clipboard

The SendToClipboard() function has to be used when copying a drawing to the clipboard. For example:

The clipboard is not supported on FileMaker Server, FileMaker Go and FileMaker WebDirect.

Absolute File Paths

 macOS

Syntax

Variant 1: /users/ user_name / folder_path / file_name

Variant 2: /Volumes/ volume / folder_path / file_name

Examples

 Windows

Syntax

/drive:/ folder_path / file_name

A slash in front of the drive letter is optional and can be omitted.

Examples

Relative File Paths

Path relative to current directory

Syntax

./ folder_path / file_name

The file path is relative to the current database’s location. ./ in front of the path is optional and can be omitted.

Examples

Path relative to parent directories

Syntax

../ folder_path / file_name

Examples

Path relative to user’s home directory

Syntax

~/ folder_path / file_name

Example