ObnizでGPS情報を取得して、NoodlでGoogle Map上に表示してみた

Last updated at 2019-12-04Posted at 2019-12-04

#パーツライブラリにGPSがあったので、
購入してNoodlとつなげて遊んでみました。
ObnizとNoodlはMQTTブローカー経由でやりとりをしています。

gpsが鼓動を始めた pic.twitter.com/JGLdKqIINY
— はりねずみ麺 (@hedgehog_noodl) November 26, 2019

「Obnizを探す」ボタンをタップすると、Obnizの位置にピンが出ます。 ※画像の座標はダミー

#MQTTブローカーの準備
今回はshiftr.ioを使います。
参考記事:
Noodlでshiftr.ioのMQTTブローカーを経由してIoT機器 obniz と連携するメモ
「まずshiftr.ioでMQTTブローカーをつくる」というところまでやってください。

#Obnizの準備
こちらの記事を参考にしました。
obniz＋GPSで地図上に現在地表示

また、GPSのパーツはコチラから
Obnizパーツライブラリ

下記をコピペしてobnizのプロジェクトに貼り付けます。
ユーザーネーム/パスワードを先程作ったshiftr.ioのものに変更します。
実行！GPSモジュールのLEDが点滅＆shiftr.ioにデータが送られていれば成功です。
※GPSモジュールは、実行してからデータを取得できるまでに30秒ほど時間がかかります。

gpstest.html

<html>
<header>

<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://unpkg.com/obniz@2.5.0/obniz.js"></script>
<script src="https://unpkg.com/mqtt@2.15.1/dist/mqtt.min.js"></script>
</header>
  
  
<body>
<script>
    var obniz = new Obniz("OBNIZ_ID_HERE");
    obniz.onconnect = async () => {
    ////////  
        const mqttBroker = "mqtt://broker.shiftr.io";
        const mqttUsername = "ユーザーネーム";
        const mqttPassword = "パスワード";
        const pubTopic = "/gps/obniz";
        const subTopic = "/gps/noodl";

        obniz.display.clear();
        obniz.display.print('Here!!!');
     ////////   
      
    // ClientID
      const clientId = "gps-" + new Date().getTime();

      // shftr.io
      var obnizDeviceMQTT = mqtt.connect(mqttBroker, {
        "username": mqttUsername,
        "password": mqttPassword
      });
      
      // 接続
        console.log("obnizDeviceMQTT : connect start");
        console.log("clientId " , clientId );

        obnizDeviceMQTT.on("connect", function () {
          console.log("obnizDeviceMQTT : connect success");
          obnizDeviceMQTT.subscribe(subTopic, function (e) {
            if (e) {
              console.log("obnizDeviceMQTT: Subscrib error", e);
            }
            else {
              console.log("obnizDeviceMQTT: Subscribed!! ");
              //
              var sendData = {
                "message": "GPS"
              };
              // 一度メッセージを送る
              obnizDeviceMQTT.publish(pubTopic, JSON.stringify(sendData));
            }
          });
        });

        obnizDeviceMQTT.on("error", (topic, payload) => {
          console.log(payload);
        });
      
      //GPS
      let gps = obniz.wired("GYSFDMAXB", { vcc:0, gnd:1, txd:2, rxd:3, Opps:4 });
      function mainLoop() {
        var d = gps.getEditedData();
        if (d.enable) {
            if (d.GPGGA) { 
             $("#mes").text(d.GPGGA.join(","));
               let p = d.GPGGA;
               if (p[6] != "0") {
                     console.log(gps.nmea2dd(p[2]));
                     console.log(gps.nmea2dd(p[4]));
                     var sendData = {
                        "lat": gps.nmea2dd(p[2]),
                        "lon": gps.nmea2dd(p[4]),
                      };
                     obnizDeviceMQTT.publish(pubTopic, JSON.stringify(sendData));
               }
         }
         }
          setTimeout(mainLoop, 5000);
        }
       setTimeout(mainLoop, 5000);
    }
</script>
  </body>
</html>