Utilizzo di Microsoft Azure CustomVision.ai con Tulip Vision per l'ispezione visiva
  • 26 Mar 2024
  • 5 Minuti da leggere
  • Contributori

Utilizzo di Microsoft Azure CustomVision.ai con Tulip Vision per l'ispezione visiva


Article Summary

L'uso di Azure CustomVision.ai con Tulip Vision è un modo semplice e senza codice per implementare l'ispezione visiva sulle postazioni di lavoro e non solo.

In questo articolo dimostreremo come utilizzare il servizio CustomVision.ai di Microsoft Azure per l'ispezione visiva con Tulip. Il servizio CustomVision.ai serve a creare facilmente modelli di apprendimento automatico per attività di riconoscimento visivo. Con Tulip è possibile raccogliere dati per addestrare i modelli di apprendimento automatico offerti da CustomVision.ai.

L'ispezione visiva è una parte importante delle operazioni di prima linea. Può essere utilizzata per garantire che solo i prodotti di alta qualità escano dalla linea, per ridurre i pezzi restituiti e le rilavorazioni e per aumentare la resa reale. L'ispezione visiva automatica consente di risparmiare sull'assegnazione di manodopera manuale per l'esecuzione dell'ispezione visiva, riducendo i costi complessivi e aumentando l'efficienza. Con Tulip Vision, l'ispezione visiva può essere aggiunta a qualsiasi stazione di lavoro con velocità e facilità, collegando una telecamera economica a un computer esistente e creando un'applicazione Tulip per l'ispezione.

Prerequisiti

Esempio di impostazione dell'ispezione visiva

Caricamento delle immagini di ispezione su CustomVision.ai

Dalla tabella Tulip dei dati fare clic su "Download Dataset" e selezionare le colonne pertinenti per le immagini e le annotazioni. Scaricare e decomprimere il file .zip del dataset in una cartella del computer. Dovrebbe avere un numero di sottocartelle per ogni categoria di rilevamento in base all'annotazione nella tabella dei dati.

Create un nuovo progetto su Customvision.ai:

Dare un nome al progetto e selezionare il tipo di progetto "Classificazione" e "Multiclasse (singolo tag per immagine)". Classificazione. (queste opzioni sono selezionate per impostazione predefinita).

Fare clic su "Aggiungi immagini".

Selezionare le immagini presenti sul computer per una delle classi. È possibile selezionare tutte le immagini nella sottocartella ottenuta dal set di dati decompresso Tulip Table. Una volta che le immagini sono state caricate in Customvision.ai, è possibile applicare un tag a tutte le immagini in una volta sola, per evitare di doverle etichettare una per una. Poiché tutte le immagini correnti appartengono alla stessa classe, ciò è possibile.

Nell'esempio seguente carichiamo tutte le immagini della classe "Normal" e applichiamo il tag (classe) a tutte in una volta:

Ripetere la stessa operazione di caricamento per le altre classi.

Addestramento e pubblicazione di un modello per l'ispezione visiva

Una volta che i dati per l'addestramento sono pronti, si procede all'addestramento del modello. Il modello "Train" nell'angolo in alto a destra apre la finestra di dialogo di addestramento.

Selezionare la modalità di addestramento in modo appropriato. Per una rapida prova per verificare che tutto funzioni correttamente, utilizzare l'opzione "Veloce". Altrimenti, per ottenere i migliori risultati di classificazione, utilizzare l'opzione "Avanzato".

Una volta che il modello è stato addestrato, sarà possibile controllare le sue metriche di prestazione e pubblicare il modello in modo che sia accessibile tramite una chiamata API.

Selezionare la risorsa corretta per la pubblicazione e continuare.

A questo punto il modello pubblicato è pronto per accettare richieste di inferenza da Tulip. Prendete nota dell'URL di pubblicazione, perché lo useremo a breve per connetterci da Tulip.

Using Microsoft Azure CustomVision.ai with Tulip Vision for Visual Inspection_490190230.png

Widget per fare richieste di inferenza al modello pubblicato

Le richieste di inferenza al servizio Azure CustomVision.ai possono essere effettuate su Tulip utilizzando un Widget personalizzato. La pagina dei Widget personalizzati si trova sotto Impostazioni.

Creare un nuovo Widget personalizzato e aggiungere i seguenti input:

Per le parti di codice, utilizzare le seguenti:

HTML

<button class="button" type="button">Rileva le anomalie</button>.

JavaScript

