Sisukord:

Transpordiandmete visualiseerimine Google'i kaardiga: 6 sammu
Transpordiandmete visualiseerimine Google'i kaardiga: 6 sammu

Video: Transpordiandmete visualiseerimine Google'i kaardiga: 6 sammu

Video: Transpordiandmete visualiseerimine Google'i kaardiga: 6 sammu
Video: 交通工具长度对比,最长的竟然是航空母舰的10多倍?#数据可视化 @抖音小助手 2024, Juuli
Anonim
Transpordiandmete visualiseerimine Google'i kaardiga
Transpordiandmete visualiseerimine Google'i kaardiga

Tavaliselt tahame jalgrattasõidu ajal erinevaid andmeid salvestada, seekord kasutasime nende jälgimiseks uut Wio LTE -d.

Samm: selles projektis kasutatud asjad

Hareware komponendid

  • Wio LTE EU versioon v1.3- 4G, Cat.1, GNSS, Espruino ühilduv
  • Grove - kõrvaklambriga pulsisensor
  • Grove - 16 x 2 LCD (must kollasel)

Tarkvararakendused ja võrguteenused

  • Arduino IDE
  • PubNubi avaldamise/tellimise API
  • Google kaardid

2. samm: lugu

Image
Image

Samm: riistvaraühendus

Veebikonfiguratsioon
Veebikonfiguratsioon

Paigaldage Wio LTE -le GPS- ja LTE -antennid ning ühendage sellega SIM -kaart. Ühendage kõrvaklambriga pulsiandur ja 16x2 LCD Wio LTE D20 ja I2C pordiga.

Kõrvaklambriga pulsianduri saate muuta muudeks meelepärasteks. Palun vaadake selle artikli lõppu.

Samm: veebikonfiguratsioon

Osa 1: PubNub

Klõpsake siin, logige sisse või registreerige PubNubi konto, PubNubi kasutatakse reaalajas andmete edastamiseks kaardile.

Avage demoprojekt PubNubi haldusportaalis, näete avaldamisvõtit ja tellimisvõtit, pidage neid tarkvara programmeerimiseks meeles.

2. osa: Google'i kaart

Google'i kaardi API võtme hankimiseks järgige siin. Seda kasutatakse ka tarkvara programmeerimisel.

Samm: tarkvara programmeerimine

Tarkvara programmeerimine
Tarkvara programmeerimine

Osa 1: Wio LTE

Kuna Wio LTE jaoks pole PubNubi teeki, saame oma andmed saata HTTP -päringult, vt PubNub REST API dokument.

HTTP -ühenduse loomiseks Wio LTE -sse ühendatud SIM -kaardi kaudu peaksite esmalt määrama oma APN -i. Kui te seda ei tea, võtke ühendust oma mobiilioperaatoritega.

Seejärel määrake oma PubNubi avaldamisvõti, tellimisvõti ja kanal. Siin olevat kanalit kasutatakse kirjastajate ja tellijate eristamiseks. Näiteks kasutame siin kanalijalgratast, kõik kanalijalgratta tellijad saavad meie avaldatud sõnumeid.

Ülaltoodud seadeid me ei pakkinud klassis, nii et saate neid saidil bike.ino hõlpsamini muuta, saate need koodid selle artikli lõpust alla laadida.

Osa 2: PubNub

Hoidke Wio LTE -s Boot0 -klahvi all, ühendage see USB -kaabli abil arvutiga, laadige programm üles Arduino IDE -s, vajutage Wio LTE -s Reset -klahvi.

Seejärel pöörduge PubNubi poole, klõpsake demoprojektis silumiskonsooli, täitke oma kanali nimi vaikekanalis ja klõpsake nuppu Lisa klient.

Kui näete konsoolis [1, "Tellitud", "jalgratas"], tellija lisamine õnnestus. Oodake mõnda aega, näete konsoolis Wio LTE andmeid.

3. osa: Google'i kaart

ENO Maps on reaalajas kaardid koos PubNubi ja MapBoxiga, seda saab kasutada ka PubNubi ja Google Mapi jaoks, saate selle alla laadida GitHubist.

