Adding custom icons to the graphing tool graphs

The graphing tool includes standard icons that represent the different types of attributes displayed on the graphs. You can change the default icon for one or more attributes or add icons for custom attributes configured in your product. All graphing tool graphs use the same set of image icons on the product application server, so when you customize the attribute icon set, each user views the same attribute icons.

Before you begin

Graph icons start as scalable vector graphic (SVG) files. SVG files can be created using a variety of vector-based drawing tools, or they can be downloaded from various internet sources. It is strongly recommended that the SVG files used for icons be kept to a reasonably small size (to improve readability when the image is scaled).

The graph requires a shape definition stored in Javascript Object Notation (JSON) format. To convert from SVG to JSON requires the use of two separate command utilities: xlstproc and sed.

If you are on a Unix-based computer, you may have these tools already. If you are on a Windows based computer, you’ll have to acquire these Unix-based tools through the use of a Unix emulator (like the free Cygwin application). Note: if you use Cygwin, be sure to include the libxml2 and libxslt libraries in your installation to obtain the required utilities.

Finally, you’ll need the file svg2gfx.xsl from the free DOJO library (available at https://dojotoolkit.org/download). Once DOJO has been downloaded, the svg2gfx.xsl file can be located in the <install root>/dojox/gfx/resources directory.

Procedure

  1. Copy the svg2gfx.xsl file from the DOJO location to the same directory containing the SVG file(s) you want to convert
  2. Open a Unix terminal/command-line window and navigate to the directory containing the SVG file(s)
  3. Run the following command: xsltproc ./svg2gfx.xsl <your .SVG file> > <temp_file_name>.json
  4. Run the following command: sed -e 's/,}/}/g' -e 's/,]/]/g' <temp_file_name.json> > <final name>.json
  5. Locate your Identity Insight installation folder
  6. Under the installation folder, navigate to /ibm-home/graphs
  7. Create a folder named (case-sensitive): customImages
  8. Move the custom icon (.json file) to the customImages folder

Example

If you created an attribute type named FLIGHT and you wanted a custom graph icon to represent that attribute type on the graphing tool graphs, take the following steps:
  1. Create or obtain a suitable image file to represent the FLIGHT attribute type. Make sure that the image file name matches the attribute type name configured in the Configuration Console and uses all lowercase letters, such as this file name: flight.svg
  2. Make sure svg2gfx.xsl is located in the same directory as flight.svg
  3. Open a Unix terminal/command-line window, and navigate to the same directory as flight.svg
  4. Run the following command: xsltproc ./svg2gfx.xsl flight.svg > flight_tmp.json
  5. Run the following command: sed -e 's/,}/}/g' -e 's/,]/]/g' flight_tmp.json > flight.json
  6. Copy the flight.json icon file into the /customImages folder.
Parent topic: Common administrative tasks for the graphing tool