思路:
1.在頁面中建立乙個div標籤;
2.確定標籤在三維場景中的三維位置;並計算三維位置的螢幕座標;
3.在每一幀的渲染中都計算一下這個三維座標的螢幕位置,並把螢幕位置賦給標籤。
4.當轉到地球背面時,如果不想顯示彈窗,則隱藏。
具體實現:
1.建立div標籤
標籤樣式:
.tag
建立div時,最好是id和它要跟隨的物件一致,方便場景中查詢位置:
//txt1 txt2 txt3 為div中要顯示的文字,具體樣式可修改 innerhtml那一行
function adddom(id,txt1, txt2, txt3,)
2.確定標籤在三維場景中的位置並轉為螢幕座標
//三維笛卡爾座標轉螢幕座標
function transposition(position)
(1).指定位置(經緯度)
function fixdomposition(domid,position)else
}
(2).跟隨相同id的模型
function modelfixdom(domid) else
}
3.在每一幀的渲染中都計算一下這個三維座標的螢幕位置,並把螢幕位置賦給標籤。
viewer.scene.prerender.addeventlistener(function () )
4.如果不想地球轉到背面仍顯示標籤,則加個判斷距離判斷
function modelfixdom(domid) else
}else
}
function enableshow(cartesian)
return res
}
實現效果:
完整**:
>
>
>
修改預設的地圖選擇器內容title
>
cesium 相機跟隨
一場大的颱風,路徑通常很長,可能從靠近赤道的太平洋一直往北吹到東三省。跨度這麼大,在三維gis中,往往不容易看全。如果能夠實現相機隨動效果,即相機跟隨颱風步進 移動,就生動許多了。感覺在cesium中,座標和視角 相機 view是乙個難點,我到現在都搞不清楚。方向 orientation 可以總結一...
移動端彈窗顯示後,禁止body內容跟隨彈窗滾動
對於一般大小的彈窗可以使用如下方案 1.阻止預設事件 缺點 該方案存在一定的相容性,不是所有瀏覽器都有效。對於彈窗存在滾動的情況,也不適用。優點 彈窗顯示時,頁面仍然固定在原來位置,不會回滾到頂部 阻止彈窗滾動 function stopscroll function recoverscroll f...
DOM事件繫結
element.addeventlistener type,handler,boolean 第乙個值代表事件型別,不加on。第二個是執行的方法。事件處理函式 第三個值是乙個布林值,預設為false,只在冒泡階段執行。true為在捕獲階段執行 element.removeeventlistener t...