Play a 360 Result

Search → interactive → SDK.

Play a 360 Result

The end-to-end flow from search to immersive playback in ~20 lines:

JavaScript
// 1. Search
const stream = await fetch("https://api.outerview.ai/v1/stream", {
  method: "POST",
  headers: { "Content-Type": "application/json", Authorization: `Bearer ${key}` },
  body: JSON.stringify({ query: "potholes", region_id: "4915" }),
}).then((r) => r.json());

// 2. Pick an interactive result
const result = stream.data.geojson.features.find((feature) => feature.properties.interactive) ?? stream.data.geojson.features[0];

// 3. Play it
const player = create360Player({
  container: "#viewer",
  videoUrl: result.properties.video_url, // 360 equirectangular capture
  autoplay: true,
  muted: true,
  loop: true,
});

// 4. Sequence the next interactive result when playback ends
player.on("ended", () => {
  const next = stream.data.geojson.features.find((feature) => feature.properties.interactive && feature.id !== result.id);
  if (next) player.load(next.properties.video_url);
});

Non-interactive results render as flat video automatically — no special handling needed. See Controls for seek/lookAt and Events for the full lifecycle.