Szállítási adatok megjelenítése a Google Térképpel: 6 lépés

2025 Szerző: John Day | [email protected]. Utoljára módosítva: 2025-01-23 14:48

A kerékpározás során általában különféle adatokat szeretnénk rögzíteni, ezúttal az új Wio LTE -t használtuk nyomon követésükhöz.

1. lépés: A projektben használt dolgok

Hareware komponensek

• Wio LTE EU verzió v1.3- 4G, Cat.1, GNSS, Espruino kompatibilis
• Grove - fülcsipeszes pulzusmérő
• Grove - 16 x 2 LCD (fekete -sárga)

Szoftveralkalmazások és online szolgáltatások

• Arduino IDE
• PubNub Publish/Subscribe API
• Google térkép

2. lépés: Történet

3. lépés: Hardvercsatlakozás

Telepítse a GPS- és LTE -antennákat a Wio LTE -hez, és csatlakoztassa a SIM -kártyát. Csatlakoztassa a fülcsipeszes pulzusmérőt és a 16x2 LCD-t a Wio LTE D20 és I2C portjához.

A fülcsipeszes pulzusmérőt más, tetszés szerinti érzékelőre cserélheti. Kérjük, olvassa el a cikk végét.

4. lépés: Webkonfiguráció

1. rész: PubNub

Kattintson ide, jelentkezzen be vagy regisztráljon egy PubNub-fiókot, a PubNub valós idejű adatok térképre történő továbbítására szolgál.

Nyissa meg a Demo projektet a PubNub adminisztrációs portálján, és megjelenik egy közzétételi kulcs és egy feliratkozási kulcs, emlékezzen rájuk a szoftver programozáshoz.

2. rész: Google térkép

Kérjük, kövesse itt a Google Térkép API -kulcs beszerzését, amelyet a szoftverprogramozásban is használni fognak.

5. lépés: Szoftverprogramozás

1. rész: Wio LTE

Mivel a Wio LTE számára nincs PubNub -könyvtár, az adatokat HTTP -kérésből küldhetjük el, lásd: PubNub REST API Document.

Ha HTTP -kapcsolatot szeretne létrehozni a Wio LTE -ben összekapcsolt SIM -kártyáján keresztül, először állítsa be az APN -t, ha ezt nem tudja, lépjen kapcsolatba mobilszolgáltatóival.

Ezután állítsa be a PubNub közzétételi kulcsot, az előfizetési kulcsot és a csatornát. Az itt található csatorna a megjelenítők és az előfizetők megkülönböztetésére szolgál. Például itt használjuk a csatorna kerékpárt, a csatornabicikli összes előfizetője megkapja az általunk közzétett üzeneteket.

A fenti beállításokat nem csomagoltuk az osztályban, így könnyebben módosíthatja őket a bike.ino -ban, ezeket a kódokat a cikk végéről töltheti le.

2. rész: PubNub

Nyomja meg és tartsa lenyomva a Boot0 gombot a Wio LTE -ben, csatlakoztassa a számítógéphez USB -kábellel, töltse fel a programot Arduino IDE -ben, nyomja meg a Reset gombot a Wio LTE -ben.

Ezután nyissa meg a PubNub alkalmazást, kattintson a Hibakereső konzol elemre a Demo Projectben, töltse ki csatornája nevét az Alapértelmezett csatorna mezőben, majd kattintson az Ügyfél hozzáadása elemre.

Amikor a konzolon az [1, "Előfizetett", "kerékpár"] jelenik meg, az előfizető sikeresen hozzáadva. Várjon egy kicsit, és látni fogja, hogy a Wio LTE adatok megjelennek a konzolon.

3. rész: Google térkép

Az ENO Maps valós idejű térképek PubNub-mal és MapBox-szal, használható a PubNub és a Google Map számára is, letöltheti a GitHub-ról.

Egyszerűen használhatja a google-draw-line.html nevű példát a példák mappában, csak módosítsa a közzétételi kulcsot, az előfizetési kulcsot, a csatornát és a Google kulcsot a 29., 30., 33. és 47. sorban.

FIGYELEM: Kérjük, írja be a 42. sort, különben szimulációs adatokat küld a PubNub -nak.

Ha a pulzusdiagramot a jobb alsó sarokban szeretné megjeleníteni, akkor használhatja a Chart.js fájlt, amely letölthető a webhelyéről, behelyezhető az ENO Maps gyökérmappájába, és beilleszthető a google-draw-line.html fejlécébe..

És adjon hozzá egy vásznat div -ben a diagram megjelenítéséhez:

