14 KiB

Raw Blame History Unescape Escape

Mətbəx tövsiyyə edən Veb tətbiq yaradaq

Bu dərsdə əvvəlki dərslərdə öyrəndiyimiz bəzi üsullar və bu bölmədə istifadə olunan ləzzətli mətbəx data seti ilə qruplaşdırıcı modeli quracağıq. Bundan əlavə, Onnx-in veb runtime versiyasından istifadə edərək yadda saxlanmış modeli tətbiq etmək üçün kiçik veb tətbiqi yaratmalıyıq.

Maşın öyrənməsinin ən faydalı praktik istifadələrindən biri tövsiyə sistemlərinin qurulmasıdır və biz bu istiqamətdə ilk addımı atacağıq!

🎥 Video üçün yuxardakı şəklə klikləyin: Jen Looper qruplaşdırılmış mətbəx datası istifadə etməklə veb tətbiq yaradır.

Mühazirədən əvvəl test

Bu dərsdə öyrənəcəksiniz:

Veb modeli necə yaratmalı və onu Onnx model kimi necə yadda saxlamalı
Modeli nəzərdən keçirməklə Netron modeli necə istifadə etməli
Veb tətbiqdə nəticə çıxarmaq üçün modeli necə istifadə etməli

Modelinizi yaradın

Tətbiq olunan ML sistemlərinin yaradılması biznes sistemləri üçün bu texnologiyalardan istifadə etməyin vacib hissəsidir. Onnx-dən istifadə etməklə veb proqramlar daxilində modellərdən istifadə etmək olar (ehtiyac olduqda onları oflayn mühitdə istifadə etmək lazımdır).

Əvvəlki dərsdə UFO ilə bağlı reqresiya modelini yaradıb, "pickle" edib Flask tətbiqi daxilində istifadə etmişdik. Bu arxitekturanı bilmək çox faydalı olsa da, tamamilə Python proqramıdır. Lakin, sizdən Javascript tətbiqi də yazmaq tələb oluna bilər.

Bu dərsdə nəticə almaq üçün Javascript əsasında veb tətbiq yarada bilərik. Əvvəlcə modeli öyrətmək və Onnx ilə işləməsi üçün hazırlamaq lazımdır.

Tapşırıq - qruplaşdırıcı modelini öyrədin

İlk öncə qruplaşdırıcı modeli təmizlənmiş mətbəxlər data dəstini istifadə etməklə öyrədək.

Lazımi kitabxanaları əlavə etməklə başlayaq:
```
!pip install skl2onnx
import pandas as pd
```
Scikit-learn modelini Onnx formatına keçirmək üçün 'skl2onnx' köməyinə ehtiyacımız var.
CSV faylını oxumaq üçün read_csv() istifadə etməklə əvvəlki dərsdə etdiyimiz kimi dataset ilə işləməliyik:
```
data = pd.read_csv('../data/cleaned_cuisines.csv')
data.head()
```
İlk iki lazımsız sütunu ləğv edərək yerdə qalan datanı 'X' kimi yadda saxlayaq:
```
X = data.iloc[:,2:]
X.head()
```
Etiketləri isə 'y' kimi qeyd edək:
```
y = data[['cuisine']]
y.head()
```

Təlim rutininə başlayaq

Biz yüksək dəqiqliyə malik "SVC" kitabxanasından istifadə edəcəyik.

Scikit-learn vasitəsilə lazımlı kitabxanaları əlavə edək:

from sklearn.model_selection import train_test_split
from sklearn.svm import SVC
from sklearn.model_selection import cross_val_score
from sklearn.metrics import accuracy_score,precision_score,confusion_matrix,classification_report

Təlim və test setlərini ayıraq:

X_train, X_test, y_train, y_test = train_test_split(X,y,test_size=0.3)

Əvvəlki dərsdə etdiyiniz kimi SVC təsnifat modelini yaradaq:

model = SVC(kernel='linear', C=10, probability=True,random_state=0)
model.fit(X_train,y_train.values.ravel())

predict() testini çağırmaqla modeli test edək:
```
y_pred = model.predict(X_test)
```

Modelin keyfiyyətini yoxlamaq üçün qruplaşdırıcı hesabatını çap edək:

print(classification_report(y_test,y_pred))

Daha əvvəl də gördüyümüz kimi dəqiqlik dərəcəsi çox yaxşıdır:

                precision    recall  f1-score   support

     chinese       0.72      0.69      0.70       257
      indian       0.91      0.87      0.89       243
    japanese       0.79      0.77      0.78       239
      korean       0.83      0.79      0.81       236
        thai       0.72      0.84      0.78       224

    accuracy                           0.79      1199
   macro avg       0.79      0.79      0.79      1199
weighted avg       0.79      0.79      0.79      1199

Modeli Onnx-ə çevirək

Düzgün Tensor nömrəsi ilə çevirmə etdiyimizə əmin olmalıyıq. Bu data dəstində 380 inqrediyent sadalanıb, ona görə də bu rəqəmi FloatTensorType-da qeyd etmək lazımdır:

380 tensor nömrəsindən istifadə edərək çevirməni həyata keçirək:

from skl2onnx import convert_sklearn
from skl2onnx.common.data_types import FloatTensorType

initial_type = [('float_input', FloatTensorType([None, 380]))]
options = {id(model): {'nocl': True, 'zipmap': False}}

onx yaradıb faylı model.onnx kimi yadda saxlayaq:
```
onx = convert_sklearn(model, initial_types=initial_type, options=options)
with open("./model.onnx", "wb") as f:
    f.write(onx.SerializeToString())
```
Konvertasiya skriptində options ötürə bilərik. Bu halda, 'nocl' True və 'zipmap' False olmasını təmin etdik. Bu qruplaşdırıcı model olduğundan lüğətlərin siyahısını yaradan ZipMap-ı silmək seçimimiz var (vacib deyil). nocl modelə daxil edilmiş sinif məlumatlarına istinad edir. nocl-i 'True' olaraq təyin edərək modelinizin ölçüsünü azaldaq.

Bütün notbuku işə salmaqla Onnx modelini yaradaraq onu bu qovluqda yadda saxlaya biləcəyik.

Modelə nəzər yetirək

Onnx modelləri Visual Studio kodunda visual olaraq görünmür. Bir çox tədqiqatçı modelin düzgün qurulmasını təmin etmək üçün onu vizuallaşdırmağa istifadə olunan pulsuz proqramlardan istifadə edir. Netron yükləyək və model.onnx faylını açaq. Sadə modelin 380 girişi və siyahıda göstərilən təsnifatı ilə vizuallaşdırıldığını görə bilərsiniz:

Netron modelləri vizual olaraq görmək üçün bir vasitədir.

İndi bu səliqəli modeli veb proqramda istifadə etməyə hazırıq. Gəlin soyuducuya baxan zaman işimizə yarayacaq bir proqram yaradaq və modelə görə müəyyən edilmiş mətbəx növünü bişirmək üçün qalıq inqrediyentlərin hansı kombinasiyasından istifadə edə biləcəyinizi anlamağa çalışaq.

Tövsiyə verən bir veb tətbiq yaradaq

Modeli birbaşa veb proqramında istifadə edə bilərik. Bu arxitektura həm də lazım olduqda onu lokal və ya oflayn rejimdə işə salmağa imkan verir. model.onnx faylını saxladığımız eyni qovluqda index.html faylı yaratmaqla başlayaq.

Bu faylda index.html, aşağıdakı kodu əlavə edək:

<!DOCTYPE html>
<html>
    <header>
        <title>Mətbəx Uyğunlaşdırıcısı</title>
    </header>
    <body>
        ...
    </body>
</html>

İndi isə body teqləri ilə işləyərək ingridientləri əks etdirən bölmələri əlavə edək:

<h1>Soyuducuya bax. Nə bişirə bilərsən?</h1>
        <div id="wrapper">
            <div class="boxCont">
                <input type="checkbox" value="4" class="checkbox">
                <label>alma</label>
            </div>

            <div class="boxCont">
                <input type="checkbox" value="247" class="checkbox">
                <label>armud</label>
            </div>

            <div class="boxCont">
                <input type="checkbox" value="77" class="checkbox">
                <label>vişnə</label>
            </div>

            <div class="boxCont">
                <input type="checkbox" value="126" class="checkbox">
                <label>çəmən otu</label>
            </div>

            <div class="boxCont">
                <input type="checkbox" value="302" class="checkbox">
                <label>düyü şərabı</label>
            </div>

            <div class="boxCont">
                <input type="checkbox" value="327" class="checkbox">
                <label>soya sousu</label>
            </div>

            <div class="boxCont">
                <input type="checkbox" value="112" class="checkbox">
                <label>cirə</label>
            </div>
        </div>
        <div style="padding-top:10px">
            <button onClick="startInference()">Hansı növ mətbəxə müraciət edə bilərsən?</button>
        </div>

Qeyd edək ki, hər bir xanaya dəyər verilir. Bu, verilənlər bazasına uyğun olaraq tərkib hissəsinin tapıldığı indeksi əks etdirir. Məsələn, 'Alma' əlifba siyahısında beşinci sütundadır, ona görə də biz 0-dan saymağa başladığımız zaman verilmiş tərkib indeksinə görə onun dəyəri '4'dür. inqrediyentlər cədvəlini nəzərdən keçirməklə verilmiş tərkib hissələrini görə bilərsiniz.

