diff --git a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/topology.service.ts b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/topology.service.ts
index 304be9e..f2a1f60 100644
--- a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/topology.service.ts
+++ b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/topology.service.ts
@@ -17,7 +17,7 @@
 import {
     LogService, WebSocketService,
 } from 'gui2-fw-lib';
-import { InstanceComponent } from './panel/instance/instance.component';
+import {Instance, InstanceComponent} from './panel/instance/instance.component';
 import { BackgroundSvgComponent } from './layer/backgroundsvg/backgroundsvg.component';
 import { ForceSvgComponent } from './layer/forcesvg/forcesvg.component';
 import {
@@ -34,11 +34,13 @@
 
     private handlers: string[] = [];
     private openListener: any;
+    public instancesIndex: Map<string, number>;
 
     constructor(
         protected log: LogService,
         protected wss: WebSocketService
     ) {
+        this.instancesIndex = new Map();
         this.log.debug('TopologyService constructed');
     }
 
@@ -50,7 +52,14 @@
         this.wss.bindHandlers(new Map<string, (data) => void>([
             ['topo2AllInstances', (data) => {
                     this.log.debug('Instances updated through WSS as topo2AllInstances', data);
-                    instance.onosInstances = data.members;
+                    instance.ngOnChanges(
+                        {'onosInstances': new SimpleChange({}, data.members, true)});
+
+                    // Also generate an index locally of the instances
+                    // needed so that devices can be coloured by instance
+                    this.instancesIndex.clear();
+                    (<Instance[]>data.members).forEach((inst, idx) => this.instancesIndex.set(inst.id, idx));
+                    this.log.debug('Created local index of instances', this.instancesIndex);
                 }
             ],
             ['topo2CurrentLayout', (data) => {