Add a Street View Panorama to Banter

BanterStreetView displays a Google Street View panorama. The documented component accepts the panorama's panoId.

Street View Workflow

Create a positioned GameObject and add BanterStreetView with the exact panorama ID.

  1. Obtain the intended Street View panorama ID.
  2. Create the panorama GameObject at the experience location.
  3. Add BanterStreetView with that ID.

Create the Panorama Object

const panoramaObject = new BS.GameObject({
  name: "StreetViewPanorama",
  localPosition: new BS.Vector3(0, 0, 5)
});

Keep the panorama on its own GameObject so its transform and component are easy to find.

Add BanterStreetView

panoramaObject.AddComponent(
  new BS.BanterStreetView({
    panoId: "CAoSLEFGM..."
  })
);

Replace the example value with the complete Street View panorama ID for the intended location.

Add a Location Label

Create a separate GameObject for readable 3D text:

const labelObject = new BS.GameObject({
  name: "PanoramaLabel",
  localPosition: new BS.Vector3(0, 2.2, 3)
});

labelObject.AddComponent(
  new BS.BanterText({
    text: "Street View Location",
    color: new BS.Vector4(1, 1, 1, 1),
    fontSize: 2,
    horizontalAlignment:
      BS.HorizontalAlignment.Center,
    verticalAlignment:
      BS.VerticalAlignment.Middle,
    richText: true,
    enableWordWrapping: true,
    rectTransformSizeDelta:
      new BS.Vector2(10, 2)
  })
);

BanterText supports RGBA colour, font size, horizontal and vertical alignment, rich text, word wrapping, and a text-box size.

Organize Multiple Panoramas

Give each panorama a distinct GameObject name and panorama ID:

const galleryPanorama = new BS.GameObject({
  name: "GalleryStreetView"
});

galleryPanorama.AddComponent(
  new BS.BanterStreetView({
    panoId: "PANORAMA_ID"
  })
);

Use descriptive names so scene code can distinguish multiple panorama objects.

Common Questions

Why does my Banter Street View show the wrong location?

Check the complete value passed to panoId. The documented component selects the panorama by that ID.

Can I pass a normal map URL to BanterStreetView?

The current official component reference documents a Street View panorama ID through panoId; it does not document a regular map-page URL property.

Official References

Related Navigation