Customizing network element types from SVG graphics

How to create a new type of network element from an SVG file (using the API)

JViews TGO provides a base renderer factory class, IltNESVGBaseRendererFactory, that simply requires an SVG input file. When using SVG input files, all the possible representations of a network element (according to the state) are mapped to the same SVG graphic.

To create a new type of network element using SVG:

Create a new type of network element with the following code:

IltNetworkElement.Type myNewType = new 
IltNetworkElement.Type(YOUR_NEW_TYPE_NAME);

Create the SVG file corresponding to the network element representation and instantiate an IltNESVGBaseRendererFactory using this file:
```
URL url = new URL("file","",YOUR_SVG_FILE_NAME);
IltNESVGBaseRendererFactory factory = new IltNESVGBaseRendererFactory(url); 
```

Map the factory with the new type using SetValue:

IltSettings.SetValue("NetworkElement.Type.YOUR_NEW_TYPE_NAME.Renderer" , 
factory );

How to create a new type of network element from an SVG file (using CSS)

You can create new network element types by using global CSS settings.

setting."ilog.tgo.model.IltNetworkElement"{
  types[0]: @+neType0;
}
Subobject#neType0 {
  class: 'ilog.tgo.model.IltNetworkElement.Type'; 
  name: "YOUR_NEW_TYPE_NAME";
}

For more information, see Using global settings.

How to customize a renderer for a network element type (using CSS)

You can customize the renderer for the network element type using global CSS settings. To do so, you need to specify the full path to the object to be customized, as well as the value of its name attribute in order to match the right type of object in the system. The CSS property to customize here is renderer . In the example below, the name of the renderer factory class that is included in the search path is MyNESVGRendererFactory .

setting."ilog.tgo.model.IltNetworkElement.Type"[name=YOUR_NEW_TYPE_NAME] { 
   renderer: @+neSVGRendererFactory0;
}
Subobject#neSVGRendererFactory0 {
   class: 'MyNESVGRendererFactory';
}