Такие читатели, как вы, помогают поддерживать MUO. Когда вы совершаете покупку по ссылкам на нашем сайте, мы можем получать партнерскую комиссию.

Машинное обучение является фундаментальной технологией в современном мире. Компьютеры могут научиться распознавать изображения, создавать произведения искусства и даже писать собственный код — и все это с минимальным вмешательством человека.

Но как работает машинное обучение и как вы можете использовать его самостоятельно?

Что такое машинное обучение?

Машинное обучение — относительно простая концепция. Компьютерные системы могут учиться и адаптироваться, анализируя существующие шаблоны данных из пулов информации. Обычно это делается без явных инструкций от людей.

Хороший пример — инструменты виртуального помощника. Siri, Cortana и Google Assistant широко используют машинное обучение для понимания человеческой речи. Это начинается с пула существующих аудиозаписей, но эти инструменты также могут учиться на ваших взаимодействиях. Это позволяет им совершенствоваться самостоятельно.

instagram viewer

Что такое ml5.js?

Большинство алгоритмов и инструментов машинного обучения используют R или Python для своего кода, но ml5.js отличается. Выступая в качестве интерфейса для библиотеки Google Tensorflow.js, ml5.js представляет собой проект с открытым исходным кодом, который передает машинное обучение в руки разработчиков JavaScript.

Вы можете начать использовать ml5.js для своего собственного веб-приложения, включив один внешний скрипт в свой HTML.

Начало работы с машинным обучением: процесс обучения

Обучение алгоритма машинного обучения требует времени. Компьютеры учатся намного быстрее, чем люди, но и учатся они по-разному. К счастью, ml5.js поставляется с набором предварительно обученных моделей, так что вы можете пропустить этот шаг.

Обучение как тренируются алгоритмы машинного обучения это отличный способ лучше понять такие инструменты.

ml5.js позволяет легко создать инструмент классификации изображений для запуска на вашем веб-сайте. HTML-страница в этом примере содержит поле ввода файла для выбора изображения. Загруженные изображения отображаются внутри подготовленного HTML-элемента, что позволяет ml5.js сканировать и идентифицировать их.

Шаг 1. Включите библиотеку ml5.js

Для работы этого проекта необходимы две библиотеки: ml5.js и p5.js. ml5.js — это библиотека машинного обучения, а p5.js позволяет правильно работать с изображениями. Вам нужно две строки HTML, чтобы добавить эти библиотеки:

<источник сценария ="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.0.0/p5.min.js"></script>
<источник сценария ="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script>

Шаг 2: Создайте несколько HTML-элементов

Теперь пришло время создать некоторые элементы HTML. Наиболее важным является div с идентификатором и классом imageResult, в котором будет храниться окончательный результат:

<h1>MakeUseOf Классификатор изображений</h1>

<h2>Нажмите "Выберите файл" добавить изображение</h2>

<раздел класс ="изображениеРезультат" идентификатор ="изображениеРезультат"></div>

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

<раздел класс ="изображениеВвод">
<тип ввода="файл"
на входе ="загруженное изображение.src=окно. URL.createObjectURL(this.files[0]); запуститьсканирование изображения()">
</div>

Вход прослушивает событие oninput и выполняет два оператора в ответ, разделенных точкой с запятой. Первый создает URL-адрес объекта для изображения, что позволяет вам работать с данными, не загружая их на сервер. Второй вызывает функцию startImageScan(), которую вы создадите на следующем шаге.

Наконец, добавьте элемент img для отображения загруженного пользователем изображения:

<класс изображения ="загруженное изображение" идентификатор ="загруженное изображение" />

Шаг 3: Создайте JS-функцию сканирования изображений

Теперь, когда у вас есть немного HTML, пришло время добавить немного JS. Начните с добавления константной переменной для хранения элемента imageResult, созданного на последнем шаге.

константа элемент = документ.getElementById("imageResult");

Затем добавьте функцию startImageScan() и внутри нее инициализируйте классификатор изображений ml5.js с помощью MobileNet.

Следуйте за этим с помощью команды classifier.classify. Передайте ему ссылку на добавленный ранее элемент uploadedImage вместе с функцией обратного вызова для обработки результата.

функциязапуститьImageScan() {
// Создавать а переменнаяк инициализировать классификатор изображений ml5.js с Мобильная сеть
константный классификатор = ml5.imageClassifier('Мобильная сеть');
classifier.classify(document.getElementById("загруженное изображение"), imageScanResult);
элемент.innerHTML = "...";
}

Шаг 4: Создайте функцию отображения результатов

Вам также нужна функция для отображения результатов выполненной вами классификации изображений. Эта функция содержит простой оператор if для проверки ошибок.

функцияimageScanResult(ошибка, результат) {
если (ошибка) {
element.innerHTML = ошибка;
} еще {
позволять число = результаты [0].уверенность * 100;
element.innerHTML = результаты[0].метка + "<бр>Уверенность: " + num.toFixed (0) + "%";
}
}

Шаг 5: Соберите все вместе

Наконец, пришло время собрать весь этот код вместе. Важно помнить о

,