L'attività di rilevamento di oggetti MediaPipe consente di rilevare la presenza e la posizione di e classi di oggetti. Questa attività acquisisce i dati delle immagini e genera un elenco di rilevamenti ciascuno dei quali rappresenta un oggetto identificato nell'immagine. Esempio di codice descritti in queste istruzioni sono disponibili su CodePen.
Puoi vedere questa attività in azione visualizzando la demo. Per ulteriori informazioni su funzionalità, modelli di questa attività, consulta la Panoramica.
Esempio di codice
Il codice di esempio per il rilevatore di oggetti fornisce un'implementazione completa in JavaScript come riferimento. Questo codice è utile per testare l'attività a creare la tua app di classificazione del testo. Puoi visualizzare, eseguire Modificare il codice di esempio del rilevatore di oggetti usando solo il browser web.
Configurazione
Questa sezione descrive i passaggi chiave per configurare l'ambiente di sviluppo nello specifico per l'uso di Object Detector. Per informazioni generali su configurare l'ambiente di sviluppo web e JavaScript, incluse i requisiti di versione della piattaforma, consulta Guida alla configurazione per il web.
Pacchetti JavaScript
Il codice del rilevatore di oggetti è disponibile tramite @mediapipe/tasks-vision MediaPipe
Pacchetto NPM. Puoi
trovare e scaricare queste librerie seguendo le istruzioni nella piattaforma
Guida alla configurazione.
Puoi installare i pacchetti richiesti tramite Gestione dei partner di rete utilizzando il seguente comando:
npm install @mediapipe/tasks-vision
Se vuoi importare il codice dell'attività tramite una rete CDN (Content Delivery Network)
aggiungi il seguente codice nel tag <head> del file HTML:
<!-- You can replace JSDeliver with another CDN if you prefer to -->
<head>
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js"
crossorigin="anonymous"></script>
</head>
Modello
L'attività di rilevamento di oggetti MediaPipe richiede un modello addestrato che sia compatibile con dell'attività. Per ulteriori informazioni sui modelli addestrati disponibili per il rilevatore di oggetti, consulta la panoramica delle attività nella sezione Modelli.
Seleziona e scarica un modello, quindi archivialo nella directory del progetto:
<dev-project-root>/app/shared/models/
Crea l'attività
Usa una delle funzioni ObjectDetector.createFrom...() del rilevatore di oggetti per
per preparare l'attività per l'esecuzione delle inferenze. Usa createFromModelPath()
con un percorso relativo o assoluto al file del modello addestrato.
Se il modello è già caricato in memoria, puoi utilizzare
createFromModelBuffer(). L'esempio di codice seguente mostra l'utilizzo
la funzione createFromOptions(), che ti consente di impostare
le opzioni di CPU e memoria disponibili. Per ulteriori informazioni sulle opzioni di configurazione disponibili, vedi
Opzioni di configurazione.
Il codice seguente illustra come creare e configurare questa attività:
const vision = await FilesetResolver.forVisionTasks(
// path/to/wasm/root
"https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
);
objectDetector = await ObjectDetector.createFromOptions(vision, {
baseOptions: {
modelAssetPath: `https://storage.googleapis.com/mediapipe-tasks/object_detector/efficientdet_lite0_uint8.tflite`
},
scoreThreshold: 0.5,
runningMode: runningMode
});
Per un'implementazione più completa della creazione di un'attività di rilevamento di oggetti, consulta le esempio di codice.
Opzioni di configurazione
Questa attività include le seguenti opzioni di configurazione per le applicazioni web:
| Nome opzione | Descrizione | Intervallo di valori | Valore predefinito |
|---|---|---|---|
runningMode |
Imposta la modalità di esecuzione per l'attività. Esistono due metodi
modalità: IMAGE: la modalità per gli input di immagini singole. VIDEO: La modalità per i fotogrammi decodificati di un in un video o durante un live streaming di dati di input, ad esempio da una videocamera. |
{IMAGE, VIDEO} |
IMAGE |
displayNamesLocale |
Imposta la lingua delle etichette da utilizzare per i nomi visualizzati forniti nel
metadati del modello dell'attività, se disponibili. Il valore predefinito è en per
Inglese. Puoi aggiungere etichette localizzate ai metadati di un modello personalizzato
Utilizzando l'API TensorFlow Metadata Writer
|
Codice impostazioni internazionali | it |
maxResults |
Imposta il numero massimo facoltativo di risultati del rilevamento con il punteggio più alto su per tornare indietro. | Qualsiasi numero positivo | -1 (vengono restituiti tutti i risultati) |
scoreThreshold |
Imposta la soglia del punteggio di previsione che sostituisce quella fornita in gli eventuali metadati del modello. I risultati al di sotto di questo valore vengono rifiutati. | Qualsiasi numero in virgola mobile | Non impostato |
categoryAllowlist |
Consente di impostare l'elenco facoltativo di nomi di categorie consentiti. Se il campo non è vuoto,
i risultati del rilevamento con nome categoria non incluso in questo set saranno
esclusi. I nomi di categorie duplicati o sconosciuti vengono ignorati.
Questa opzione si esclude a vicenda con categoryDenylist e utilizza
entrambi generano un errore. |
Qualsiasi stringa | Non impostato |
categoryDenylist |
Consente di impostare un elenco facoltativo di nomi di categorie non consentiti. Se
non è vuoto, i risultati del rilevamento con nome della categoria incluso in questo set verranno filtrati
fuori. I nomi di categorie duplicati o sconosciuti vengono ignorati. Questa opzione è reciproca
è esclusivo con categoryAllowlist e l'utilizzo di entrambi genera un errore. |
Qualsiasi stringa | Non impostato |
Preparazione dei dati
Il rilevatore di oggetti può rilevare oggetti nelle immagini in qualsiasi formato supportato browser host. L'attività gestisce anche la pre-elaborazione dell'input di dati, tra cui ridimensionamento, rotazione e normalizzazione dei valori. Per rilevare oggetti nei video, puoi utilizzare l'API per elaborare rapidamente un frame alla volta, utilizzando il timestamp del l'inquadratura per determinare quando vengono eseguiti i gesti nel video.
Esegui l'attività
Il rilevatore di oggetti utilizza detect() per lavorare su immagini singole e
detectForVideo() sta rilevando oggetti nei fotogrammi video. L'attività elabora
i dati, cerca di riconoscere gli oggetti e poi segnala i risultati.
Chiamate all'esecuzione dei metodi detect() e detectForVideo()
in modo sincrono e bloccare il thread dell'interfaccia utente. Se riconosci gli oggetti in
fotogrammi dalla fotocamera di un dispositivo, ogni classificazione blocca
. Puoi impedire che ciò accada implementando i web worker su cui eseguire il rilevamento
in un altro thread.
Il seguente codice mostra come eseguire l'elaborazione con il modello di attività:
Immagine
const image = document.getElementById("image") as HTMLImageElement; const detections = objectDetector.detect(image);
Video
await objectDetector.setOptions({ runningMode: "video" }); let lastVideoTime = -1; function renderLoop(): void { const video = document.getElementById("video"); if (video.currentTime !== lastVideoTime) { const detections = detector.detectForVideo(video); processResults(detections); lastVideoTime = video.currentTime; } requestAnimationFrame(() => { renderLoop(); }); }
Per un'implementazione più completa dell'esecuzione di un'attività di rilevamento di oggetti, consulta esempio di codice.
Gestire e visualizzare i risultati
Il rilevatore di oggetti genera un oggetto dei risultati del rilevamento per ogni esecuzione di rilevamento. L'oggetto risultati contiene un elenco di rilevamenti, in cui ogni rilevamento include un riquadro di delimitazione e le informazioni sulla categoria dell'oggetto rilevato, tra cui il dell'oggetto e un punteggio di confidenza.
Di seguito è riportato un esempio dei dati di output di questa attività:
ObjectDetectorResult:
Detection #0:
Box: (x: 355, y: 133, w: 190, h: 206)
Categories:
index : 17
score : 0.73828
class name : dog
Detection #1:
Box: (x: 103, y: 15, w: 138, h: 369)
Categories:
index : 17
score : 0.73047
class name : dog
L'immagine seguente mostra una visualizzazione dell'output dell'attività:
Il codice di esempio del rilevatore di oggetti dimostra come visualizzare il rilevamento i risultati restituiti dall'attività, controlla esempio di codice per maggiori dettagli.