Näidete kaustas saate lihtsalt kasutada näidet nimega google-draw-line.html, lihtsalt muuta avaldamisvõtit, tellimisvõtit, kanalit ja Google'i võtit ridadel 29, 30, 33 ja 47.

MÄRKUS. Palun kommenteerige rida 42, vastasel juhul saadab see teie PubNubile simulatsiooniandmed.

Kui soovite südame löögisageduse diagrammi kuvada paremas alanurgas, võite kasutada Chart.js-i, selle saab alla laadida oma veebisaidilt, panna selle ENO Mapsi juurkausta ja lisada selle saidile google-draw-line.html.

Ja lisage diagrammile kuvamiseks lõuend divis:

Seejärel looge diagrammi andmete säilitamiseks kaks massiivi

//… var chartLabels = new Massiiv (); var chartData = uus massiiv (); //…

Nende hulgas kasutatakse chartLabelsit asukohaandmete hoidmiseks, chartData kasutatakse südame löögisageduse andmete hoidmiseks. Kui sõnumid tulevad, lisage neile uued andmed ja värskendage diagrammi.

//… var map = eon.map ({sõnum: funktsioon (sõnum, ajakava, kanal) {//… chartLabels.push (obj2string (sõnum [0].latlng))); chartData.push (sõnum [0].andmed); var ctx = document.getElementById ("chart"). getContext ('2d'); var chart = new Chart (ctx, {type: 'line', data: {labels: chartLabels, datasets: [{label: " Südame löögisagedus ", andmed: chartData}]}}); //…}});

Kõik tehtud. Proovige järgmine kord rattaga kaasa võtta.

Samm 6: Kuidas töötada teise anduriga?

Wio LTE programmis saate diagrammil kuvamiseks võtta ühe või mitu kohandatud andmeid või teha rohkem. Järgmine artikkel näitab, kuidas programmi selle saavutamiseks muuta.

Esimene asi, mida peate teadma, on see, et json, mille soovite PubNubis avaldada, peaks olema URL-i kodeeritud. Kodeeritud json on BikeTracker klassis kõvasti kodeeritud, see näeb välja selline:

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

Nii et ühe kohandatud andmete võtmine on lihtne või saate kasutada URL-i kodeerimise tööriistu, et muuta oma kodeeritud json rohkemate andmete võtmiseks.

Seekord proovime südame löögisageduse asendamiseks kasutada I2C High Accracy Temp & Humi Grove'i. Kuna LCD Grove kasutab ka I2C -d, kasutame Temp & Humi Grove ja LCD Grove ühendamiseks Wio LTE -ga I2C jaoturit.

Seejärel lisage peafail saidile BickTracker.h ning lisage BikeTracker klassi muutuja ja meetod temperatuuri salvestamiseks ja mõõtmiseks.

/// BikeTracker.h

//… #include "Seeed_SHT35.h" klassi rakendus:: BikeTracker: application:: interface:: IApplication {//… kaitstud: //… SHT35 _sht35; ujuk _temperatuur; //… void MeasureTemperature (tühine); } /// BikeTracker.cpp //… // BikeTracker:: BikeTracker (void) //: _ethernet (Ethernet ()), _gnss (GNSS ()) {} // 21 on SCL -i PIN -kood BikeTracker:: BikeTracker (void): _ethernet (Ethernet ()), _gnss (GNSS ()), _sht35 (SHT35 (21)) {} //… void BikeTracker:: meetTemperature (void) {ujuki temperatuur, niiskus; if (_sht35.read_meas_data_single_shot (HIGH_REP_WITH_STRCH, & temperatuur ja niiskus) == NO_ERROR) {_temperatuur = temperatuur; }} //…

Kui soovite, saate LCD ekraani muuta Loop () meetodil:

// sprintf (rida2, "Südame löögisagedus: %d", _heartRate);

MeasureTemperature (); sprintf (rida2, "Temp: %f", _temperatuur);

Aga kuidas seda PubNubis avaldada? Peate muutma kodeeritud funktsiooni json ja sprintf () parameetreid PublishToPubNub () meetodis, las see näeb välja selline:

// sprintf (cmd, "GET/avaldamine/%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, "SAA/avalda/%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);

Seejärel näete temperatuuri PubNubi silumiskonsoolis.

Soovitan: