點擊清單移動地圖到資料

API使用範例:點擊清單移動地圖到資料

情境假設:

  在疊加不同類型的資料時,容易導致地圖畫面過於雜亂,對於資料的展示與查找造成一定程度的不便。此範例以建立一個資料清單,讓使用者可以透過點擊該資料清單的方式,來快速將地圖範圍定位至該資料範圍區域中,藉此能更容易對目前圖台中所疊加的資料進行檢索與檢視,提高使用互動性。

TGOS MAP API建置方式:

1.載入圖徵資料並設定各資料的物件名稱,原則上應以欲呈現出的資料列表為主進行區分,以利後續設定觸發功能時不致於混淆所應對應的目標。

 

2.設定物件的觸發的方法,根據不同的物件名稱對應到該名稱所指定的圖徵資料,並將該圖徵資料的位置設定為地圖顯示的中心點。針對不同圖徵資料分別使用不同方法來設定地圖中心點位置或是資料範圍,點資料使用setCenter( getPosition())方法、線及面資料使用fitBounds(getEnvelope())方法。

                function locate(str)

                {

                        if(str == "point")

                        {

                                if(pTGMarker != null)

                                {

                                        pMap.setCenter(pTGMarker.getPosition());//指定地圖中心

                                        pMap.setZoom(10);

                                }

                        }

                        else if(str == "line")

                        {

                                if(line != null)

                                {

                                        pMap.fitBounds(line.getEnvelope());//指定地圖範圍

                                        pMap.setZoom(10); //指定地圖層級

                                }

                        }

                        else if(str =="polygon")

                        {

                                if(polygon != null)

                                {

                                        pMap.fitBounds(polygon.getEnvelope());//指定地圖範圍

                                        pMap.setZoom(10); //指定地圖層級

                                }

                        }

                }

回到上方