Čitatelia ako vy pomáhajú podporovať MUO. Keď uskutočníte nákup pomocou odkazov na našej stránke, môžeme získať pridruženú províziu.

Strojové učenie je základnou technológiou v modernom svete. Počítače sa môžu naučiť rozpoznávať obrázky, vytvárať umelecké diela a dokonca písať svoj vlastný kód, a to všetko s minimálnym zásahom človeka.

Ako však strojové učenie funguje a ako ho môžete použiť aj vy?

Čo je strojové učenie?

Strojové učenie je pomerne jednoduchý koncept. Počítačové systémy sa môžu učiť a prispôsobovať analyzovaním existujúcich dátových vzorov zo zdrojov informácií. Zvyčajne sa to deje bez výslovných pokynov od ľudí.

Dobrým príkladom sú nástroje virtuálnych asistentov. Siri, Cortana a Google Assistant vo veľkej miere využívajú strojové učenie na pochopenie ľudskej reči. Začína to súborom existujúcich zvukových nahrávok, ale tieto nástroje sa môžu učiť aj z interakcií, ktoré s vami majú. To im umožňuje zlepšovať sa sami.

Čo je ml5.js?

Väčšina algoritmov a nástrojov strojového učenia používa pre svoj kód R alebo Python, ale ml5.js je iný. Ml5.js, ktorý funguje ako rozhranie pre knižnicu Tensorflow.js od Google, je projekt s otvoreným zdrojom, ktorý dáva strojové učenie do rúk vývojárom JavaScriptu.

instagram viewer

Môžete začať používať ml5.js pre svoju vlastnú webovú aplikáciu zahrnutím jediného externého skriptu do kódu HTML.

Začíname so strojovým učením: Proces učenia

Trénovanie algoritmu strojového učenia si vyžaduje čas. Počítače sa učia oveľa rýchlejšie ako ľudia, no učia sa aj rôznymi spôsobmi. Našťastie však ml5.js prichádza s výberom predtrénovaných modelov, takže tento krok môžete preskočiť.

Učenie ako trénujú algoritmy strojového učenia je skvelý spôsob, ako lepšie porozumieť nástrojom, ako je tento.

ml5.js uľahčuje vytvorenie nástroja na klasifikáciu obrázkov, ktorý sa spustí na vašom webe. Stránka HTML v tomto príklade obsahuje vstupné pole súboru na výber obrázka. Nahrané obrázky sa zobrazia vo vnútri pripraveného prvku HTML, aby sa umožnilo ml5.js ich naskenovať a identifikovať.

Krok 1: Zahrňte knižnicu ml5.js

Tento projekt vyžaduje na fungovanie dve knižnice: ml5.js a p5.js. ml5.js je knižnica strojového učenia, zatiaľ čo p5.js umožňuje správne pracovať s obrázkami. Na pridanie týchto knižníc potrebujete dva riadky HTML:

<skript src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.0.0/p5.min.js"></script>
<skript src="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script>

Krok 2: Vytvorte niekoľko prvkov HTML

Ďalej je čas vytvoriť niekoľko prvkov HTML. Najdôležitejší je div s ID a triedou označenou imageResult, ktorý uloží konečný výsledok:

<h1>MakeUseOf Image Classifier</h1>

<h2>Kliknite "Vyberte súbor" pridať obrázok</h2>

<trieda div="imageResult" id="imageResult"></div>

Potom pridajte vstupný prvok súboru na zhromaždenie obrázka, aby ho program mohol klasifikovať.

<trieda div="imageInput">
<typ vstupu ="súbor"
oninput="uploadedImage.src=window. URL.createObjectURL(this.files[0]); startImageScan()">
</div>

Vstup počúva na udalosť oninput a ako odpoveď vykoná dva príkazy oddelené bodkočiarkou. Prvý vytvorí adresu URL objektu pre obrázok, ktorá vám umožní pracovať s údajmi bez toho, aby ste ich museli nahrať na server. Druhý volá funkciu startImageScan(), ktorú vytvoríte v ďalšom kroku.

Nakoniec pridajte prvok img na zobrazenie obrázka, ktorý používateľ nahral:

<trieda img="odovzdaný obrázok" id="odovzdaný obrázok" />

Krok 3: Vytvorte funkciu JS na skenovanie obrázkov

Teraz, keď máte nejaké HTML, je čas pridať do mixu nejaký JS. Začnite pridaním premennej const na uloženie prvku imageResult, ktorý ste vytvorili v poslednom kroku.

konšt prvok = dokument.getElementById("imageResult");

Ďalej pridajte funkciu s názvom startImageScan() a v nej inicializujte klasifikátor obrázkov ml5.js pomocou MobileNet.

Nasledujte to pomocou príkazu classifier.classify. Odovzdajte mu odkaz na prvok uploadedImage, ktorý ste pridali skôr, spolu s funkciou spätného volania na spracovanie výsledku.

funkciuspustite ImageScan() {
// Vytvorte a premenlivýdo inicializujte klasifikátor obrázkov ml5.js s MobileNet
const classifier = ml5.imageClassifier('MobileNet');
classifier.classify (document.getElementById("odovzdaný obrázok"), imageScanResult);
element.innerHTML = "...";
}

Krok 4: Vytvorte funkciu zobrazenia výsledkov

Potrebujete tiež funkciu na zobrazenie výsledkov vami vykonanej klasifikácie obrázkov. Táto funkcia obsahuje jednoduchý príkaz if na kontrolu akýchkoľvek chýb.

funkciuimageScanResult(chyba, výsledky) {
if (chyba) {
element.innerHTML = chyba;
} inak {
nech num = výsledky[0].dôvera * 100;
element.innerHTML = results[0].label + "<br>Dôvera: " + num.toFixed (0) + "%";
}
}

Krok 5: Dajte to všetko dohromady

Nakoniec je čas dať celý tento kód dohromady. Je dôležité mať na pamäti

,