skip to main content
TGO > Programmers documentation > Styling > Using Cascading Style Sheets > Customizing link label layout
 
Customizing link label layout
For details about label layout, refer to Label layout.
The customization of link label layout is based on the following CSS properties, valid for IltLink, IltLinkBundle and IltLinearGroup.
CSS properties for link label layout 
Property Name
Type
Default Value
Description
linkLabelMinPercentageFromStart
float
0
Defines the start point of the area of the polyline that should be used for the label when a label layout is performed. This start point is expressed as a percentage of the length of the polyline.
linkLabelMaxPercentageFromStart
float
100
Defines the end point of the area of the polyline that should be used for the label when a label layout is performed. This end point is expressed as a percentage of the length of the polyline.
linkLabelMaxDistFromPath
float
10
Defines the maximum distance allowed between the label and the path when a label layout is performed.
linkLabelPreferredDistFromPath
float
0
Defines the preferred distance between the label and the path when a label layout is performed.
linkLabelPreferredSide
IlvDirection
Bottom
Defines the preferred side where the label should be placed when a label layout is performed. The meaning of this property depends on property linkLabelSideAssociation.
If the side association is LOCAL, the following options can be used to specify the allowed and preferred sides:
Left : left side in polyline flow direction
Right : right side in polyline flow direction
If the side association is GLOBAL, the following options can be used to specify the allowed and preferred sides:
Left : left side.
Right : right side
Top : top side
Bottom : bottom side
TopLeft : top side or left side
TopRight : top side or right side
BottomLeft : bottom side or left side
BottomRight : bottom side or right side
linkLabelAllowedSide
integer
0
Defines the sides that are allowed for the label placement when a label layout is performed. The value can be 0, if all sides are allowed. The meaning of this property depends on the property linkLabelSideAssociation.
If the side association is LOCAL, the following options can be used to specify the allowed and preferred sides:
Left : left side in polyline flow direction
Right : right side in polyline flow direction
If the side association is GLOBAL, the following options can be used to specify the allowed and preferred sides:
Left : left side.
Right : right side
Top : top side
Bottom : bottom side
TopLeft : top side or left side
TopRight : top side or right side
BottomLeft : bottom side or left side
BottomRight : bottom side or right side
linkLabelSideAssociation
IlvAnnealingPolylineLabelDescriptor
GLOBAL
Defines an association between the preferred and the allowed side for the label when a label layout is performed.
Valid options for the side association are:
LOCAL
GLOBAL
linkLabelTopOverlap
float
0
Defines the number of pixels the top side of the label can overlap the related obstacle when a label layout is performed.
linkLabelBottomOverlap
float
0
Defines the number of pixels the bottom side of the label can overlap the related obstacle when a label layout is performed.
linkLabelLeftOverlap
float
0
Defines the number of pixels the left side of the label can overlap the related obstacle when a label layout is performed.
linkLabelRightOverlap
float
0
Defines the number of pixels the right side of the label can overlap the related obstacle when a label layout is performed.
How to customize link label layout
The following CSS extract illustrates how you can configure your link objects to customize the behavior of the label layout associated with a network or equipment component.
It is provided as part of the JViews TGO demonstration software at <installdir> /samples/network/labelLayout/data/network.css.
 
object {
  linkLabelMinPercentageFromStart: 40;
  linkLabelMaxPercentageFromStart: 60;
  linkLabelMaxDistFromPath: 5;
  linkLabelPreferredDistFromPath: 5;
  linkLabelSideAssociation : 1;
  linkLabelPreferredSide: Bottom;
  linkLabelAllowedSide: Bottom;
  linkLabelTopOverlap: 0;
  linkLabelBottomOverlap: 0;
  linkLabelLeftOverlap: 0;
  linkLabelRightOverlap: 0;
}

Copyright © 2018, Rogue Wave Software, Inc. All Rights Reserved.