Ezután hozzon létre két tömböt a diagramadatok megőrzésére

//… var chartLabels = new Array (); var chartData = új tömb (); //…

Közülük a chartLabels a helyadatok, a chartData a pulzusadatok tárolására szolgál. Amikor üzenetek érkeznek, küldjön nekik új adatokat, és frissítse a diagramot.

//… var map = eon.map ({üzenet: függvény (üzenet, időzítés, csatorna) {//… chartLabels.push (obj2string (üzenet [0].latlng)); chartData.push (üzenet [0].data); var ctx = document.getElementById ("chart"). getContext ('2d'); var chart = new Chart (ctx, {type: 'line', data: {labels: chartLabels, datasets: [{label: " Pulzusszám ", adatok: chartData}]}}); //…}});

Minden kész. Próbáld meg legközelebb biciklizni.

6. lépés: Hogyan kell dolgozni más érzékelőkkel?

A Wio LTE programjában egy vagy több egyéni adatot is megjeleníthet a diagramban, vagy több műveletet is elvégezhet. A következő cikk bemutatja, hogyan módosíthatja a programot annak elérése érdekében.

Az első dolog, amit tudnia kell, az, hogy a json-t, amelyet közzé szeretne tenni a PubNub-ban, url-kódolásúnak kell lennie. A kódolt json keményen kódolt a BikeTracker osztályban, így néz ki:

%% 5b %% 7b %% 22latlng %% 22 %% 3a %% 5b%f %% 2c%f %% 5d %% 2c %% 22data %% 22 %% 3a%d %% 7d %% 5d

Könnyű tehát egyetlen egyéni adatot felvenni, vagy url-kódoló eszközökkel saját kódolt json-t készíthet több adat felvételéhez.

Ezúttal az I2C High Accracy Temp & Humi Grove -t próbáljuk használni a Heart Rate Grove helyett. Mivel az LCD Grove is I2C -t használ, mi egy I2C Hub segítségével kapcsoljuk össze a Temp & Humi Grove -t és az LCD Grove -t a Wio LTE -vel.

Ezután vegye be a fejfájlt a BickTracker.h fájlba, és adjon hozzá egy változót és egy módszert a BikeTracker osztályhoz a hőmérséklet tárolásához és méréséhez.

/// BikeTracker.h

//… #include "Seeed_SHT35.h" osztályú alkalmazás:: BikeTracker: application:: interface:: IApplication {//… védett: //… SHT35 _sht35; úszó _hőmérséklet; //… void MeasureTemperature (void); } /// BikeTracker.cpp //… // BikeTracker:: BikeTracker (void) //: _ethernet (Ethernet ()), _gnss (GNSS ()) {} // 21 az SCL BikeTracker:: BikeTracker (void): _ethernet (Ethernet ()), _gnss (GNSS ()), _sht35 (SHT35 (21)) {} //… void BikeTracker:: meetTemperature (void) {úszóhőmérséklet, páratartalom; if (_sht35.read_meas_data_single_shot (HIGH_REP_WITH_STRCH, & hőmérséklet és páratartalom) == NO_ERROR) {_temperature = hőmérséklet; }} //…

Ha szeretné, megváltoztathatja az LCD kijelzőjét Loop () módszerrel:

// sprintf (2. sor, "Pulzusszám: %d", _heartRate);

MeasureTemperature (); sprintf (2. sor, "Hőmérséklet: %f", _hőmérséklet);

De hogyan kell közzétenni a PubNubban? Meg kell változtatnia a kódolt json és sprintf () függvény paramétereit a PublishToPubNub () metódusban, így nézzen ki:

// sprintf (cmd, "GET/közzététel/%s/%s/0/%s/0/%% 5b %% 7b %% 22latlng %% 22 %% 3a %% 5b%f %% 2c%f% %5d %% 2c %% 22data %% 22 %% 3a%d %% 7d %% 5d? Store = 0 HTTP/1.0 / n / r / n / r ", // _publishKey, _subscribeKey, _channel, _latitude, _longitude, _heartRate); sprintf (cmd, "GET/közzététel/%s/%s/0/%s/0/%% 5b %% 7b %% 22latlng %% 22 %% 3a %% 5b%f %% 2c%f %% 5d %% 2c %% 22data %% 22 %% 3a%f %% 7d %% 5d? Store = 0 HTTP/1.0 / n / r / n / r ", _publishKey, _subscribeKey, _channel, _latitude, _longitude, _temperature);

Ezután láthatja a hőmérsékletet a PubNub hibakeresési konzolban.