Nota: qui è necessario ottenere l'URL e la chiave di predizione dal modello pubblicato da CustomVision.ai.


 const byteArray = Uint8Array.from(window.atob(image), c => c.charCodeAt(0));  

 return new Blob([byteArray], {type: 'application/octet-stream'});  

} 


async function detectAnomalies() {  

 let image = getValue("imageBase64String");  

 const url = '<<< Usa l'URL di CustomVision.ai>>';  

 $.ajax({  

 url: url,  

 tipo: 'post',  

 dati: b64toblob(immagine),  

 cache:false,  

 processData: false,  

 intestazioni: {  

 'Chiave di predizione': '<<< Usa la chiave di predizione >>',  

 Content-Type": "application/octet-stream".  

 },  

 successo: (risposta) => {  

 setValue("predictions", response["predictions"]);  

 },  

 error: (err) => {  

 console.log(err);  

 },  

 async: false,  

 });  

} ```


**CSS**


```` .button {  

 colore di sfondo: 


## 616161;


bordo: nessuno;  

 colore: bianco;  

 imbottitura: 15px 32px;  

 allineamento del testo: centro;  

 decorazione del testo: nessuna;  

 visualizzazione: inline-block;  

 dimensione del carattere: 16px;  

 larghezza: 100%;  

} ```


Assicurarsi di abilitare la libreria esterna jQuery sul widget personalizzato.![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Screen%20Shot%202022-10-12%20at%2011.00.35%20AM_shadow.jpg){height="" width=""}


Il widget personalizzato dovrebbe avere l'aspetto seguente:


![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Microsoft%20Azure%20CustomVision.ai%20with%20Tulip%20Vision%20for%20Visual%20Inspection_490283461.png)


## Utilizzo del widget Previsione in un'applicazione Tulipano


Ora che il widget è stato configurato, si può semplicemente aggiungerlo a un'applicazione in cui verranno eseguite le richieste di inferenza. Si può costruire un'app Step come la seguente:


![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Microsoft%20Azure%20CustomVision.ai%20with%20Tulip%20Vision%20for%20Visual%20Inspection_497394399.png)


Utilizzare un normale pulsante per scattare un'istantanea dalla telecamera di ispezione visiva e salvarla in una variabile:


![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Microsoft%20Azure%20CustomVision.ai%20with%20Tulip%20Vision%20for%20Visual%20Inspection_490299484.png)


Utilizzare il widget personalizzato "Rileva anomalie".


![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Microsoft%20Azure%20CustomVision.ai%20with%20Tulip%20Vision%20for%20Visual%20Inspection_490295795.png){height="" width="350"}


Configurare il widget in modo che accetti la variabile immagine dell'istantanea come una stringa base64.


![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Microsoft%20Azure%20CustomVision.ai%20with%20Tulip%20Vision%20for%20Visual%20Inspection_490296728.png){height="" width="300"}


Assegnare l'output a una variabile da visualizzare sullo schermo o da utilizzare in altro modo.


![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Microsoft%20Azure%20CustomVision.ai%20with%20Tulip%20Vision%20for%20Visual%20Inspection_490302048.png){height="" width="350"}


L'applicazione è ora pronta per eseguire richieste di inferenza per l'ispezione visiva.


## Esecuzione dell'applicazione per l'ispezione visiva


Una volta che l'applicazione è pronta, eseguirla su un computer lettore con la telecamera di ispezione utilizzata per la raccolta dei dati. È importante replicare la stessa situazione utilizzata per la raccolta dei dati e per l'inferenza dell'ispezione, per eliminare eventuali errori dovuti a variazioni di illuminazione, distanza o angolazione.


Ecco un esempio di applicazione di ispezione visiva in esecuzione:


![](https://cdn.document360.io/7c6ff534-cad3-4fc8-9583-912c4016362f/Images/Documentation/Using%20Microsoft%20Azure%20CustomVision.ai%20with%20Tulip%20Vision%20for%20Visual%20Inspection_497398652.png)


## Ulteriori letture


* [Come iniziare con la visione](https://support.tulip.co/docs/getting-started-with-vision)
* [Raccolta dei dati per l'ispezione visiva](https://support.tulip.co/docs/collecting-data-for-visual-inspection-with-vision)
* [Widget personalizzato di Landing AI](https://support.tulip.co/docs/landingai-widget)
* [Test unitario di Landing AI](https://tulip.co/library/apps/landingai-unit-test/)
* [Panoramica dei widget personalizzati](https://support.tulip.co/docs/custom-widgets-overview)

Questo articolo è stato utile?