mxImageBundle

Maps from keys to base64 encoded images or file locations.  All values must be URLs or use the format data:image/format followed by a comma and the base64 encoded image data, eg.  “data:image/gif,XYZ”, where XYZ is the base64 encoded image data.

To add a new image bundle to an existing graph, the following code is used

var bundle = new mxImageBundle(alt);
bundle.putImage('myImage', 'data:image/gif,R0lGODlhEAAQAMIGAAAAAICAAICAgP' +
  '//AOzp2O3r2////////yH+FUNyZWF0ZWQgd2l0aCBUaGUgR0lNUAAh+QQBCgAHACwAAAAA' +
  'EAAQAAADTXi63AowynnAMDfjPUDlnAAJhmeBFxAEloliKltWmiYCQvfVr6lBPB1ggxN1hi' +
  'laSSASFQpIV5HJBDyHpqK2ejVRm2AAgZCdmCGO9CIBADs=', fallback);
bundle.putImage('mySvgImage', 'data:image/svg+xml,' + encodeURIComponent(
  '<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">' +
  '<linearGradient id="gradient"><stop offset="10%" stop-color="#F00"/>' +
  '<stop offset="90%" stop-color="#fcc"/></linearGradient>' +
  '<rect fill="url(#gradient)" width="100%" height="100%"/></svg>'), fallback);
graph.addImageBundle(bundle);
(end);

Alt is an optional boolean (default is false) that specifies if the value
or the fallback should be returned in <getImage>.

The image can then be referenced in any cell style using image=myImage.
If you are using mxOutline, you should use the same image bundles in the
graph that renders the outline.

The keys for images are resolved in <mxGraph.postProcessCellStyle> and
turned into a data URI if the returned value has a short data URI format
as specified above.

A typical value for the fallback is a MTHML link as defined in RFC 2557.
Note that this format requires a file to be dynamically created on the
server-side, or the page that contains the graph to be modified to contain
the resources, this can be done by adding a comment that contains the
resource in the HEAD section of the page after the title tag.

This type of fallback mechanism should be used in IE6 and IE7. IE8 does
support data URIs, but the maximum size is limited to 32 KB, which means
all data URIs should be limited to 32 KB.
Summary
mxImageBundleMaps from keys to base64 encoded images or file locations.
Variables
imagesMaps from keys to images.
altSpecifies if the fallback representation should be returned.
Functions
putImageAdds the specified entry to the map.
getImageReturns the value for the given key.

Variables

images

mxImageBundle.prototype.images

Maps from keys to images.

alt

Specifies if the fallback representation should be returned.

Functions

putImage

mxImageBundle.prototype.putImage = function(key,
value,
fallback)

Adds the specified entry to the map.  The entry is an object with a value and fallback property as specified in the arguments.

getImage

mxImageBundle.prototype.getImage = function(key)

Returns the value for the given key.  This returns the value or fallback, depending on alt.  The fallback is returned if alt is true, the value is returned otherwise.

mxImageBundle.prototype.images
Maps from keys to images.
mxImageBundle.prototype.putImage = function(key,
value,
fallback)
Adds the specified entry to the map.
mxImageBundle.prototype.getImage = function(key)
Returns the value for the given key.
Specifies if the fallback representation should be returned.
Close