street-label cleanup

fix binding

I have to keep this in or it raises an error `Cannot read properties of undefined (reading 'width')`. My guess is there is a race condition such that when the scene is loaded the dom attribute is added but the a-frame component hasn't been initialized thus the segment is returned as matching the querySelector but not from a-frame getattribute? I changed the logic a bit to check if the street-segment component exist and to also return if no width for a segment:
```
      const segmentWidth = segmentEl.getAttribute('street-segment')?.width;
      if (!segmentWidth) return;
```

src/components/street-label.js

@@ -20,14 +20,10 @@ AFRAME.registerComponent('street-label', {
     // Create and setup canvas
     this.createAndSetupCanvas();
 
-    // Listen for segment changes
-    this.el.addEventListener('segments-changed', this.updateLabels.bind(this));
-
-    // Listen for alignment changes
-    this.el.addEventListener('alignment-changed', this.updateLabels.bind(this));
-
-    // Initial update
-    this.updateLabels();
+    // Listen for segment & alignment changes
+    this.updateLabels = this.updateLabels.bind(this);
+    this.el.addEventListener('segments-changed', this.updateLabels);
+    this.el.addEventListener('alignment-changed', this.updateLabels);
 
     // Handle loading from saved scene
     setTimeout(() => {
@@ -64,9 +60,9 @@ AFRAME.registerComponent('street-label', {
     const labelsArray = [];
 
     segments.forEach((segmentEl) => {
-      if (!segmentEl.getAttribute('street-segment')) return;
+      const segmentWidth = segmentEl.getAttribute('street-segment')?.width;
+      if (!segmentWidth) return;
 
-      const segmentWidth = segmentEl.getAttribute('street-segment').width;
       widthsArray.push(segmentWidth);
       labelsArray.push(segmentEl.getAttribute('data-layer-name') || '');
     });