Salta ai contenuti

Simulare un file OpenSCENARIO nel browser: carica un .xosc e mandalo in esecuzione

drawtonomy è una lavagna digitale gratuita per scenari di guida, accessibile dal browser. La stessa tela è anche un simulatore OpenSCENARIO gratuito e basato su browser: trascina un .xosc con il suo .xodr e drawtonomy simula lo storyboard direttamente nel browser — con scorrimento della timeline, avanzamento fotogramma per fotogramma, scie fantasma, una camera Follow Ego che segue il veicolo ego ed esportazione in .webm con un clic.

Sotto il cofano, il simulatore nel browser è costruito sopra esmini compilato in WebAssembly — il runtime open source di riferimento per OpenSCENARIO 1.x, sviluppato dalla comunità ADAS svedese. Lo stesso motore di simulazione che gira su una CLI Linux funziona dentro la pagina web: identica semantica dello storyboard (atti, sequenze, manovre, trigger), stesso parser, stesso stato dei veicoli. Tutto il merito della correttezza del runtime va al progetto esmini; drawtonomy è solo il guscio browser che lo racchiude. Nessuna installazione, nessun MATLAB, nessuna compilazione C++, nessun account.

Carica un .xosc di cut-in ACC, simulalo nel browser via esmini-WASM, scorri la timeline e registra la corsa come .webm.

Ci sono due modi per portare una coppia .xosc + .xodr sulla tela:

  1. Trascina e rilascia entrambi i file insieme sulla tela. drawtonomy rileva la coppia e mostra il banner xosc-picker se sono presenti più scenari.
  2. Menu hamburger → Import → OpenSCENARIO, poi seleziona il .xosc (e il .xodr corrispondente se non si trova nella stessa cartella).

drawtonomy analizza la rete stradale OpenDRIVE, passa il .xosc al runtime esmini-WASM incorporato e sostituisce la barra degli strumenti in fondo allo schermo con il PlaybackControl.

Se non hai a portata di mano un .xosc, il progetto esmini distribuisce un piccolo catalogo di scenari di test. Trascina una delle coppie .xosc + .xodr da esmini/resources/xosc/ per provare subito il simulatore.

Il PlaybackControl si aggancia in fondo alla tela durante una simulazione. I controlli principali:

AzioneCome
Simula / PausaSpazio, oppure il pulsante ▶ / ❚❚
Scorri la timelineTrascina il cursore della timeline
Fotogramma indietro / avanti /
Vai a un istante precisoClicca sull’indicatore del tempo e digita un valore

Lo scorrimento è esatto — la posa di ogni entità proviene direttamente dalla simulazione, quindi qualsiasi fotogramma selezioni ha uno stato ben definito. È proprio questo che rende il simulatore nel browser utile come strumento di revisione: metti in pausa esattamente sul fotogramma in cui avviene il cut-in e osserva la geometria, invece di indovinare mentre la simulazione continua a scorrere.

Clicca sul chip della velocità nel PlaybackControl per aprire il popover dedicato. Scegli un preset (0,25×, 0,5×, 1×, 2×, 4×) oppure trascina lo slider per un valore personalizzato. La velocità preferita viene mantenuta tra una sessione e l’altra.

Rallentare la simulazione è il modo più semplice per esaminare un’interazione ravvicinata fotogramma per fotogramma; accelerarla è il modo più veloce per scorrere uno scenario lungo prima di decidere dove fermarti.

Di default la camera inquadra l’intera scena. Attiva Follow Ego e la tela si sposterà insieme al veicolo ego, mantenendolo centrato nella vista per tutta la durata dello scenario.

Questo conta per gli scenari in cui l’azione si muove insieme all’ego — un cut-in in autostrada, un cambio corsia, una lunga corsa ACC su una strada curva — dove una camera a inquadratura fissa finirebbe per allontanarsi così tanto da rendere invisibile l’interazione, oppure per tagliare l’ego fuori dal bordo della vista.

