{"record":{"id":"6081f6c1108f6601","repo":"angular/components","slug":"cannot-interact-with-a-google-map-traffic-layer-be","errorCode":null,"errorMessage":"Cannot interact with a Google Map Traffic Layer before it has been initialized. Please wait for the Traffic Layer to load before trying to interact with it.","messagePattern":"Cannot interact with a Google Map Traffic Layer before it has been initialized\\. Please wait for the Traffic Layer to load before trying to interact with it\\.","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"error","filePath":"src/google-maps/map-traffic-layer/map-traffic-layer.ts","lineNumber":118,"sourceCode":"      map(autoRefresh => {\n        const combinedOptions: google.maps.TrafficLayerOptions = {autoRefresh};\n        return combinedOptions;\n      }),\n    );\n  }\n\n  private _watchForAutoRefreshChanges() {\n    this._combineOptions()\n      .pipe(takeUntil(this._destroyed))\n      .subscribe(options => {\n        this._assertInitialized();\n        this.trafficLayer.setOptions(options);\n      });\n  }\n\n  private _assertInitialized(): asserts this is {trafficLayer: google.maps.TrafficLayer} {\n    if (!this.trafficLayer) {\n      throw Error(\n        'Cannot interact with a Google Map Traffic Layer before it has been initialized. ' +\n          'Please wait for the Traffic Layer to load before trying to interact with it.',\n      );\n    }\n  }\n}\n","sourceCodeStart":100,"sourceCodeEnd":125,"githubUrl":"https://github.com/angular/components/blob/0411926e7d8ae06b32236ec1048a888cfad5abf2/src/google-maps/map-traffic-layer/map-traffic-layer.ts#L100-L125","documentation":"MapTrafficLayer throws this from _assertInitialized when code touches the layer before the internal google.maps.TrafficLayer instance has been created. The instance is created asynchronously once the Maps JS API resolves. Unlike some sibling components this guard is not wrapped in an ngDevMode check, so it throws in production too.","triggerScenarios":"Calling setOptions/autoRefresh-related public methods or _initialize/_watchForAutoRefreshChanges paths before this.trafficLayer is assigned — typically calling a method on the MapTrafficLayer directive immediately after construction or before the Maps API finishes loading.","commonSituations":"Toggling traffic layer options during initial page load before mapReady; the Maps script failing to load (bad key, network block) so the layer is never created; calling via template ref in ngOnInit.","solutions":["Defer interaction until the Maps API has loaded — use the map's mapReady output or the GoogleMapsModule's loaded promise pattern.","Check that the Maps loader succeeded (API key valid, script not blocked); a failed load leaves trafficLayer undefined forever.","Move option-setting code into a callback that runs after map initialization instead of ngOnInit.","Guard calls: only invoke when the layer reports it is initialized."],"exampleFix":"// before\nngOnInit() {\n  this.trafficLayer.setOptions({}); // throws before load\n}\n// after\nthis.map.mapReady.subscribe(() => {\n  this.trafficLayer.setOptions({});\n});","handlingStrategy":"type-guard","validationCode":"if (layer && (layer as any).trafficLayer) { layer.setOptions({...}); }","typeGuard":"function isTrafficLayerInitialized(l: any): l is {trafficLayer: google.maps.TrafficLayer} {\n  return !!l && !!l.trafficLayer;\n}","tryCatchPattern":"try {\n  this.trafficLayerDirective.setOptions(options);\n} catch (e) {\n  if ((e as Error).message.includes('Traffic Layer')) {\n    this.map.mapReady.pipe(take(1)).subscribe(() => this.trafficLayerDirective.setOptions(options));\n  } else { throw e; }\n}","preventionTips":["Gate all layer option changes behind the map ready event","Verify the Maps loader script resolves before rendering/interacting","Avoid setting options in ngOnInit; do it in a readiness subscription","Note this guard is not dev-mode-only — production will throw too"],"tags":["angular","google-maps","initialization","lifecycle"],"backgroundTag":"component-not-initialized","analyzedSha":"0411926e7d8ae06b32236ec1048a888cfad5abf2","analyzedAt":"2026-08-31T11:58:23.400Z","schemaVersion":2},"datasetVersion":"2026-08-31T14:17:45.589Z"}