Использование Microsoft Azure CustomVision.ai с Tulip Vision для визуального контроля
  • 31 Oct 2023
  • 4 Минуты для чтения
  • Авторы

Использование Microsoft Azure CustomVision.ai с Tulip Vision для визуального контроля


Article Summary

Использование Azure CustomVision.ai с Tulip Vision - это простой способ без использования кода реализовать визуальный контроль на рабочих станциях и не только.

В этой статье мы покажем, как использовать сервис Microsoft Azure CustomVision.ai для визуального контроля с помощью Tulip. Сервис CustomVision.ai предназначен для простого создания моделей машинного обучения для задач визуального распознавания. С помощью Tulip можно собирать данные для обучения моделей машинного обучения, которые предлагает CustomVision.ai.

Визуальный контроль является важной частью фронтальных операций. С его помощью можно обеспечить выход с линии только высококачественной продукции, сократить количество возвращаемых деталей и повторных работ, а также повысить истинный выход продукции. Автоматический визуальный контроль позволяет сэкономить на привлечении ручного персонала для выполнения визуального контроля, что снижает общие затраты и повышает эффективность. С помощью Tulip Vision визуальный контроль можно быстро и легко добавить на любую рабочую станцию, подключив доступную камеру к существующему компьютеру и создав приложение Tulip App для контроля.

Необходимые условия

  • Рабочая станция Tulip Vision с камерой для визуального контроля. Следуйте руководству по началу работы с Tulip Vision
  • Учетная запись для использования на сайте CustomVision.ai
  • Продукт, который будет использоваться для задачи визуального контроля
  • Набор данных, включающий не менее 30 изображений для каждого класса категорий, которые необходимо проверить (например, "Прошел" или "Не прошел", "Дефект 1", "Дефект 2", "Дефект 3" и т.д.). Следуйте инструкциям руководства по сбору и экспорту данных визуального контроля из Tulip

Пример настройки визуального контроля

Загрузка изображений инспекции в CustomVision.ai

В таблице данных Tulip нажмите кнопку "Загрузить набор данных" и выберите соответствующие столбцы для изображений и аннотаций. Загрузите и разархивируйте файл .zip набора данных в папку на компьютере. Он должен содержать несколько вложенных папок для каждой категории обнаружения в соответствии с аннотацией в таблице набора данных.

Создайте новый проект на Customvision.ai:

Назовите проект, выберите тип проекта "Классификация" и "Мультикласс (одна метка на изображение)". Classification. Тип: (эти опции выбраны по умолчанию).

Нажмите кнопку "Добавить изображения".

Выберите изображения на своем компьютере для одного из классов. Можно выбрать все изображения в подпапке, полученной из разархивированного набора данных Tulip Table. После загрузки изображений в Customvision.ai можно применить метку сразу ко всем изображениям, чтобы не набирать их по одному. Поскольку все текущие изображения относятся к одному классу, это возможно.

В следующем примере мы загружаем все изображения класса "Normal" и применяем тег (class) сразу ко всем изображениям:

Повторите ту же операцию загрузки для других классов.

Обучение и публикация модели для визуального контроля

После того как данные для обучения получены, переходим к обучению модели. Кнопка "Обучение" в правом верхнем углу открывает диалог обучения модели.

Выберите соответствующий режим обучения. Для быстрого пробного запуска, чтобы убедиться, что все работает правильно, используйте опцию "Quick". В противном случае для получения наилучших результатов классификации используйте режим "Расширенный".

После обучения модели вы сможете просмотреть ее показатели, а также опубликовать модель, чтобы она была доступна через API-вызов.

Выберите подходящий ресурс для публикации и продолжите работу.

На этом этапе опубликованная модель готова принимать запросы на вывод от Tulip. Обратите внимание на URL публикации, поскольку мы будем использовать его в ближайшее время для подключения из Tulip.

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

Виджет для создания запросов на вывод в опубликованной модели

Выполнение запросов на вывод к сервису Azure CustomVision.ai может осуществляться на Tulip с помощью пользовательского виджета. Страница Custom Widgets находится в разделе Settings.

Создайте новый пользовательский виджет и добавьте следующие входы:

Для частей кода используйте следующее:

HTML

<button class="button" type="button">Обнаружить аномалии</button>.

JavaScript

Примечание: Здесь необходимо получить URL и prediction-key из опубликованной модели 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 = '<<< Использовать URL из CustomVision.ai>>>';  

 $.ajax({  

 url: url,  

 type: 'post',  

 data: b64toblob(image),  

 cache: false,  

 processData: false,  

 заголовки: {  

 'Prediction-Key': '<<< Использовать ключ предсказания >>>',  

 'Content-Type': 'application/octet-stream'  

 },  

 success: (response) => {  

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

 },  

 error: (err) => {  

 console.log(err);  

 },  

 async: false,  

 });  

} ```


**CSS**


``` .button {  

 background-color: 


## 616161;


border: none;  

 цвет: белый;  

 padding: 15px 32px;  

 text-align: center;  

 text-decoration: none;  

 display: inline-block;  

 font-size: 16px;  

 width: 100%;  

} ```


Убедитесь, что в пользовательском виджете включена внешняя библиотека jQuery.![](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=""}


Ваш пользовательский виджет должен выглядеть следующим образом:


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


## Использование виджета прогнозирования в приложении Tulip


Теперь, когда виджет настроен, его можно просто добавить в приложение, в котором будут выполняться запросы на вывод. Приложение Step можно построить следующим образом:


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


С помощью обычной кнопки сделать снимок с камеры визуального контроля и сохранить его в переменной:


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


Использовать пользовательский виджет "Обнаружение аномалий".


![](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"}


Настройте виджет на прием переменной изображения снимка в виде 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"}


Присвойте полученный результат переменной для отображения на экране или использования в других целях.


![](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"}


Теперь ваше приложение готово к выполнению запросов на вывод для визуального контроля.


## Запуск приложения для визуального контроля


После того как приложение готово, запустите его на машине Player с инспекционной камерой, которую вы использовали для сбора данных. Важно воспроизвести ту же ситуацию, что и при сборе данных, чтобы исключить любые ошибки, связанные с изменением освещения, расстояния или угла обзора.


Вот пример работающего приложения для визуального контроля:


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


## Дальнейшее чтение


* [Начало работы с программой Vision](https://support.tulip.co/docs/getting-started-with-vision)
* [Сбор данных для визуального контроля](https://support.tulip.co/docs/collecting-data-for-visual-inspection-with-vision)
* [Обзор пользовательских виджетов](https://support.tulip.co/docs/custom-widgets-overview)

Была ли эта статья полезной?