Page tree

Versions Compared


  • This line was added.
  • This line was removed.
  • Formatting was changed.


The following diagram illustrates an example hierarchy:

Note that the "root" (default) layout does not have a backing region. Any devices (and their attached hosts) that have not been assigned to a region will appear in the topology view at this the top level.

Layouts can be configured using a number of CLI commands:


Code Block
layout-add root @europe . . 4.66 -2562.93 -412.56
layout-add lUK @europe rUK root 11.63 -6652.54 -938.04
layout-add lIT @europe rIT root 7.15 -4818.73 -1330.36
layout-add lFR @europe rFR root 8.98 -5378.99 -1334.77

layout-add lMilan +segmentRouting rMilan lIT 0.86 68.58 54.71

Note the use of the dot (".") character in the definition of the root layout, as placeholders for the (non-existent) region-id and parent-layout-id.

Notes on <bg-ref>:

The <bg-ref> parameter should take the form:


Additional maps can be registered from an application's server-side UiExtension implementation.   (link to tutorial needed)

Sprite identifiers can be listed by opening the web console, making sure verbose option is selected, and filtering for the string "createLayout":


Additional sprite layouts can be registered from an application's topology overlay JavaScript code. (need link to tutorial on building a custom topo2 overlayneeded)


Notes on <scale>on <scale>, <offset-x>, <offset-y> values:

Currently, getting these values right is a manual process:

    • start by setting them to  1.0  0.0  0.0
    • enable debugging of UiWebSocket to see message transmissions between client and server
      • onos> log:set DEBUG org.onosproject.ui.impl.UiWebSocket
    • in the UI, pan and zoom the map to the desired location
    • in the log, identify the last UiWebSocket RX message for "updateMeta2"
      • 2017-05-26 17:07:15,750 | DEBUG | tp1445302012-173 | UiWebSocket                      
      • | 158 - org.onosproject.onos-gui - 1.11.0.SNAPSHOT | RX message: 
      • {"event":"updateMeta2","payload":{"id":"layoutZoom",
      • "memento":{"scale":4.66,"offsetX":-2560.646888427734,"offsetY":-409.13537841796875}}}
    • use the values listed in the "memento" field for your scripted command (you should be safe rounding to 4 decimal places)


However, by pressing the 'R' key, the map/grid view will reset to the <scale/offset> values configured in the layout-add command.


The layouts currently configured in the system can be listed with the layouts command:

Code Block
onos> layoutsid=lDE, bgref=@europe, region=rDE, parent=root
id=lES, bgref=@europe, region=rES, parent=root
id=lFR, bgref=@europe, region=rFR, parent=root
id=lIT, bgref=@europe, region=rIT, parent=root
id=lMilan, bgref=+segmentRoutingTwo, region=rMilan, parent=lIT
id=lUK, bgref=@europe, region=rUK, parent=root
id=root, bgref=@europe, region=(root), parent=root