การแสดงข้อมูลการขนส่งด้วย Google Map: 6 ขั้นตอน
การแสดงข้อมูลการขนส่งด้วย Google Map: 6 ขั้นตอน
Anonim
การแสดงข้อมูลการขนส่งด้วย Google Map
การแสดงข้อมูลการขนส่งด้วย Google Map

โดยปกติเราต้องการบันทึกข้อมูลต่างๆ ระหว่างการขี่จักรยาน คราวนี้เราใช้ Wio LTE ใหม่เพื่อติดตาม

ขั้นตอนที่ 1: สิ่งที่ใช้ในโครงการนี้

ส่วนประกอบ Hareware

  • Wio LTE รุ่น EU v1.3- 4G, Cat.1, GNSS, Espruino Compatible
  • Grove - เซนเซอร์วัดอัตราการเต้นหัวใจแบบหนีบหู
  • Grove - 16 x 2 LCD (สีดำบนพื้นเหลือง)

แอพซอฟต์แวร์และบริการออนไลน์

  • Arduino IDE
  • PubNub เผยแพร่/สมัครสมาชิก API
  • Google Maps

ขั้นตอนที่ 2: เรื่องราว

Image
Image

ขั้นตอนที่ 3: การเชื่อมต่อฮาร์ดแวร์

การกำหนดค่าเว็บ
การกำหนดค่าเว็บ

ติดตั้งเสาอากาศ GPS และ LTE กับ Wio LTE แล้วเสียบซิมการ์ดของคุณ เชื่อมต่อเซ็นเซอร์วัดอัตราการเต้นของหัวใจแบบหนีบหูและ LCD ขนาด 16x2 กับพอร์ต D20 และ I2C ของ Wio LTE

คุณสามารถเปลี่ยนเซนเซอร์วัดอัตราการเต้นหัวใจแบบคลิปหนีบหูเป็นเซนเซอร์อื่นๆ ที่คุณชอบได้ โปรดดูที่ส่วนท้ายของบทความนี้

ขั้นตอนที่ 4: การกำหนดค่าเว็บ

ตอนที่ 1: PubNub

คลิกที่นี่ เข้าสู่ระบบหรือลงทะเบียนบัญชี PubNub PubNub ใช้เพื่อส่งข้อมูลแบบเรียลไทม์ไปยังแผนที่

เปิดโครงการสาธิตใน PubNub Admin Portal คุณจะเห็น Publish Key และ Subscribe Key จดจำไว้สำหรับการเขียนโปรแกรมซอฟต์แวร์

ส่วนที่ 2: Google Map

โปรดติดตามที่นี่เพื่อรับคีย์ Google Map API ซึ่งจะใช้ในการเขียนโปรแกรมซอฟต์แวร์ด้วย

ขั้นตอนที่ 5: การเขียนโปรแกรมซอฟต์แวร์

การเขียนโปรแกรมซอฟต์แวร์
การเขียนโปรแกรมซอฟต์แวร์

ส่วนที่ 1: Wio LTE

เนื่องจากไม่มีไลบรารี PubNub สำหรับ Wio LTE เราจึงสามารถส่งข้อมูลของเราจากคำขอ HTTP โปรดดูเอกสาร PubNub REST API

หากต้องการเชื่อมต่อ HTTP ผ่านซิมการ์ดที่เสียบใน Wio LTE คุณควรตั้งค่า APN ก่อน หากคุณไม่ทราบ โปรดติดต่อผู้ให้บริการมือถือของคุณ

จากนั้นตั้งค่า PubNub Publish Key, Subscribe Key และ Channel ของคุณ ช่องนี้ใช้เพื่อแยกความแตกต่างระหว่างผู้จัดพิมพ์และสมาชิก ตัวอย่างเช่น เราใช้แชนเนลไบค์ที่นี่ ผู้ติดตามทั้งหมดในแชนเนลไบค์จะได้รับข้อความที่เราเผยแพร่

การตั้งค่าข้างต้น เราไม่ได้บรรจุในชั้นเรียน เพื่อให้คุณสามารถแก้ไขใน bike.ino ได้ง่ายขึ้น คุณสามารถดาวน์โหลดรหัสเหล่านี้ได้จากท้ายบทความนี้

ตอนที่ 2: PubNub

กดปุ่ม Boot0 ใน Wio LTE ค้างไว้ เชื่อมต่อกับคอมพิวเตอร์ผ่านสาย USB อัปโหลดโปรแกรมใน Arduino IDE กดปุ่มรีเซ็ตใน Wio LTE

