地圖元件與多邊形元件應用

本文說明App Inventor 新的 Map 元件搭配大頭針 Marker 元件與多邊形 polygon 元件的應用,非常實用喔。

Designer頁面
1. 新增專案,加入一個Map元件,寬度與高度都設為 320像素。本範例是阿吉老師在台科大上課的時候所出的,就用台科來做位置地圖的中心吧

2. 請把Map元件的 CenterFromString 屬性設為 "25.01334,121.54217" ,會以此來置中。

3. 加入一個 Label
4. 加入一個Slider (用來調整 Polygon 的透明度)。
5. 加入一個 Marker,隨意拖放位置即可。大小都可以調整,也可以上傳圖片。
6. 加入一個 Polygon,一開始是三角形,可新增任一邊數,隨意拖放位置即可。

完成如下:


其餘Map設定如下

  • EnablePan / EnableRotation 是設定是否可用兩指來縮放與旋轉地圖。
  • Zoom 是設定是否可縮放,這要看您的app功能而定。
  • ShowCompass則是出現指南針,並根據手機 compass sensor 來顯示南北向(也就是說模擬器無效果)
  • ShowUser顯示使用者位置
  • ShowZoom設定是否要出現縮放按鈕


Block頁面
相關的功能都很直觀,一一擊破喔!

程式初始畫面


點擊 Marker 與 polygon 顯示各自的 Infobox (要先勾選 EnableInfoBox 屬性!)

注意:經實測如果把Marker放在 polygon中,就只能點到 polygon


拉動slider調整圖層透明度






曾吉弘,
2018年10月17日 上午8:02
v.2