Release Notes > JTGO 4.0 Release Notes > New Features > Network Component

The network component has been improved in the following way:

Load on Demand

The network component now supports load on demand. A new expansion strategy, named IN_PLACE_MINIMAL_LOADING, is available for business objects displayed in a network component. This expansion strategy can be defined through CSS in the following way:

object {
  expansion: IN_PLACE_MINIMAL_LOADING;
}

At initialization, the network component loads all the root objects and their child objects. The next levels will be loaded on demand, as the objects are expanded.

It is now possible to define new expansion strategies in the network component. Expansion strategies are created by an expansion strategy factory registered in the network adapter. The network component provides a default expansion strategy factory that creates expansion strategies according to the value of the CSS expansion property (NO_EXPANSION, IN_PLACE or IN_PLACE_MINIMAL_LOADING). If you wish to define a new load-on-demand implementation, you need to:

  1. Create a new expansion strategy implementation (see ilog.cpl.util.IlpExpansionStrategy).
  2. Create a new expansion strategy factory implementation (see ilog.cpl.graph.IlpDefaultNodeExpansionStrategyFactory).
  3. Register this factory in the adapter (see ilog.cpl.datasource.IlpAbstractHierarchyAdapter.setExpansionStrategyFactory).

The expansion strategy implementation should load or release the objects in the network adapter using the methods loadChildren and releaseChildren.

Configuration

It is now possible to customize the background color and background pattern used in the network view. These properties are customized in the background renderer, as follows:

Backgrounds {
  backgroundColor: white;
  backgroundPattern: "icon.png";
}

It is now possible to customize the zoom factor applied by the Zoom In and Zoom Out actions through CSS files, as follows:

#ZoomInButton {
  actionType: "ZoomIn";
  zoomFactor: 1.1;
}
 
#ZoomOutButton {
  actionType: "ZoomOut";
  zoomFactor: 1.1;
}

It is now also possible to customize the attribute of the Edit Label interactor through CSS files, as follows:

#EditLabelButton {
  actionType: "EditLabel";
  labelAttribute: "name";
}

Both the network and the equipment view configurations accept the following properties:

Network {
  view: true;
}
View {
  keepingAspectRatio: true;
}
Network {
  view: true;
}
View {
  maxZoomXFactor: 10;
  maxZoomYFactor: 10;
}

You can now customize the visibility threshold for the different object decorations in the network and equipment view configurations. This new option is part of the zooming configuration and is supported by the Physical and Mixed Zoom policies available in JTGO. These two zoom policies now provide the properties decorationNames and visibilityThresholds that you can customize through CSS and use to associate visibility thresholds with the decorations that are automatically created for the predefined business objects.

To customize the visibility threshold, first define which decorations are to change and list them using the property decorationNames. The list of supported decoration names is available in ilog.tgo.graphic.IltGraphicElementName. Once the decoration names are listed, you should define the visibility threshold for each one using property visibilityThresholds. Note that the association between decoration name and visibility threshold is accomplished by the index set in the CSS file. If the visibility threshold is incorrectly defined or is not defined in the CSS file, the global values set using IltrZoom.SetVisibilityThreshold are used instead. The following example illustrates this kind of customization:

Network {
  zooming: true;
}
Zooming {
  type: "Mixed";
  decorationNames[0]: Name;
  decorationNames[1]: AlarmBalloon;
  decorationNames[2]: SecondaryStateModifiers;
  decorationNames[3]: Plinth;
  decorationNames[4]: InformationIcon;
  decorationNames[5]: InformationWindow;
  visibilityThresholds[0]: 0.9;
  visibilityThresholds[1]: 0.8;
  visibilityThresholds[2]: 0.7;
  visibilityThresholds[3]: 0.6;
  visibilityThresholds[4]: 0.5;
  visibilityThresholds[5]: 0.4;
}