疊加TMS

疊加TMS

TMS(Tile Map Service)Open Source常見的地理圖資圖磚服務格式,TGOS MAP API (Web)也提供方法讓使用者可以套疊發布之TMS圖層到TGOS電子地圖上,並可以調整透明度、堆疊順序等設定。使用TGOS.TMSLayer()加入TMS圖層物件。TMS的圖磚索引是由XY欄列,以及Z值層級所建構,但由於Y坐標方向與OGC格式的WMTS相反,在設定上要特別注意。

function AddTMSLayer() {

        if (myTMSLayer != null) {

                   RemoveTMSLayer();

           }

           var Bounds = pMap.getBounds();  //取得地圖瀏覽範圍

           var src = document.getElementById("TMS_URL").value;  //設定TMS圖資來源

           var opacity = parseFloat(document.getElementById("tms_opacity").value);   //設定透明度

    

           var info = {

                   xTemplate: '${x}' // col

                   yTemplate: '${y}',   // row

                   zTemplate: '${z}',   // 層級

                   yNorthPositive: false   //y 的索引方向,接GoogleOpenStreetMapfalse,接TMS發的圖要設true

           };

          

           var panes = pMap.getPanes(); //取得現有地圖相關承載層               

           var container = panes.overlayviewLayer;  // 指定承載層

          

           var opts = {

                   visible: true//顯示隱藏

                   container: container,  //承載層

                   opacity: opacity   //透明度

           };

           myTMSLayer = new TGOS.TMSLayer("TMS Layer", src, pMap, info, opts);  //建立TMS圖層物件

   };

 

使用setOpacity()方法改變TMS圖層的透明度。

function setTMSOpacity() {

        if (myTMSLayer) {

            var opacity = parseFloat(document.getElementById("tms_opacity").value);

            myTMSLayer.setOpacity(opacity); //設定透明度

        }

    };

 

要移除TMS圖層物件,則使用RemoveTMSLayer()方法。

function RemoveTMSLayer() {

        if (myTMSLayer) {

            pMap.removeLayer(myTMSLayer);  //移除TMSLayer

            myTMSLayer = null;

        }

    };

回到上方