Visualização de dados de transporte com o Google Map: 6 etapas

2024 Autor: John Day | [email protected]. Última modificação: 2024-01-30 11:37

Normalmente queremos registrar vários dados durante o ciclismo, desta vez usamos o novo Wio LTE para rastreá-los.

Etapa 1: Coisas usadas neste projeto

Componentes Hareware

• Wio LTE EU versão v1.3- 4G, Cat.1, GNSS, Espruino compatível
• Grove - Sensor de frequência cardíaca com clipe de ouvido
• Grove - LCD 16 x 2 (preto sobre amarelo)

Aplicativos de software e serviços online

• IDE Arduino
• API PubNub Publicar / Assinar
• Google Maps

Etapa 2: História

Etapa 3: Conexão de Hardware

Instale antenas GPS e LTE no Wio LTE e conecte seu cartão SIM a ele. Conecte o sensor de freqüência cardíaca com clipe de ouvido e o LCD 16x2 às portas D20 e I2C do Wio LTE.

Você pode alterar o sensor de freqüência cardíaca com clipe de ouvido para outros sensores de sua preferência. Por favor, veja o final deste artigo.

Etapa 4: Configuração da Web

Parte 1: PubNub

Clique aqui para fazer login ou registrar uma conta PubNub, PubNub é usado para transmitir dados em tempo real para o mapa.

Abra o projeto de demonstração no portal de administração PubNub, você verá uma chave de publicação e uma chave de assinatura, lembre-se delas para programação de software.

Parte 2: Google Map

Siga aqui para obter uma chave de API do Google Map, ela também será usada na programação de software.

Etapa 5: Programação de software

Parte 1: Wio LTE

Como não há biblioteca PubNub para Wio LTE, podemos enviar nossos dados a partir de solicitação HTTP, consulte PubNub REST API Document.

Para fazer uma conexão HTTP através do seu cartão SIM conectado ao Wio LTE, você deve configurar seu APN primeiro, se você não sabe disso, entre em contato com suas operadoras de celular.

Em seguida, defina sua chave de publicação PubNub, chave de assinatura e canal. O canal aqui é usado para diferenciar editores e assinantes. Por exemplo, usamos a bicicleta do canal aqui, todos os assinantes no canal da bicicleta receberão mensagens que publicamos.

As configurações acima, não empacotamos em aula, para que você possa modificá-las no bike.ino mais facilmente, você pode baixar esses códigos no final deste artigo.

Parte 2: PubNub

Pressione e segure a tecla Boot0 no Wio LTE, conecte-o ao seu computador através de um cabo USB, carregue o programa no IDE do Arduino, pressione a tecla Reset no Wio LTE.

Em seguida, vá para PubNub, clique em Debug Console em Demo Project, preencha o nome do seu canal em Default Channel, clique em Add Client.

Quando você vê [1, "Inscrito", "bicicleta"] no console, o Assinante foi adicionado com sucesso. Espere um pouco, você verá os dados Wio LTE aparecerem no console.

Parte 3: Google Map

ENO Maps são mapas em tempo real com PubNub e MapBox, também podem ser usados para PubNub e Google Map, você pode baixá-los de seu GitHub.

Você pode simplesmente usar um exemplo denominado google-draw-line.html na pasta de exemplos, apenas modificar a chave de publicação, chave de assinatura, canal e chave do Google nas linhas 29, 30, 33 e 47.

AVISO: comente a linha 42 ou enviará dados de simulação para seu PubNub.

Se você quiser exibir o gráfico de frequência cardíaca no coener inferior direito, você pode usar Chart.js, ele pode ser baixado de seu site, colocá-lo na pasta raiz do ENO Maps e incluí-lo no google-draw-line.html head.

E adicione uma tela em um div para exibir o gráfico:

Em seguida, crie duas matrizes para manter os dados do gráfico

//… var chartLabels = new Array (); var chartData = new Array (); //…

Entre eles, o chartLabels é usado para manter os dados de localização, o chartData é usado para manter os dados da frequência cardíaca. Quando as mensagens chegarem, envie novos dados a elas e atualize o gráfico.

//… var map = eon.map ({mensagem: função (mensagem, horário, canal) {//… chartLabels.push (obj2string (mensagem [0].latlng)); chartData.push (mensagem [0].data); var ctx = document.getElementById ("chart"). getContext ('2d'); var chart = new Chart (ctx, {type: 'line', data: {labels: chartLabels, datasets: [{label: " Heart Rate ", data: chartData}]}}); //…}});

Tudo feito. Tente levá-lo com sua bicicleta na próxima vez.

Etapa 6: Como trabalhar com outro sensor Grove?

No programa Wio LTE, você pode levar um ou mais dados personalizados para exibir no gráfico ou fazer mais. O seguinte artigo mostra como modificar o programa para alcançá-lo.

A primeira coisa que você precisa saber é se o json que você deseja publicar no PubNub deve ser codificado por url. Json codificado é codificado na classe BikeTracker, tem a seguinte aparência:

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

Portanto, é fácil obter um dado personalizado ou você pode usar ferramentas de codificação de url para criar seu próprio json codificado para obter mais dados.

Desta vez, tentamos usar I2C High Accracy Temp e Humi Grove para substituir o Heart Rate Grove. Como o LCD Grove também usa I2C, usamos um hub I2C para conectar Temp & Humi Grove e LCD Grove ao Wio LTE.

Em seguida, inclua o arquivo head em BickTracker.h e adicione uma varível e um método à classe BikeTracker para armazenar e medir a temperatura.

/// BikeTracker.h

//… #include "Seeed_SHT35.h" class application:: BikeTracker: application:: interface:: IApplication {//… protegida: //… SHT35 _sht35; float _temperature; //… void MeasureTemperature (void); } /// BikeTracker.cpp //… // BikeTracker:: BikeTracker (void) //: _ethernet (Ethernet ()), _gnss (GNSS ()) {} // 21 é o número PIN SCL BikeTracker:: BikeTracker (void): _ethernet (Ethernet ()), _gnss (GNSS ()), _sht35 (SHT35 (21)) {} //… void BikeTracker:: measureTemperature (void) {flutuação temperatura, umidade; if (_sht35.read_meas_data_single_shot (HIGH_REP_WITH_STRCH, & temperatura, & umidade) == NO_ERROR) {_temperatura = temperatura; }} //…

Se desejar, você pode alterar a exibição do LCD no método Loop ():

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

MeasureTemperature (); sprintf (linha2, "Temp:% f", _temperatura);

Mas como publicá-lo no PubNub? Você precisa alterar os parâmetros da função json e sprintf () codificados no método PublishToPubNub (), parecido com este:

// sprintf (cmd, "GET / publicar /% 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 / publicar /% 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, _temperatura);

Então você pode ver a temperatura no console de depuração PubNub.