cesium精確定位初始化視角

cesium三維WebGL應(yīng)用開發(fā)過程中需要精確定位初始化場景位置時工窍,可采用以下思路
首先粗略定位場景位置衡蚂,參見http://www.reibang.com/p/7736e0cf97d1
其次鼠標移動場景到最佳視角,假設(shè)該視角就是需要精確定位的視角莫秆。
然后讓鼠標左鍵單擊場景時輸出6個視角參數(shù)到控制臺凭语,把這6個參數(shù)反填會代碼里即可掀亥。

回顧一下視角設(shè)置代碼,如下

viewer.scene.camera.setView({
            destination: new Cesium.Cartesian3(-1206939.1925299785, 5337998.241228442, 3286279.2424502545),
            orientation: {
                heading: 1.4059101895600987,
                pitch: -0.20917672793046682,
                roll: 2.708944180085382e-13
            }
        });

1.輸出6個視角參數(shù)到控制臺的關(guān)鍵代碼

 //獲取相機視角
        var handler1 = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
        handler1.setInputAction(function (movement) {
            console.log(viewer.scene.camera.position.x + "," + viewer.scene.camera.position.y + "," + viewer.scene.camera.position.z);//相機XYZ
            console.log("換行輸出:"+"\n"+
                            "heading:" + viewer.scene.camera.heading + ","+"\n"+
                            "pitch:" + viewer.scene.camera.pitch + ","+"\n"+
                            "roll:" + viewer.scene.camera.roll
            );
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

2.左鍵單擊輸出6個視角參數(shù)到控制臺的完整代碼(可運行)

該代碼基于SuperMap版cesium框架鸦列,可在SuperMap的在線沙箱運行租冠。點擊以下示例中的源碼按鈕,把本文下面的代碼全部復(fù)制到沙箱里覆蓋薯嗤,點擊運行顽爹,F(xiàn)12觀察瀏覽器控制臺,已輸出6個對應(yīng)的參數(shù)骆姐。
http://support.supermap.com.cn:8090/webgl/examples/editor.html#terrainAndImagery

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <title>地形影像</title>
    <link href="../Build/Cesium/Widgets/widgets.css" rel="stylesheet">
    <link href="./css/pretty.css" rel="stylesheet">
    <script src="./js/jquery.min.js"></script>
    <script src="./js/spectrum.js"></script>
    <script type="text/javascript" src="./js/require.min.js" data-main="js/main"></script>
    <script src="./js/config.js"></script>
</head>
<body>
<div id="cesiumContainer"></div>
<div id='loadingbar' class="spinner">
    <div class="spinner-container container1">
        <div class="circle1"></div>
        <div class="circle2"></div>
        <div class="circle3"></div>
        <div class="circle4"></div>
    </div>
    <div class="spinner-container container2">
        <div class="circle1"></div>
        <div class="circle2"></div>
        <div class="circle3"></div>
        <div class="circle4"></div>
    </div>
    <div class="spinner-container container3">
        <div class="circle1"></div>
        <div class="circle2"></div>
        <div class="circle3"></div>
        <div class="circle4"></div>
    </div>
</div>

<script>
    function onload(Cesium) {
        var viewer = new Cesium.Viewer('cesiumContainer', {
            //創(chuàng)建地形服務(wù)提供者的實例镜粤,url為SuperMap iServer發(fā)布的TIN地形服務(wù)
            terrainProvider: new Cesium.CesiumTerrainProvider({
                url: URL_CONFIG.SiChuan_TERRAIN,
                isSct: true//地形服務(wù)源自SuperMap iServer發(fā)布時需設(shè)置isSct為true
            }),
        });
        //添加SuperMap iServer發(fā)布的影像服務(wù)
        var layer = viewer.imageryLayers.addImageryProvider(new Cesium.SuperMapImageryProvider({
            url: URL_CONFIG.SiChuan_IMG
        }));

        viewer.scene.camera.setView({
            destination: new Cesium.Cartesian3(-1206939.1925299785, 5337998.241228442, 3286279.2424502545),
            orientation: {
                heading: 1.4059101895600987,
                pitch: -0.20917672793046682,
                roll: 2.708944180085382e-13
            }
        });

        $('#loadingbar').remove();
        $('#toolbar').show();

        //獲取相機視角
        var handler1 = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
        handler1.setInputAction(function (movement) {
            console.log(viewer.scene.camera.position.x + "," + viewer.scene.camera.position.y + "," + viewer.scene.camera.position.z);//相機XYZ
            console.log("換行輸出:"+"\n"+
                            "heading:" + viewer.scene.camera.heading + ","+"\n"+
                            "pitch:" + viewer.scene.camera.pitch + ","+"\n"+
                            "roll:" + viewer.scene.camera.roll
            );
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
    }
</script>
</body>
</html>
image.png

如果需要點擊某一按鈕div切換到特定視角,也可以通過該種方法獲取地物的最佳視角玻褪,然后把視角參數(shù)寫到視角切換函數(shù)中肉渴。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市带射,隨后出現(xiàn)的幾起案子同规,更是在濱河造成了極大的恐慌,老刑警劉巖窟社,帶你破解...
    沈念sama閱讀 211,817評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件券勺,死亡現(xiàn)場離奇詭異,居然都是意外死亡灿里,警方通過查閱死者的電腦和手機关炼,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,329評論 3 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來钠四,“玉大人盗扒,你說我怎么就攤上這事∽喝ィ” “怎么了侣灶?”我有些...
    開封第一講書人閱讀 157,354評論 0 348
  • 文/不壞的土叔 我叫張陵,是天一觀的道長缕碎。 經(jīng)常有香客問我褥影,道長,這世上最難降的妖魔是什么咏雌? 我笑而不...
    開封第一講書人閱讀 56,498評論 1 284
  • 正文 為了忘掉前任凡怎,我火速辦了婚禮校焦,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘统倒。我一直安慰自己寨典,他們只是感情好,可當我...
    茶點故事閱讀 65,600評論 6 386
  • 文/花漫 我一把揭開白布房匆。 她就那樣靜靜地躺著耸成,像睡著了一般。 火紅的嫁衣襯著肌膚如雪浴鸿。 梳的紋絲不亂的頭發(fā)上井氢,一...
    開封第一講書人閱讀 49,829評論 1 290
  • 那天,我揣著相機與錄音岳链,去河邊找鬼花竞。 笑死,一個胖子當著我的面吹牛掸哑,可吹牛的內(nèi)容都是我干的约急。 我是一名探鬼主播,決...
    沈念sama閱讀 38,979評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼举户,長吁一口氣:“原來是場噩夢啊……” “哼烤宙!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起俭嘁,我...
    開封第一講書人閱讀 37,722評論 0 266
  • 序言:老撾萬榮一對情侶失蹤躺枕,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后供填,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體拐云,經(jīng)...
    沈念sama閱讀 44,189評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,519評論 2 327
  • 正文 我和宋清朗相戀三年近她,在試婚紗的時候發(fā)現(xiàn)自己被綠了叉瘩。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,654評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡粘捎,死狀恐怖薇缅,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情攒磨,我是刑警寧澤泳桦,帶...
    沈念sama閱讀 34,329評論 4 330
  • 正文 年R本政府宣布,位于F島的核電站娩缰,受9級特大地震影響灸撰,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 39,940評論 3 313
  • 文/蒙蒙 一浮毯、第九天 我趴在偏房一處隱蔽的房頂上張望完疫。 院中可真熱鬧,春花似錦债蓝、人聲如沸壳鹤。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,762評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽器虾。三九已至,卻和暖如春蹦锋,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背欧芽。 一陣腳步聲響...
    開封第一講書人閱讀 31,993評論 1 266
  • 我被黑心中介騙來泰國打工莉掂, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人千扔。 一個月前我還...
    沈念sama閱讀 46,382評論 2 360
  • 正文 我出身青樓憎妙,卻偏偏與公主長得像,于是被迫代替她去往敵國和親曲楚。 傳聞我的和親對象是個殘疾皇子厘唾,可洞房花燭夜當晚...
    茶點故事閱讀 43,543評論 2 349

推薦閱讀更多精彩內(nèi)容