Attiva i Ghost per mostrare la traiettoria simulata di ogni entità direttamente sulla tela:

  • Path ghost — una sottile polilinea che indica dove è passata l’entità.
  • Footprint ghost — la sagoma dell’entità campionata a intervalli di tempo fissi. Utile per individuare a colpo d’occhio accelerazioni e decelerazioni.

L’intervallo è configurabile (per esempio ogni 0,5 s / 1 s / 2 s). I Ghost vengono anche incorporati nelle esportazioni immagine e SVG, così la figura che salvi per una slide o un articolo mostra la traiettoria intera, non solo il fotogramma corrente.

Per un approfondimento su come funzionano i Ghost in fase di creazione degli scenari, vedi Path e Footprint; nel simulatore browser visualizzano invece la corsa simulata.

Se modifichi lo scenario dopo l’importazione — spostando un’entità, cambiando un Path, sostituendo un veicolo — il simulatore nel browser segna come stale (non aggiornate) le traiettorie interessate. Clicca sul pulsante Re-simulate per rieseguire lo storyboard attraverso il runtime esmini-WASM incorporato e aggiornare la traiettoria in cache. La simulazione riflette sempre lo scenario attuale, mai un’istantanea superata.

Clicca su Export nel PlaybackControl per registrare la simulazione come video .webm.

Il popover di esportazione mette a disposizione due parametri:

  • Rapporto d’aspetto — Free (aderente alla bounding box), 16:9 (orizzontale, YouTube), 9:16 (verticale, Reels / TikTok / Shorts), 1:1 o 4:3. I rapporti diversi da Free aggiungono un margine con il colore di sfondo per raggiungere la forma scelta, così uno scenario lungo e stretto (per esempio una corsia sola) non diventa una striscia illeggibile.
  • Modalità cameraBbox (intera scena) oppure Follow Ego (la vista segue l’ego, con un raggio preimpostato di 30 / 50 / 100 m).

Puoi anche registrare solo una parte della corsa invece che l’intera simulazione: imposta RANGE su Trim e trascina le due maniglie che compaiono sulla barra di scorrimento — vedi Registrare solo una parte della corsa.

Durante la registrazione, la tela mostra una sovrapposizione di avanzamento Export video con un pulsante Cancel. L’esportazione usa MediaRecorder direttamente nel tuo browser, quindi tutto resta locale — nessun upload verso un server, nessun account necessario.

Questo rende il simulatore nel browser un comodo registratore di demo per il lavoro su OpenSCENARIO: carica un .xosc prodotto dalla CI, clicca Export e in pochi secondi hai un .webm condivisibile del caso di fallimento.

Confronto con l’esecuzione di esmini da riga di comando

Sezione intitolata “Confronto con l’esecuzione di esmini da riga di comando”

Il simulatore browser di drawtonomy e un’installazione nativa di esmini condividono lo stesso motore di simulazioneesmini stesso. Ciò che cambia è il guscio attorno a esso:

  • drawtonomy esegue esmini nel tuo browser (WebAssembly), con un’interfaccia nativa della tela: cursore della timeline, Follow Ego, scie fantasma, esportazione .webm, condivisione tramite sorgente .drawtonomy.svg.
  • esmini CLI esegue esmini nativamente, con un viewer 3D OpenSceneGraph, una modalità headless per CI, oltre ad API C++ / Python per l’embedding.

Se ti serve la semantica completa dello storyboard su una macchina CI, in un notebook Python o con il viewer 3D nativo, esegui esmini direttamente. Se invece vuoi simulare subito lo scenario in un browser — per triage, code review, didattica o una demo .webm veloce — Scenario Play è la via più rapida.

L’esportazione del bundle OpenSCENARIO fornisce la stessa coppia .xosc + .xodr alla tua installazione locale di esmini, così i due flussi si incastrano end-to-end.