[App Inventor 教學] WebViewer 元件結合Google Map路徑規劃

來來來,今天的WebViewer 元件結合Google Map教學內容是路徑規劃,輸入起點座標與終點座標之後,送出給GoogleMap取得路徑規劃,並呈現在App Inventor的WebViewer元件上。

整個程式就這麼簡單!點選下列連結來從台北101 走到 中正紀念堂吧。

https://maps.google.com/maps?saddr=25.033408,121.564099&daddr=25.034712,121.522041

saddr : 起點座標

daddr:終點座標

以上兩個參數我們使用TextBox1與TextBox2的內容來取代就可以了。在點擊「前往」按鈕之後,使用WebViewer援建的GoToUrl指令來載入這個超連結。

首先會收到Google Map的路徑規劃結果

接下來就開始走囉

點選下面的箭頭可以看分段的路徑,還可以放大縮小(觸控縮放也可以)

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *