Használja az agyat .js egy neurális hálózat létrehozásához

Sep 14, 2025

kézikönyv

(Kép hitel: getty képek)

A Brain.js fantasztikus módja egy neurális hálózat kialakításához. Egyszerűen fogalmazva, a neurális hálózat olyan módszer, amely olyan gépi tanulás, amely hasonló módon működik az emberi agyhoz. Tekintettel a helyes válaszra egy kérdésre (mint például "Melyik opció lesz ezt a felhasználót?"), Lassan megtudja a bemenetek és válaszok közötti mintát és kapcsolatot. A neurális hálózat egyik példája a Facebook arcfelismerő rendszere, deepface.

De a neurális hálózatok összetett domain nyelvének és a látszólag meredek tanulási görbének köszönhetően nehéz lehet elindítani.

Ebben a bemutatóban desztilláljuk az elméletet, hogy szükség van-e-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-to-dagadt. Végre van egy webes alkalmazás, amely több választási kérdéseket tesz fel a felhasználó optimizmusával kapcsolatban. Amikor beadják, ezek a válaszok neurális hálózatot képeznek a felhasználók valószínűségére, hogy kiválasztják az egyes opciókat egy teljesen új kérdésre.

Szeretne több hasznos webes tervezési eszközöket? Lásd a Postunkat a tökéletes kiválasztáskor weboldal építője . Vagy ha valahol szükség van a fájlok biztonságos tárolására, nézd meg a legjobb választásunkat felhő tároló . Komplex webhely tervezése? Robusztusra lesz szükséged web hosting szolgáltatás, amely lépést tarthat.

Töltse le a szükséges fájlokat.

01. Állítsa be a projektet

Először töltse le és telepítse a szükséges függőségeket. Ez a bemutató feltételezi, hogy a reagálási ismeretekkel rendelkezik, vagy az előnyös alternatíva egyenértékű leképezése.

Hozzon létre egy reaktív alkalmazást a kívánt módszerrel. Megpróbálhatja a Facebook-ot létrehozott-reagáló alkalmazás Szerszám, a következők használatával telepítve:

npm install create-react-app -g

02. Indítsa el az alkalmazását

Most építhetünk, telepíthetjük az agyat.js, és indíthatjuk alkalmazásunkat:

 NPX Create-React-App Optimism-Nn
CD Optimism-Nn
npm Install Brainjs
NPM START

A böngészőben a neurális hálózati számításokat fogjuk elvégezni. A neurális hálózatok erőforrás-intenzívek, és kiszolgálót kell kitölteni. Azonban így van gyorsan felállítani és finom az alapvető igényeinkért. Most adjunk hozzá agyunkat a belépési pontunkhoz (az én esetemben, app.js).

 Az agy behozatala az "agyból";

03. Határozza meg képzési kérdéseit

brains.js neural network — Neurális hálózatunk vizualizálása. A bemenetek az egyes lehetőségek optimizmusából származnak. Ezeket ezután a rejtett réteg manipulálja, hogy megadja nekünk a kívánt kimeneteket - az egyes opciók valószínűsége (Kép hitel: harry szürke)

Meg kell határoznunk a következő képzési kérdéseket. Különállóan kérdések.js fájl, szükségünk lesz egy KépzésQquestions és validationquestions sor. Megtalálhatja a listámat a git repo-ről, vagy létrehozhatja sajátját. Minél több képzési kérdésed van, annál pontosabb az eredmények. Ne feledje, hogy importálja ezeket a belépési pontba.

 Export Const Everserquestions = [
  {
    ID: 'Q1',
    Kérdés: "Gyakran látja a legjobbat a dolgokban?",
    lehetőségek: [
      {ID: 'Q1A', Címke: "Nem igazán", érték: 0,2,},
      {ID: 'q1b', címke: 'mindig', érték: 1.0,},
      {ID: 'q1c', Label: 'Általában, igen', érték: 0,7,},
      {ID: 'Q1D', Label: 'Soha!', Érték: 0,0,},
    ],
  },
];

Mindkét tömbök esetében szükségünk van egy kérdésre, egy sor négy opcióra, amely tartalmaz egy címkét és optimizmus értékét. Ez az érték lesz a neurális hálózatunk bemenete.

Győződjön meg róla, hogy megváltoztatja az értékek megrendelését és egyensúlyát, vagy a neurális hálózat túlságosan összpontosíthat a tömbbeállítások indexére! Neurális hálózatunk négy bemenetet vesz igénybe, és négy kimenetet ad. Képzési adatai meg kell egyeznie ezt, így a konstruktorunkban szükségünk van valamilyen állapotra a kvíz és a felhasználó lehetőségeinek:

 this.State = {
  Trainanswerswers: TrainingQuestions.map (() = & gt; tömb (4) .fill (0)),
  Képzés: hamis,
  Előrejelzések: meghatározatlan,
};

04. A neurális hálózat inicializálása

Inicializálásától trainingAnswers egy tömböt hoz létre minden egyes kérdésre, amely [0, 0, 0, 0] - az alapértelmezett állapotban nincs választása. Mi is kell inicializálnunk neurális hálózatunkat - csak egy vonalat a Brain.js:

 this.net = új agy.NeuralNetwork ({HiddenLayers: });

05. Építsd meg a kvíz keretét

A kvízünk kereteinek felépítése, szükségünk van a képzési kérdésekre és lehetőségünkre. Ez meglehetősen verbose, és nem túl érdekes, ezért példát adok neked, hogy célozzon, hogy:

 render () {
  Visszatérés (
    & lt; fő & gt;
      & lt; forma onsubmit = {this.onsubmit} & gt;
        [. . .] // Iterálja a kérdéseket & amp; lehetőségek
        & lt; div osztálynév = "Kérdés" & gt;
          & lt; h4 & gt; {kérdés} & lt; / h4 & gt;
          & lt; div osztálynév = "Opciók" & gt;
            & lt; címke htmlfor = {opcionális} & gt;
              & lt; span & gt; {címke} & lt; / span & gt;
              & lt; bemenet
                Típus = "Rádió"
                kívánt
                NAME = {QUESESID}
                id = {opcionális}
                ellenőrzött = {() = & gt; ez.isoptionChecked (kérdőjel, opciósindex)}
                onchange = {() = & gt; this.OntionChange (kérdőjel, opciósindex)}
              / & gt;
            & lt; / Label & gt;
            [. . .]
          & lt; / div & gt;
        & lt; / div & gt;
        [. . .]
        & lt; gomb típusa = "Küldés" & gt; Küldés & lt; / gomb és gt;
    & lt; / form & gt;
    & lt; / fő & gt;
  );
}

Ha új, hogy reagálj, lásd a dokumentáció építési formákhoz.

Megírhatjuk a miénk isoptionchecked és OnOptionMange Funkciók Következő:

 IsoptionChecked = (kérdőjel, opciósindex) = & gt; (
  this.State.trainanswers [Kérdésindex] [Optionindex]! == 0
);
OnOptionChange = (kérdőjel, opciósindex) = & gt; {
  ez.enstate (prevState = & gt; {
    CONST {Trackeranswers} = object.assign (prevstate, {});
    Trackeranswers [Kérdésindex] = tömb (4) .fill (0);
    Trackeranswerswers [Kérdésindex] [OptionInDex] = 1;
    Visszatérés {Trackeranswers};
  });
};

06. A neurális hálózat képzése

Most, amikor a felhasználóunk egy opcióra kattint, frissítjük a relevánsokat tréningekwerswers tömb a 1 A kiválasztott indexben, és módosítsa a rádiógomb állapotát, hogy ellenőrizze.

Ideje hozzáadásához onsubmit Funkció, ahol felépítjük a képzési adatokat és a neurális hálózat képzését:

 onsubmit = e = & gt; {
    e.preventdefault ();
    CONST {Trackeranswers} = ez.State;
    const edződata = képzésQquestions.map ((q, i) = & gt; ({
      INPUT: Q.OPTIONS.MAP (O = & GT; O.VALUE),
      Kimenet: Trackeranswers [I],
    });
    ez.enstate ({
      Képzés: Igaz,
    });
    this.net.trainasync (TrainingData)
      .hen (res = & gt; {
        konzol.log (res); // naplózza a hibaarányt és a # iterációkat
        this.getpredictions ()
      });
  }

Áthárít KépzésQquestions , létrehozzuk a szükséges bemeneti és kimeneti tömböket. A bemeneti adatokat az egyes opciók optimizmusának értékével kapjuk meg, és a kimeneti adatokat a tréningekwerswers tömb ugyanazon az indexben, mint a kérdés.

Ezt követően frissítjük az államot Képzés: igaz hogy tájékoztassa a felhasználót, hogy a neurális hálózat tanul. Az ügyféleszköz feldolgozási erejétől és hány kérdéstől függően a folyamat másodpercek, percek vagy hosszabb ideig tarthat!

Végül átadjuk a képzési adatokat a neurális hálózatunknak, és elmondani, hogy aszinkronon vonzza. Ez egy ígéretet hoz létre, amely teljesül, ha a hálózat megtalálta a mintát, vagy feladta.

Tartsa szemmel a hibaarányt trainasync . Ideális esetben 0 - 0,05 között kell lennie. Ha magasabb, ellenőrizze a képzési adatait.

Innen kaphatjuk előrejelzéseinket:

 GetPredictions = () = & gt; {
  CONST Pryjelzések = validationquestions.map (q = & gt; (
    this.net.run (Q.Options.map (o = & gt; o.value)))
  ));

  ez.enstate ({
    Képzés: hamis,
    előrejelzések,
  });
}

Használ net.run , felkérjük az újonnan képzett idegi hálózatunkat, hogy adjon nekünk előrejelzéseket a korábban meghatározott validációs kérdésekre.

A Grand Finale számára hozzáadunk feltételes betöltési logikát, és megtaláljuk a felhasználót.

Vakol() {
    CONST {képzés, előrejelzések} = ez.State;
    CONSTRALDATIONQUESTION = validationquestions ;
    Visszatérés (
      & lt; fő & gt;
        {Képzés & amp; & amp; (
          & lt; h2 & gt; betöltés ... & lt; / h2 & gt;
        )}
        {! Előrejelzések & amp; & amp; ! Képzés & amp; & amp; (
           [. . .] // képzési kérdések formája
        )}

        {előrejelzések és amp; & amp; ! Képzés & amp; & amp; (
          & lt; div & gt;
            & lt; h2 & gt; Megkérdeztük a neurális hálózatot: & lt; / h2 & gt;
            & lt; div osztálynév = "Kérdés" & gt;
              & lt; h4 & gt; {validationquestion.question} & lt; / h4 & gt;
              & lt; div osztálynév = "Opciók" & gt;
                {validationquestion.options.map ((o, i) = & gt; (
                  & lt; címke gomb = {o.id} & gt;
                    {/ * Megjeleníti a címkét és a valószínűséget, mint kerek százalék * /}
                    & lt; span & gt; {$ {o.label}: $ {math.round (előrejelzések  [i] * 100)}%} & lt; / span & gt;
                 & lt; / Label & gt;
                )))}
              & lt; / div & gt;
            & lt; / div & gt;
          & lt; / div & gt;
        )}
      & lt; / fő & gt;
    );
  }
}

07. Húzza ki a hálózatot

Most rendelkezik a kvíz alapvető kereteivel, próbálja meg kiterjeszteni azt a következőkkel:

Keresse meg az ideghálózat valódi hibaarányát azáltal, hogy a felhasználó válaszol az érvényesítési kérdéseire. Nézze meg, hányszor választották a legjobb találgatást.

A neurális hálózatot a további válaszokkal vonja le, és nézze meg, hogy javíthatja-e a pontosságot.

Mozgassa a neurális hálózati számításokat egy csomópont-kiszolgálóra az agymal funkcionálni, működtetni() és Tojson () mód.

Ez a cikk eredetileg a 321-es kérdésben jelent meg net magazin , a világ vezető webdesign magazinja. Vásárlás probléma 321 vagy Feliratkozás a netre .

Olvass tovább:

A legjobb JavaScript könyvtárak
9 a legjobb JavaScript keretrendszerek közül
22 ragyogó jquery plugins

Használja az agyat .js egy neurális hálózat létrehozásához

01. Állítsa be a projektet

02. Indítsa el az alkalmazását

03. Határozza meg képzési kérdéseit

04. A neurális hálózat inicializálása

05. Építsd meg a kvíz keretét

06. A neurális hálózat képzése

07. Húzza ki a hálózatot

kézikönyv - Most Popular Articles

Vizuális fejlesztési tippek: Mondja el a történetet a műveivel

A GLITCH szöveg és képhatások létrehozása CSS-ben

Hogyan építsünk egy AR alkalmazást

Add hozzá vibráció az olajfestményeket ezekkel a felső tippekkel

3D szöveges bemutató grafikus tervezők számára

A képek kompozíciójának végső útmutatója a Photoshopban

A 3D-s ventilátor művészet mestere

Hogyan kell felhívni Harley Quinn

Kategóriák