index.html faylında işi davam etdirərək, </div> yekunlaşdırıcı bağlandıqdan sonra modelin çağrıldığı skript blokunu əlavə edin.

İlk öncə, Onnx Runtime əlavə edək:
```
<script src="https://cdn.jsdelivr.net/npm/onnxruntime-web@1.9.0/dist/ort.min.js"></script>
```
Onnx Runtime, Onnx modelləri optimallaşdırmaq və istifadə edə bilmək üçün API daxil olmaqla geniş çeşidli platformalarda işləməyə imkan vermək üçün istifadə olunur.

Runtime yerini aldıqdan sonra işə sala bilərik:

<script>
    const ingredients = Array(380).fill(0);

    const checks = [...document.querySelectorAll('.checkbox')];

    checks.forEach(check => {
        check.addEventListener('change', function() {
            // toggle the state of the ingredient
            // based on the checkbox's value (1 or 0)
            ingredients[check.value] = check.checked ? 1 : 0;
        });
    });

    function testCheckboxes() {
        // validate if at least one checkbox is checked
        return checks.some(check => check.checked);
    }

    async function startInference() {

        let atLeastOneChecked = testCheckboxes()

        if (!atLeastOneChecked) {
            alert('Please select at least one ingredient.');
            return;
        }
        try {
            // create a new session and load the model.

            const session = await ort.InferenceSession.create('./model.onnx');

            const input = new ort.Tensor(new Float32Array(ingredients), [1, 380]);
            const feeds = { float_input: input };

            // feed inputs and run
            const results = await session.run(feeds);

            // read from results
            alert('You can enjoy ' + results.label.data[0] + ' cuisine today!')

        } catch (e) {
            console.log(`failed to inference ONNX model`);
            console.error(e);
        }
    }

</script>

Bu kodda eyni anda bir neçə prosses baş verir:

Mümkün 380 dəyərdən (1 və ya 0) ibarət massiv yaratdıq və inqrediyentin işarələnib göstərilməsindən asılı olaraq nəticə çıxarmaq üçün modelə göndəriləcək.
Qeyd qutuları massivinin proqram başlayanda çağırılan init funksiyasında yoxlanılıb-yoxlanılmadığını müəyyən etmək üçün bir üsul yaratdıq. Yoxlama qutusu işarələndikdə, ingredients massivi seçilmiş inqrediyenti əks etdirmək üçün yenilənir.
testCheckboxes funksiyası yaradaraq hansısa qeyd qutusunun işarələnib-işarələnmədiyini yoxlanılır.
startInference funksiyasını istifadə edərək hansısa düymə basılanda və ya hər hansı işarə qutusu seçiləndə hərəkətə keçilir.
Nəticə çıxarma ardıcıllığı aşağıdakıları əhatə edir:
1. Modelin asinxron yükünün qurulması
2. Modelə göndərmək üçün Tensor strukturunun yaradılması
3. Modeli öyrədərkən yaratdığımız float_input daxiletməsini əks etdirən feeds datasının yaradılması (bu adı yoxlamaq üçün Netron-dan istifadə edə bilərsiniz)
4. feeds məlumatını modelə göndərmək və ondan cavab gözləmək

Proqramı test edək

index.html faylının yerləşdiyi qovluqda Visual Studio-da yeni terminal açaq və qlobalda quraşdırılmış http-server mövcud olduğundan əmin olaq. Sorğuda http-server yazdıqdan sonra Localhost açılacaq. Beləliklə Veb tətbiqə nəzər yetirə bilərik. Müxtəlif inqrediyentlər əsasında hansı mətbəxin tövsiyə olunduğunu yoxlayaq:

Təbriklər, 'tövsiyyə edən' veb tətbiq yaratdıq. İndi isə sistemi qurmaq üçün daha çox vaxt ayıraq!

🚀 Məşğələ

Hazırki veb tətbiq minimal səviyyədədir. Bu səbəbdən inqrediyentlər və onların indekslərinə əsasən ingredient_indexes datasından istifadə etməklə davam etmək lazımdır. Verilmiş milli yeməyi hazırlamaq üçün hansı dadlardan istifadə edilməlidir, müəyyən edək.

Mühazirə sonrası test

Təkrarlayın və özünüz öyrənin

Biz bu dərsdə qida maddələri üçün tövsiyə sisteminin yaradılmasına səthi toxunsaq da, ML tətbiqlərinin bu sahədə töhvələri çox zəngindir. Bu sistemlərin necə qurulduğu haqqında daha ətraflı oxuyun:

Tapşırıq

Yeni tövsiyyə sistemi yaradın

14 KiB Raw Blame History Unescape Escape