Съдържание:

Визуализация на транспортни данни с Google Map: 6 стъпки
Визуализация на транспортни данни с Google Map: 6 стъпки

Видео: Визуализация на транспортни данни с Google Map: 6 стъпки

Видео: Визуализация на транспортни данни с Google Map: 6 стъпки
Видео: planeTALK | Philip PLANTHOLT, VP Flightradar24 "The Facebook of Aviation" (С субтитрами) 2024, Юли
Anonim
Визуализация на транспортни данни с Google Map
Визуализация на транспортни данни с Google Map

Обикновено искаме да записваме различни данни по време на колоездене, този път използвахме нов Wio LTE, за да ги проследим.

Стъпка 1: Нещата, използвани в този проект

Компоненти за прибори

  • Wio LTE EU версия v1.3- 4G, Cat.1, GNSS, Espruino съвместими
  • Grove - Сензор за сърдечен ритъм в ухото
  • Grove - 16 x 2 LCD (черно върху жълто)

Софтуерни приложения и онлайн услуги

  • Arduino IDE
  • PubNub API за публикуване/абониране
  • Google Maps

Стъпка 2: История

Image
Image

Стъпка 3: Хардуерна връзка

Уеб конфигурация
Уеб конфигурация

Инсталирайте GPS и LTE антени към Wio LTE и включете вашата SIM карта към нея. Свържете сензора за сърдечен ритъм с ухо и 16x2 LCD към порта на Wio LTE D20 и I2C.

Можете да промените сензора за пулс за ухото на други сензори, които харесвате. Моля, вижте края на тази статия.

Стъпка 4: Уеб конфигурация

Част 1: PubNub

Щракнете тук, за да влезете или да регистрирате акаунт в PubNub, PubNub се използва за предаване на данни в реално време на картата.

Отворете демонстрационния проект в Admin Portal на PubNub, ще видите ключ за публикуване и ключ за абонамент, запомнете ги за софтуерно програмиране.

Част 2: Google Map

Моля, следвайте тук, за да получите ключ за API на Google Map, той ще се използва и при програмиране на софтуер.

Стъпка 5: Софтуерно програмиране

Софтуерно програмиране
Софтуерно програмиране

Част 1: Wio LTE

Тъй като няма библиотека PubNub за Wio LTE, можем да изпращаме данните си от HTTP заявка, вижте PubNub REST API документ.

За да направите HTTP връзка чрез вашата SIM карта, включена в Wio LTE, първо трябва да зададете своя APN, ако не знаете това, моля, свържете се с мобилните си оператори.

След това задайте своя PubNub ключ за публикуване, ключ за абониране и канал. Тук каналът се използва за разграничаване на издатели и абонати. Например, тук използваме канал bike, всички абонати в channel bike ще получават съобщения, които сме публикували.

Горните настройки не сме опаковани в клас, за да можете да ги променяте в bike.ino по -лесно, можете да изтеглите тези кодове от края на тази статия.

Част 2: PubNub

Натиснете и задръжте клавиша Boot0 в Wio LTE, свържете го с компютъра си чрез USB кабел, качете програмата в Arduino IDE, натиснете клавиша Reset в Wio LTE.

След това се обърнете към PubNub, щракнете върху Debug Console в Demo Project, попълнете името на канала си в Channel Default, щракнете върху Add Client.

Когато видите [1, „Абониран“, „велосипед“] в конзолата, абонатът беше добавен успешно. Изчакайте известно време, ще видите Wio LTE данни да се появяват в конзолата.

Част 3: Google Map

ENO картите са карти в реално време с PubNub и MapBox, могат да се използват и за PubNub и Google Map, можете да ги изтеглите от GitHub.

Можете просто да използвате пример, наречен google-draw-line.html в папката с примери, просто да промените Публикуване на ключ, Ключ за абонамент, Канал и Ключ на Google в редове 29, 30, 33 и 47.

ЗАБЕЛЕЖКА: Моля, коментирайте ред 42 или той ще изпрати симулационни данни към вашия PubNub.

Ако искате да покажете диаграма на сърдечната честота в долния десен коефициент, можете да използвате Chart.js, тя може да бъде изтеглена от нейния уебсайт, да я поставите в основната папка на ENO Maps и да я включите в главата на google-draw-line.html.

И добавете платно в div за показване на диаграма:

След това създайте два масива, за да съхранявате данните от диаграмата

//… var chartLabels = нов Array (); var chartData = нов масив (); //…

Сред тях, chartLabels се използва за съхраняване на данни за местоположението, chartData се използва за съхраняване на данни за сърдечната честота. Когато съобщенията дойдат, изпратете им нови данни и опреснете диаграмата.

//… var map = eon.map ({message: function (message, timetoken, channel) {//… chartLabels.push (obj2string (message [0].latlng)); chartData.push (message [0].data); var ctx = document.getElementById ("диаграма"). getContext ('2d'); var chart = нова диаграма (ctx, {тип: 'ред', данни: {labels: chartLabels, набори от данни: [{label: " Сърдечна честота ", данни: chartData}]}}); //…}});

Готово. Опитайте се да го вземете с велосипеда следващия път.

Стъпка 6: Как да работите с други сензорни горички?

В програмата на Wio LTE можете да вземете една или повече персонализирани данни за показване в диаграма или да направите повече. Следващата статия показва как да промените програмата, за да я постигнете.

Първото нещо, което трябва да знаете, е, че json, който искате да публикувате в PubNub, трябва да бъде кодиран с url. Кодираният json е твърдо кодиран в клас BikeTracker, изглежда така:

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

Така че е лесно да вземете една персонализирана информация или можете да използвате инструменти за кодиране на url, за да направите свой собствен кодиран json, за да вземете повече данни.

Този път се опитваме да използваме I2C High Accracy Temp & Humi Grove за замяна на Heart Rate Grove. Тъй като LCD Grove също използва I2C, ние използваме I2C Hub за свързване на Temp & Humi Grove и LCD Grove към Wio LTE.

След това включете файла head към BickTracker.h и добавете променлива и метод към клас BikeTracker за съхраняване и измерване на температурата.

/// BikeTracker.h

//… #включва приложение „Seeed_SHT35.h“клас:: BikeTracker: application:: interface:: IApplication {//… защитено: //… SHT35 _sht35; поплавък _температура; //… void MeasureTemperature (void); } /// BikeTracker.cpp //… // BikeTracker:: BikeTracker (void) //: _ethernet (Ethernet ()), _gnss (GNSS ()) {} // 21 е номерът на SCL пина BikeTracker:: BikeTracker (void): _ethernet (Ethernet ()), _gnss (GNSS ()), _sht35 (SHT35 (21)) {} //… void BikeTracker:: mjeraTemperature (void) {температура на плаване, влажност; if (_sht35.read_meas_data_single_shot (HIGH_REP_WITH_STRCH, & температура, & влажност) == NO_ERROR) {_temperature = температура; }} //…

Ако искате, можете да промените LCD дисплея в метода Loop ():

// sprintf (line2, "Heart Rate: %d", _heartRate);

MeasureTemperature (); sprintf (ред2, "Температура: %f", _температура);

Но как да го публикувам в PubNub? Трябва да промените кодираните параметри на функцията json и sprintf () в метода PublishToPubNub (), нека изглежда така:

// sprintf (cmd, "GET/публикация/%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/публикация/%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);

След това можете да видите температурата в конзолата за отстраняване на грешки в PubNub.

Препоръчано: