Czytelnicy tacy jak ty pomagają wspierać MUO. Kiedy dokonujesz zakupu za pomocą linków na naszej stronie, możemy otrzymać prowizję partnerską.
Uczenie maszynowe to podstawowa technologia we współczesnym świecie. Komputery mogą nauczyć się rozpoznawać obrazy, tworzyć dzieła sztuki, a nawet pisać własny kod, a wszystko to przy minimalnej interwencji człowieka.
Ale jak działa uczenie maszynowe i jak możesz je wykorzystać samodzielnie?
Co to jest uczenie maszynowe?
Uczenie maszynowe to stosunkowo prosta koncepcja. Systemy komputerowe mogą się uczyć i dostosowywać, analizując istniejące wzorce danych z pul informacji. Zwykle odbywa się to bez wyraźnych instrukcji od ludzi.
Dobrym przykładem są narzędzia wirtualnego asystenta. Siri, Cortana i Asystent Google szeroko wykorzystują uczenie maszynowe do rozumienia ludzkiej mowy. Zaczyna się od puli istniejących nagrań dźwiękowych, ale te narzędzia mogą również uczyć się na podstawie interakcji, które mają z Tobą. To pozwala im na samodzielną poprawę.
Co to jest ml5.js?
Większość algorytmów i narzędzi uczenia maszynowego używa języka R lub Pythona w swoim kodzie, ale ml5.js jest inny. Działając jako interfejs dla biblioteki Google Tensorflow.js, ml5.js to projekt typu open source, który przekazuje uczenie maszynowe w ręce programistów JavaScript.
Możesz zacząć używać ml5.js we własnej aplikacji internetowej, umieszczając pojedynczy zewnętrzny skrypt w kodzie HTML.
Pierwsze kroki z uczeniem maszynowym: proces uczenia się
Szkolenie algorytmu uczenia maszynowego wymaga czasu. Komputery uczą się znacznie szybciej niż ludzie, ale uczą się też na inne sposoby. Na szczęście jednak ml5.js zawiera wybór wstępnie wytrenowanych modeli, dzięki czemu można pominąć ten krok.
Uczenie się jak uczą się algorytmy uczenia maszynowego to świetny sposób na lepsze zrozumienie takich narzędzi.
ml5.js ułatwia tworzenie narzędzia do klasyfikacji obrazów do uruchomienia w Twojej witrynie. Strona HTML w tym przykładzie zawiera pole wprowadzania pliku umożliwiające wybranie obrazu. Przesłane obrazy wyświetlają się w przygotowanym elemencie HTML, aby umożliwić ml5.js ich skanowanie i identyfikację.
Krok 1: Dołącz bibliotekę ml5.js
Ten projekt wymaga do działania dwóch bibliotek: ml5.js i p5.js. ml5.js to biblioteka uczenia maszynowego, natomiast p5.js umożliwia poprawną pracę z obrazami. Aby dodać te biblioteki, potrzebujesz dwóch wierszy kodu HTML:
<źródło skryptu="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.0.0/p5.min.js"></script>
<źródło skryptu="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script>Krok 2: Utwórz kilka elementów HTML
Następnie nadszedł czas na utworzenie niektórych elementów HTML. Najważniejszy jest div z identyfikatorem i klasą oznaczony imageResult, który będzie przechowywać końcowy wynik:
<h1>MakeUseOf klasyfikator obrazów</h1><h2>Kliknij "Wybierz plik" aby dodać obraz</h2>
<klasa div="wynik obrazu" identyfikator="wynik obrazu"></div>
Następnie dodaj element wejściowy pliku, aby zebrać obraz do sklasyfikowania przez program.
<klasa div="wejście obrazu">
<typ wejścia="plik"
na wejściu="przesłany obraz.src=okno. URL.createObjectURL(to.pliki[0]); startImageScan()">
</div>
Wejście nasłuchuje zdarzenia oninput iw odpowiedzi wykonuje dwie instrukcje, oddzielone średnikiem. Pierwszy tworzy adres URL obiektu dla obrazu, który umożliwia pracę z danymi bez konieczności przesyłania ich na serwer. Drugi wywołuje funkcję startImageScan(), którą utworzysz w następnym kroku.
Na koniec dodaj element img, aby wyświetlić obraz przesłany przez użytkownika:
<klasa img="przesłany obraz" identyfikator="przesłany obraz" />Krok 3: Utwórz funkcję JS skanującą obrazy
Teraz, gdy masz trochę HTML, czas dodać trochę JS do miksu. Zacznij od dodania zmiennej const do przechowywania elementu imageResult utworzonego w ostatnim kroku.
konst element = dokument.getElementById("imageResult");Następnie dodaj funkcję o nazwie startImageScan() i wewnątrz niej zainicjuj klasyfikator obrazu ml5.js za pomocą MobileNet.
Następnie wykonaj polecenie classifier.classify. Przekaż mu odwołanie do dodanego wcześniej elementu uploadedImage wraz z funkcją wywołania zwrotnego do przetworzenia wyniku.
funkcjonowaćuruchom ImageScan() {
// Tworzyć A zmiennyDo zainicjuj klasyfikator obrazu ml5.js z MobileNet
const klasyfikator = ml5.imageClassifier('MobileNet');
classifier.classify (document.getElementById("przesłany obraz"), imageScanResult);
element.innerHTML = "...";
}Krok 4: Utwórz funkcję wyświetlania wyników
Potrzebujesz również funkcji do wyświetlania wyników przeprowadzonej klasyfikacji obrazu. Ta funkcja zawiera prostą instrukcję if, która sprawdza, czy nie ma błędów.
funkcjonowaćwynik skanowania obrazu(Błąd, wyniki) {
jeśli (błąd) {
element.innerHTML = błąd;
} w przeciwnym razie {
pozwalać liczba = wyniki [0].zaufanie * 100;
element.innerHTML = wyniki[0].etykieta + "<br>Zaufanie: " + num.toStała (0) + "%";
}
}Krok 5: Złóż wszystko razem
W końcu nadszedł czas, aby złożyć cały ten kod razem. Ważne jest, aby pamiętać o
,