Step1>    我們先在資料表裡新增一個地圖欄位。選到Table下的Customers表，按右鍵，選到設計。

 

 

Step2>    按下新增按鈕，增加一個欄位，Map  nvarchar(200)，並保存起來。

 

 

Step3>    打開sRWDCustomers，找到Customers這個InfoCommand，CommandText屬性編輯，將Map 欄位加入Select語句中，按下確定並保存起來。

 

 

Step4>    打開rwdSingle1表單，找到DataForm元件，Columns屬性編輯，新增一個欄位，Field屬性下拉選擇Map，Editor屬性選擇map。

 

 

Step5>    設定ValueType=current(自動定位目前所在的位置)，其他地圖顯示型態還有： Address(地址)/Latlng(經緯度)/CurrentAddress(自動定位目前所在的位置地址)。

Step6>    找到dgMaster這個DataGrid元件，加入一個欄位，Field屬性選擇Map，將Format設置為map,current。

Step7>    設置完成後保存並預覽：

DataForm編輯：

(如果出現定位失敗是因為定位api 用的是html5 的功能， chrome在非https網站由於安全原因不能使用html5 定位)

 

DataGrid顯示：

Step8>    若是不想使用自動定位，而是要在DataForm上編輯值，並在DataGrid上顯示欄位值所在的地圖，可以將DataForm的欄位型態改回textbox，若欄位值為地址，可以將DataGrid的Format屬性改為：map,address

 

DataForm的設定改回TextBox，如下圖:

 

 

執行結果：

Step9>    若欄位值為經緯度，可以將DataGrid的Format屬性改為：map,latlng。

 

執行結果：

 

 

 

【註】以上的地圖預設為「Google Map」，若想置換其他類型，可以在工具à設定裡置換。