初始化viewer對象
//創(chuàng)建cesium Viewer
viewer = new Cesium.Viewer(‘cesiumContainer’,{
animation:false, //是否創(chuàng)建動畫小器件,左下角儀表
baseLayerPicker:false, //是否顯示圖層選擇器
fullscreenButton:false, //是否顯示全屏按鈕
geocoder:false, //是否顯示geocoder小器件影钉,右上角查詢按鈕
homeButton:false, //是否顯示Home按鈕
infoBox : false, //是否顯示信息框
sceneModePicker:false, //是否顯示3D/2D選擇器
selectionIndicator : false , //是否顯示選取指示器組件
timeline:false, //是否顯示時間軸
navigationHelpButton:false, //是否顯示右上角的幫助按鈕
scene3DOnly : true, //如果設(shè)置為true,則所有幾何圖形以3D模式繪制以節(jié)約GPU資源
navigationInstructionsInitiallyVisible:false,
showRenderLoopErrors:false,
imageryProvider : new Cesium.OpenStreetMapImageryProvider({ url : ‘//a.tile.openstreetmap.org/’ }) //加載自定義地圖瓦片需要指定一個自定義圖片服務(wù)器//URL為瓦片數(shù)據(jù)服務(wù)器地址
});
對entity的操作:添加、隱藏纵顾、修改、去除栋盹、居中顯示
Var rainEntity=viewer.entities.add({
id: "rain",
name: 'RainStation',
parent: rainLayer3D,
position: Cesium.Cartesian3.fromDegrees(lon, lat),
billboard: {
image: 'images/pointIcons/rain1.png',
scale:0.7,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM
},
label: {
text: rainfall,
font: '12px SimHei ',
Width: 3,
style: Cesium.LabelStyle.FILL,
fillColor: Cesium.Color.AQUA,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
verticalOrigin: Cesium.VerticalOrigin.TOP
}
}); //添加
viewer.entities.getById("rain").show = false; //隱藏
viewer.entities.getById("rain").label.text= "drp"; //修改屬性
viewer.entities.removeAll(); //移除所有
viewer.zoomTo(rainEntity); //居中顯示
去掉entity的雙擊事件
問題所在:雙擊entity施逾,會放大視圖,entity居中顯示例获,且鼠標(biāo)左鍵失去移動功能汉额,鼠標(biāo)滾輪失去作用
解決問題:
viewer.screenSpaceEventHandler.setInputAction(function(){},Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK );
獲取當(dāng)前視角高度
var scene = viewer.scene;
var ellipsoid = scene.globe.ellipsoid;
var height=ellipsoid.cartesianToCartographic(viewer.camera.position).height;
獲取某個經(jīng)緯度在屏幕上的位置
var position = Cesium.Cartesian3.fromDegrees(lon, lat);
var clickPt =Cesium.SceneTransforms.wgs84ToWindowCoordinates (viewer.scene, position);
var screenX=clickPt.x;
var screenY=clickPt.y;
獲取三維場景屏幕中心點坐標(biāo)
var result = viewer.camera.pickEllipsoid(new Cesium.Cartesian2 ( viewer.canvas.clientWidth /2 , viewer.canvas.clientHeight / 2));
var curPosition = Cesium.Ellipsoid.WGS84.cartesianToCartographic(result);
var lon = curPosition.longitude*180/Math.PI;
var lat = curPosition.latitude*180/Math.PI;
響應(yīng)鼠標(biāo)單擊等事件,獲取屏幕點擊坐標(biāo)
var handler = new Cesium.ScreenSpaceEventHandler(canvas);
handler.setInputAction(function(click){},Cesium.ScreenSpaceEventType.LEFT_CLICK);
var clickX=click.position.x;
var clickY=click.position.y;
這個LEFT_CLICK可以換成MIDDLE_CLICK榨汤、MOUSE_MOVE等就會響應(yīng)滾輪點擊蠕搜、鼠標(biāo)移動等事件,見參考文檔中的ScreenSpaceEventType()收壕,注意不同的事件中妓灌,function中的click會有不同的屬性,可console.log(click)蜜宪,找到所需
跟蹤相機視角的改變
viewer.camera.moveStart.addEventListener(function(moveStartPosition){})虫埂;
viewer.camera.moveEnd.addEventListener(function(moveEndPosition){});
其實還有個
viewer.camera.changed.addEventListener(function(moveEndPosition){})圃验,但我不會用告丢,總是提示changed不存在,但是camera的參考文檔中這個changed和moveStart和moveEnd都可以addEventListener
使視角到達某一地點
viewer.camera.setView({
destination: Cesium.Cartesian3.fromDegrees(lon, lat, height),
orientation: {
heading : curHeading, //左右偏移
pitch : curPitch, //上下偏移
roll : 0.0
}
});