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.
Caricare un file OpenSCENARIO
Sezione intitolata “Caricare un file OpenSCENARIO”Ci sono due modi per portare una coppia .xosc + .xodr sulla tela:
- Trascina e rilascia entrambi i file insieme sulla tela. drawtonomy rileva la coppia e mostra il banner xosc-picker se sono presenti più scenari.
- Menu hamburger → Import → OpenSCENARIO, poi seleziona il
.xosc(e il.xodrcorrispondente 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.
Simulare, mettere in pausa e scorrere la timeline
Sezione intitolata “Simulare, mettere in pausa e scorrere la timeline”Il PlaybackControl si aggancia in fondo alla tela durante una simulazione. I controlli principali:
| Azione | Come |
|---|---|
| Simula / Pausa | Spazio, oppure il pulsante ▶ / ❚❚ |
| Scorri la timeline | Trascina il cursore della timeline |
| Fotogramma indietro / avanti | ← / → |
| Vai a un istante preciso | Clicca 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.
Regolare la velocità di simulazione
Sezione intitolata “Regolare la velocità di simulazione”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.
Follow Ego: la camera segue il veicolo ego
Sezione intitolata “Follow Ego: la camera segue il veicolo ego”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.
Scie fantasma: Path e Footprint
Sezione intitolata “Scie fantasma: Path e Footprint”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.
Ri-simulare dopo una modifica
Sezione intitolata “Ri-simulare dopo una modifica”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.
Esportare la simulazione come .webm
Sezione intitolata “Esportare la simulazione come .webm”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à camera — Bbox (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 simulazione — esmini 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.
Vedi anche
Sezione intitolata “Vedi anche”- Scenario editor — per creare scenari, non solo riprodurli.
- Aprire e riprodurre un .xosc esistente
— il lato caricamento nel dettaglio: coppie di file, la route
?open=di GitHub e l’avviso sui catalog. - Playback — la barra di trasporto dentro l’editor di scenari.
- Caso d’uso: simulatore OpenSCENARIO
- Esportare il bundle OpenDRIVE + OpenSCENARIO pronto per esmini
- Cos’è OpenSCENARIO?
- Cos’è esmini?
- Path e Footprint
- drawtonomy vs esmini
- drawtonomy vs CARLA