จากนั้นไปที่ PubNub คลิก Debug Console ในโครงการสาธิต กรอกชื่อช่องของคุณใน Default Channel คลิก Add Client

เมื่อคุณเห็น [1, "สมัครรับข้อมูล", "จักรยาน"] ในคอนโซล แสดงว่าเพิ่มสมาชิกสำเร็จแล้ว รอสักครู่ คุณจะเห็นข้อมูล Wio LTE ปรากฏในคอนโซล

ส่วนที่ 3: Google Map

แผนที่ ENO เป็นแผนที่แบบเรียลไทม์กับ PubNub และ MapBox นอกจากนี้ยังสามารถใช้กับ PubNub และ Google Map ได้อีกด้วย คุณสามารถดาวน์โหลดได้จาก GitHub

คุณสามารถใช้ตัวอย่างชื่อ google-draw-line.html ในโฟลเดอร์ตัวอย่าง เพียงแค่แก้ไข Publish Key, Subscribe Key, Channel และ Google Key ในบรรทัดที่ 29, 30, 33 และ 47

ข้อสังเกต: โปรดแสดงความคิดเห็นบรรทัดที่ 42 มิฉะนั้นระบบจะส่งข้อมูลการจำลองไปยัง PubNub ของคุณ

หากคุณต้องการแสดงแผนภูมิอัตราการเต้นของหัวใจที่ด้านล่างขวาของโคเอนเนอร์ คุณสามารถใช้ Chart.js ซึ่งสามารถดาวน์โหลดได้จากเว็บไซต์ วางไว้ในโฟลเดอร์รากของ ENO Maps และรวมไว้ในส่วนหัวของ google-draw-line.html.

และเพิ่มผืนผ้าใบใน div เพื่อแสดงแผนภูมิ:

จากนั้นสร้างสองอาร์เรย์เพื่อเก็บข้อมูลแผนภูมิ

// … var chartLabels = new Array(); var chartData = อาร์เรย์ใหม่ (); // …

ในหมู่พวกเขา chartLabels ใช้เพื่อเก็บข้อมูลตำแหน่ง chartData ใช้เพื่อเก็บข้อมูลอัตราการเต้นของหัวใจ เมื่อมีข้อความเข้ามา ให้พุชข้อมูลใหม่ไปที่ข้อความนั้น แล้วรีเฟรชแผนภูมิ

// … var map = eon.map ({ ข้อความ: ฟังก์ชั่น (ข้อความ, โทเค็นเวลา, ช่อง) { // … chartLabels.push (obj2string (ข้อความ [0].latlng)); chartData.push (ข้อความ [0]. ข้อมูล); var ctx = document.getElementById("chart")).getContext('2d'); var chart = new Chart(ctx, { type: 'line', data: { labels: chartLabels, datasets: [{ label: " อัตราการเต้นของหัวใจ", data: chartData }] } }); // … } });

ทุกอย่างเสร็จเรียบร้อย. คราวหน้าลองเอาไปปั่นจักรยานดู

ขั้นตอนที่ 6: วิธีทำงานกับ Sensor Grove อื่น ๆ อย่างไร

ในโปรแกรมของ 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

// … #include "Seeed_SHT35.h" class application::BikeTracker: application::interface::IApplication { // … ป้องกัน: // … SHT35 _sht35; ลอย _อุณหภูมิ; // … โมฆะ MeasureTemperature(โมฆะ); } /// BikeTracker.cpp // … // BikeTracker::BikeTracker(void) //: _ethernet(Ethernet()), _gnss(GNSS()) { } // 21 คือหมายเลขพิน SCL BikeTracker::BikeTracker(โมฆะ): _ethernet(Ethernet()), _gnss(GNSS()), _sht35(SHT35(21)) { } // … void BikeTracker::measureTemperature(void) { อุณหภูมิลอย ความชื้น; ถ้า (_sht35.read_meas_data_single_shot (HIGH_REP_WITH_STRCH, &อุณหภูมิ, &ความชื้น) == NO_ERROR) { _temperature = อุณหภูมิ; } } // …

คุณสามารถเปลี่ยนการแสดงผลของ LCD ในวิธี Loop() ได้หากต้องการ:

// sprintf(line2, "อัตราการเต้นของหัวใจ: %d", _heartRate);

วัดอุณหภูมิ(); sprintf(line2, "อุณหภูมิ: %f", _temperature);

แต่จะเผยแพร่ไปยัง 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

// _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