Resource Keys

Some classes in yFiles for HTML define static "KEY" properties of type string. Those constants are keys for the global client property map of HTML5 components and change certain aspects of a yFiles for HTML application.

For example, you can change the color of snap lines by simply setting a Stroke using the SNAP_LINE_STROKE_KEY resource key into the resource map of the GraphComponent like shown below:

graphComponent.resources.set(SnapLine.SNAP_LINE_STROKE_KEY, Stroke.BLUE)

Customizing String Resources

Common string resources like command names, keyboard shortcuts, undo unit names and UI labels can be customized. The key and value pairs are stored globally in the variable yfiles.resources.

The resources are sub-divided into UI cultures. For example, resources for the American English language should be stored in yfiles.resources["en-US"]. By default, all resources are stored in yfiles.resources["invariant"]. This is also the fallback for all cultures, if a certain key is not found.

In order to customize resources, create a variable with the name of the key and the desired value in the respective resource object. If the resource object is not initialized, yet, create it first. Initialization of the yFiles for HTML resources is non-destructive, i.e. custom values stored in yfiles.resources before initializing the yfiles library are not overwritten by defaults. For example, you can customize the key gesture for node grouping by changing the value of the resource key "GroupSelectionKey".

yfiles.resources["invariant"]["GroupSelectionKey"] = "Shift+G";

The customization of a resource has to be done before the commands are initialized, e.g. before the GraphComponent is instantiated.

Resources Defaults

The following table lists the resources defaults stored in yfiles.resources["invariant"] alphabetically.