檢視範例

範例下載

    var earth_ = null;

         function documentLoad()

       {

             document.body.style.overflow = "hidden";

             SuperGIS.Initialize("/ServerGate/", function () {

                 SuperGIS.ServerEarth.Initialize(InitEarth);

             });

         }

     function InitEarth()

     {

         var pBody = new SuperGIS.Windows.HTMLContainer(document.getElementById("example"));

         var sHost = location.href;

         var idx = sHost.indexOf("/", 8);

         if (idx >= 0) sHost = sHost.substring(0, idx);

         CreateHTML5Earth(pBody, function (pEarth) { EarthLoaded(pEarth); });

         function EarthLoaded(pEarth)

         {

             earth_ = pEarth;

             pEarth.Scene.BackgroundColor = pEarth.CreateColor(0, 0, 0, 1);

             pEarth.SetupSystem(true, s_WGS84);

             pEarth.SetupSkin(pEarth.CreateEnvelope(-180, 180, -90, 90, s_WGS84), sHost + "/ServerGate/Skin1.jpg");

             pEarth.MajorGraticule.Visible = false;

             pEarth.MinorGraticule.Visible = false;

             // 指定向量磚服務的 WMTS 網址, 欲加入的圖層名稱, 及 callback function 名稱

             VLayer = new SuperGIS.VectorLayer(getDataServicePath() + 'project_block/SimpleWMTS.aspx',

                                               pEarth, { layer: '土地使用分區' }, LanduseFinish);

             pEarth.SetViewpoint(120.656, 24.160, 500, 0, 50, true);

             var pTObj = pEarth.GetObject();

             pTObj.addEventListener("click", QueryAttribute, false, true); // 引入 click 事件

             var pCam = pEarth.GetCamera();

             pCam.addEventListener("changed", CameraChanged, false); // Camera 狀態改變時觸發

         }

         // 在 callback 中設定每個 feature 的符號樣式

         function LanduseFinish(array) {

             var rv = 128, gv = 255, bv = 128;

             for (var i = 0; i < array.length; i++) {

                 var mark = array[i];

                 var fc = earth_.CreateColor(rv / 255.0, gv / 255.0, bv / 255.0, 128 / 255.0);

                 mark.ReplaceZ = 0.5; // 設定高程 (公尺)

                 mark.DDDSymbol = earth_.CreateSimpleDDDFillSymbol(earth_.CreateModelMaterial(0, fc), null);

                 mark.Queryable = true; // 設定為可查詢

             }

         }

         function OnCloseClick() {

               // 關掉屬性視窗時觸發

         }

         function OnContentChange() {

             // 改變屬性視窗內容時觸發, 可由呼叫 setContent 觸發

         }

         function OnPositionChange() {

             // 改變屬性視窗位置時觸發, 可由呼叫 setPosition 觸發

         }

         var pInfoWindow = null;

         function QueryAttribute(tEvent) {

             if (pInfoWindow != null) {

                 pInfoWindow.close();

                 pInfoWindow = null;

             }

             if (tEvent.button == 2) // 使按右鍵無作用

                 return;

             var pScene = earth_.GetScene();

             var pCamera = earth_.GetCamera();

             var pGlobe = earth_.GetGlobe();

             var CurPosition = pScene.PositionFromDevice(new SuperGIS.DDDCore.Vector3(tEvent.x, tEvent.y, 0));

             var pPick = earth_.PlacemarkObjects.Picking(SuperGIS.DDDCore.RenderPriority.Unknown, pCamera.EyeAt, pCamera.Ray(CurPosition), 0);

             if (pPick != null)

             {

                 var pm = pPick.Target;

                 var feaData = pm.GetFieldValues();

                 var infoStr = '<table border="1">';

                 for (var f in feaData)

                 {

                     infoStr += "<tr><td>";

                     infoStr += f;

                     infoStr += "</td><td>";

                     infoStr += feaData[f];

                     infoStr += "</td></tr>";

                 }

                 infoStr += '</table>';

                 var CurLocation = pGlobe.RayTest(pCamera.EyeAt, pCamera.Ray(CurPosition), 1, true);

                 pt = pGlobe.GeodeticFromCartesian(CurLocation);

                 // infoStr 為 Content 內容

                 // pt 為視窗出現的空間坐標

                 // 支援的 option 有 maxWidth (視窗最大寬度); pixelOffsetX/pixelOffsetY: X/Y 方向的視窗位移

                 pInfoWindow = new SuperGIS.InfoWindow(infoStr, pt, { maxWidth: 250, pixelOffsetX: 100, pixelOffsetY: 0}); // 建立屬性視窗

                 pInfoWindow.open(earth_, document.getElementById("example"));

                 SuperGIS.Event.addListener(pInfoWindow, "closeclick", OnCloseClick); // 監聽屬性視窗的 close 事件

                 SuperGIS.Event.addListener(pInfoWindow, "content_changed", OnContentChange); // 監聽屬性視窗的 content change 事件

                 SuperGIS.Event.addListener(pInfoWindow, "position_changed", OnPositionChange); // 監聽屬性視窗的 position change 事件

               }

         }

         function CameraChanged(tEvent) {

               // Camera 狀態改變就關掉視窗

             if (pInfoWindow != null) {

                 pInfoWindow.close();

                 pInfoWindow = null;

             }

         }

       }