Customizing Network Element Types From SVG Graphics

Styling > Customizing Network Elements > Customizing Network Element Types > Customizing Network Element Types From SVG Graphics

Customizing Network Element Types From SVG Graphics

INDEX

PREVIOUS NEXT

This section describes how to define new network element types with new representations without extending an existing base renderer class, by using SVG graphics.

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.

How to Create a New Type of Network Element from an SVG file (using the API)

To create a new type of network element using SVG, do the following:

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 IltSettings.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 also create new network element types by using global CSS settings (see Using Global Settings in Chapter 2, Using Cascading Style Sheets for more information):

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

Likewise, you can customize the renderer 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';
}

PREVIOUS NEXT