标签：function 初始化 viewer 三维 scene Cesium nbsp var 加载
/**
* 场景初始化
* qizhiyong 20191205
*/
var viewer;
var widget;
var scene;
var clampMode;
var handler;// 空间模式
var handlerDis, handlerArea, handlerHeight,handlerPolygon;
function onl oad(Cesium) {
viewer = new Cesium.Viewer('cesiumContainer', {
showRenderLoopErrors : false,
shouldAnimate : true,
selectionIndicator : false,
animation : false,
baseLayerPicker : true,
geocoder : false,
timeline : false,
sceneModePicker : true,
navigationHelpButton : false,
infoBox : false,
fullscreenButton : true
});
clampMode = 0; // 空间模式
scene = viewer.scene;
widget = viewer.cesiumWidget;
/* viewer.pickEvent.addEventListener(pick);*/
var globe = viewer.scene.globe;
viewer.scene.undergroundMode = true; //设置开启地下场景
viewer.scene.screenSpaceCameraController.minimumZoomDistance = -1000;//设置相机最小缩放距离,距离地表-1000米
viewer.scene.terrainProvider.isCreateSkirt = false; // 关闭裙边
// 添加地下管理模型
var promise = scene.open(URL_CONFIG.SCENE_GX);
Cesium.when(promise, function(layers) {
debugger;
if (!scene.pickPositionSupported) {
alert('不支持深度拾取,属性查询功能无法使用！');
}
var overGroundLayer1 = scene.layers.find('ZHELW@ZHDHB');
var overGroundLayer2 = scene.layers.find('ZHDVEG@ZHDHB');
var overGroundLayer3 = scene.layers.find('ZHDTRA@ZHDHB');
var overGroundLayer4 = scene.layers.find('ZHDTER@ZHDHB');
var overGroundLayer5 = scene.layers.find('ZHDOTH@ZHDHB');
var overGroundLayer6 = scene.layers.find('ZHDBUI@ZHDHB');
//设置相机视角
viewer.scene.camera.setView({
destination : new Cesium.Cartesian3.fromDegrees(113.80856494043454,34.78488948680121,1083),
orientation : {
heading : Cesium.Math.toRadians(321.4777704143403),
pitch : Cesium.Math.toRadians(-40.06076410592053),
roll : Cesium.Math.toRadians(0.0018310677742497117)
}
});
var viewModel = { //监听滑动条变化，改变alpha的值，设置地表透明度
overGroundAlpha : 1
};
debugger;
Cesium.knockout.track(viewModel);
var toolbar = document.getElementById('toolbar');
Cesium.knockout.applyBindings(viewModel, toolbar);
Cesium.knockout.getObservable(viewModel,'overGroundAlpha').subscribe(// 设置地表图层透明度
function(newValue) {
overGroundLayer1.style3D.fillForeColor.alpha = parseFloat(newValue);
overGroundLayer2.style3D.fillForeColor.alpha = parseFloat(newValue);
overGroundLayer3.style3D.fillForeColor.alpha = parseFloat(newValue);
overGroundLayer4.style3D.fillForeColor.alpha = parseFloat(newValue);
overGroundLayer5.style3D.fillForeColor.alpha = parseFloat(newValue);
overGroundLayer6.style3D.fillForeColor.alpha = parseFloat(newValue);
}
);
}, function(e) {
if (widget._showRenderLoopErrors) {
var title = '渲染时发生错误，已停止渲染。';
widget.showErrorPanel(title, undefined, e);
}
});
$(".cesium-viewer-toolbar").hide();
//初始化测量距离
handlerDis = new Cesium.MeasureHandler(viewer, Cesium.MeasureMode.Distance,
clampMode);
//注册测距功能事件
handlerDis.measureEvt.addEventListener(function(result) {
var dis = Number(result.distance);
var distance = dis > 1000 ? (dis / 1000).toFixed(2) + 'km' : dis
.toFixed(2)
+ 'm';
handlerDis.disLabel.text = '距离:' + distance;
});
handlerDis.activeEvt.addEventListener(function(isActive) {
if (isActive == true) {
viewer.enableCursorStyle = false;
viewer._element.style.cursor = '';
$('body').removeClass('measureCur').addClass('measureCur');
} else {
viewer.enableCursorStyle = true;
$('body').removeClass('measureCur');
}
});
//初始化测量面积
handlerArea = new Cesium.MeasureHandler(viewer, Cesium.MeasureMode.Area,
clampMode);
handlerArea.measureEvt.addEventListener(function(result) {
var mj = Number(result.area);
var area = mj > 1000000 ? (mj / 1000000).toFixed(2) + 'km²' : mj
.toFixed(2)
+ '㎡'
handlerArea.areaLabel.text = '面积:' + area;
});
handlerArea.activeEvt.addEventListener(function(isActive) {
if (isActive == true) {
viewer.enableCursorStyle = false;
viewer._element.style.cursor = '';
$('body').removeClass('measureCur').addClass('measureCur');
} else {
viewer.enableCursorStyle = true;
$('body').removeClass('measureCur');
}
});
//初始化测量高度
handlerHeight = new Cesium.MeasureHandler(viewer, Cesium.MeasureMode.DVH);
handlerHeight.measureEvt
.addEventListener(function(result) {
var distance = result.distance > 1000 ? (result.distance / 1000)
.toFixed(2)
+ 'km'
: result.distance + 'm';
var vHeight = result.verticalHeight > 1000 ? (result.verticalHeight / 1000)
.toFixed(2)
+ 'km'
: result.verticalHeight + 'm';
var hDistance = result.horizontalDistance > 1000 ? (result.horizontalDistance / 1000)
.toFixed(2)
+ 'km'
: result.horizontalDistance + 'm';
handlerHeight.disLabel.text = '空间距离:' + distance;
handlerHeight.vLabel.text = '垂直高度:' + vHeight;
handlerHeight.hLabel.text = '水平距离:' + hDistance;
});
handlerHeight.activeEvt.addEventListener(function(isActive) {
if (isActive == true) {
viewer.enableCursorStyle = false;
viewer._element.style.cursor = '';
$('body').removeClass('measureCur').addClass('measureCur');
} else {
viewer.enableCursorStyle = true;
$('body').removeClass('measureCur');
}
});
handlerPolygon = new Cesium.DrawHandler(viewer,Cesium.DrawMode.Polygon);
var tooltip = createTooltip(document.body);
handlerPolygon.activeEvt.addEventListener(function(isActive){
if(isActive == true){
viewer.enableCursorStyle = false;
viewer._element.style.cursor = '';
$('body').removeClass('drawCur').addClass('drawCur');
}
else{
viewer.enableCursorStyle = true;
$('body').removeClass('drawCur');
}
});
handlerPolygon.movingEvt.addEventListener(function(windowPosition){
if(windowPosition.x < 210 && windowPosition.y < 120){
tooltip.setVisible(false);
return ;
}
if(handlerPolygon.isDrawing){
tooltip.showAt(windowPosition,'<p>点击确定查询区域中间点</p><p>右键单击结束绘制</p>');
}
else{
tooltip.showAt(windowPosition,'<p>点击绘制查询区域第一个点</p>');
}
});
handlerPolygon.drawEvt.addEventListener(function(result){
debugger;
tooltip.setVisible(false);
handlerPolygon.polygon.show = true;
handlerPolygon.polyline.show = true;
var geometry = CesiumToSuperMap.convertPolygon(Cesium,SuperMap,result.object);
query(geometry);
});
//画点
handlerPoint = new Cesium.DrawHandler(viewer,Cesium.DrawMode.Point);
handlerPoint.activeEvt.addEventListener(function(isActive){
if(isActive == true){
viewer.enableCursorStyle = false;
viewer._element.style.cursor = '';
$('body').removeClass('drawCur').addClass('drawCur');
}
else{
viewer.enableCursorStyle = true;
$('body').removeClass('drawCur');
}
});
handlerPoint.drawEvt.addEventListener(function(result){
handlerPoint.point.show = true;
var geometry = CesiumToSuperMap.convertPoint(Cesium,SuperMap,result.object.position);
zbQueryResult(geometry);
});
}
function drawPolygons(){
handlerPolygon.activate();
}
function drawPoint(){
handlerPoint.activate();
}
//测距
function measure3dDistance() {
debugger;
deactiveAll();
handlerDis && handlerDis.activate();
}
//测面
function measure3dArea() {
deactiveAll();
handlerArea && handlerArea.activate();
}
//测高
function measure3dHeight() {
deactiveAll();
handlerHeight && handlerHeight.activate();
}
//清除功能
function clear3dFeatures() {
viewer.entities.removeAll();
handlerDis && handlerDis.clear();
handlerArea && handlerArea.clear();
handlerHeight && handlerHeight.clear();
handlerPolygon && handlerPolygon.clear();
handlerPoint && handlerPoint.clear();
handler && handler.destroy();
$("#popup00").hide();
}
function deactiveAll() {
handlerDis && handlerDis.deactivate();
handlerArea && handlerArea.deactivate();
handlerHeight && handlerHeight.deactivate();
handlerPolygon && handlerPolygon.deactivate();
}
//三维定位
function fly3D(x,y,z){
/*new Cesium.Cartesian3.fromDegrees(113.80856494043454,34.78488948680121,1083)*/
viewer.camera.flyTo({
destination : new Cesium.Cartesian3.fromDegrees(x,y,100),
/* orientation : {
heading : Cesium.Math.toRadians(321.4777704143403),
pitch : Cesium.Math.toRadians(100.06076410592053),
roll : Cesium.Math.toRadians(0.0018310677742497117)
}*/
});
};
//全幅
function fullMap3D(){
/*new Cesium.Cartesian3.fromDegrees(113.80856494043454,34.78488948680121,1083)*/
viewer.camera.flyTo({
destination : new Cesium.Cartesian3.fromDegrees(113.80856494043454,34.78488948680121,1083),
orientation : {
heading : Cesium.Math.toRadians(321.4777704143403),
pitch : Cesium.Math.toRadians(-40.06076410592053),
roll : Cesium.Math.toRadians(0.0018310677742497117)
}
});
};
//点击事件
function clickMap(){
handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
handler.setInputAction(function (e) {
debugger;
// 获取点击位置笛卡尔坐标
var position = scene.pickPosition(e.position);
//将笛卡尔坐标转化为经纬度坐标
var cartographic = Cesium.Cartographic.fromCartesian(position);
var longitude = Cesium.Math.toDegrees(cartographic.longitude);
var latitude = Cesium.Math.toDegrees(cartographic.latitude);
var height = cartographic.height;
if(height < 0) {
height = 0;
}
var selectedLayer= viewer.scene.layers.getSelectedLayer();
var names="name";
if(selectedLayer==undefined||selectedLayer[names]==undefined){
return;
}
var name=selectedLayer.name;//name = "PL_DX@PipeLine"
var smid=selectedLayer.getSelection();//smid = ["105"]
/* var smx=selectedLayer.lon;
var smy=selectedLayer.lat;*/
var smId=parseInt(smid[0]);
var url1=ftpIp+"/pms-servicesite/pipeservices/pipedatas/";
var data1;
var data2;
$.ajax({
url : url1,
type:"get",
async: false,
dataType : 'json',
data:{},
success : function(data) {
data1=data;
},
error : function(msg) {
}
});
var gxType=null;
for(var i=0;i<data1.length;i++){
if(name==data1[i].pipeDataset){
gxType=data1[i].pkid;
}
}
if(gxType==null){
/*alert("");*/
return;
}
var url2=ftpIp+"/pms-servicesite/pipeservices/pipedatas/"+gxType+"/line/features?filter=SMID="+smId;
$.ajax({
url : url2,
type:"get",
async: false,
dataType : 'json',
data:{},
success : function(data) {
data2=data;
},
error : function(msg) {
}
});
var data3=data2.rows[0];
var divId="popup00";
$("#"+divId).remove();
var bubble = $("<div id='"+divId+"' class='bubble'><div class='iconClose'><i class='iconfont icon-guanbi' onclick='closeThisBubble(this)'></i></div></div>");
/*var bubbleDiv ="<div class='popup-main'><p>终点高程："+data2.rows[0].E_H+"</p><p>材质 ："+data2.rows[0].MATERIAL+"</p>" +
"<p>备注："+data2.rows[0].REMARK+"</p><p>起点高程："+data2.rows[0].S_H+"</p><p>宽："+data2.rows[0].SSPIPEWIDTH+"</p>" +
"<p>高："+data2.rows[0].SSPIPEHEIGHT+"</p></div>";*/
var bubbleDiv ="<div class='popup-main'>";
if(data3.E_H==null){
bubbleDiv+="<p>终点高程：无</p>";
}else{
bubbleDiv+="<p>终点高程："+data3.E_H+"</p>";
}
if(data3.MATERIAL==null){
bubbleDiv+="<p> 材质 ：无</p>";
}else{
bubbleDiv+="<p> 材质 ："+data3.MATERIAL+"</p>";
}
if(data3.REMARK==null){
bubbleDiv+="<p> 备注 ：无</p>";
}else{
bubbleDiv+="<p> 备注 ："+data3.REMARK+"</p>";
}
if(data3.S_H==null){
bubbleDiv+="<p>起点高程：</p>";
}else{
bubbleDiv+="<p>起点高程："+data3.S_H+"</p>";
}
if(data3.SSPIPEWIDTH==null){
bubbleDiv+="<p> 宽 ：无</p>";
}else{
bubbleDiv+="<p> 宽 ："+data3.SSPIPEWIDTH+"</p>";
}
if(data3.SSPIPEHEIGHT==null){
bubbleDiv+="<p> 高 ：无</p></div>";
}else{
bubbleDiv+="<p> 高 ："+data3.SSPIPEHEIGHT+"</p></div>";
}
bubble.append(bubbleDiv);
$(viewer._element).append(bubble);
/*bubble.width = "20px";
bubble.height = "20px";*/
var position = Cesium.Cartesian3.fromDegrees(parseFloat(longitude), parseFloat(latitude),parseFloat(height));
//气泡样式
var commonBubble = new CommonBubble(viewer.scene,divId);
//气泡位置
commonBubble.showAt(position);
//气泡显示
commonBubble.visibility(true);
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
}
function closeThisBubble(){
$("#popup00").hide();
};
//获取当前相机角度参数
function getCurrentExtent() {
debugger;
// 范围对象
var extent = {};
// 得到当前三维场景
var scene = viewer.scene;
// 得到当前三维场景的椭球体
var ellipsoid = scene.globe.ellipsoid;
var canvas = scene.canvas;
// canvas左上角
var car3_lt = viewer.camera.pickEllipsoid(new Cesium.Cartesian2(0, 0),
ellipsoid);
// canvas右下角
var car3_rb = viewer.camera.pickEllipsoid(new Cesium.Cartesian2(
canvas.width, canvas.height), ellipsoid);
// 当canvas左上角和右下角全部在椭球体上
if (car3_lt && car3_rb) {
var carto_lt = ellipsoid.cartesianToCartographic(car3_lt);
var carto_rb = ellipsoid.cartesianToCartographic(car3_rb);
extent.xmin = Cesium.Math.toDegrees(carto_lt.longitude);
extent.ymax = Cesium.Math.toDegrees(carto_lt.latitude);
extent.xmax = Cesium.Math.toDegrees(carto_rb.longitude);
extent.ymin = Cesium.Math.toDegrees(carto_rb.latitude);
}
// 当canvas左上角不在但右下角在椭球体上
else if (!car3_lt && car3_rb) {
var car3_lt2 = null;
var yIndex = 0;
do {
// 这里每次10像素递加，一是10像素相差不大，二是为了提高程序运行效率
yIndex <= canvas.height ? yIndex += 10 : canvas.height;
car3_lt2 = viewer.camera.pickEllipsoid(new Cesium.Cartesian2(0,
yIndex), ellipsoid);
} while (!car3_lt2);
var carto_lt2 = ellipsoid.cartesianToCartographic(car3_lt2);
var carto_rb2 = ellipsoid.cartesianToCartographic(car3_rb);
extent.xmax = Cesium.Math.toDegrees(carto_lt2.longitude);
extent.ymax = Cesium.Math.toDegrees(carto_lt2.latitude);
extent.xmin = Cesium.Math.toDegrees(carto_rb2.longitude);
extent.ymin = Cesium.Math.toDegrees(carto_rb2.latitude);
}
// 获取高度
extent.height = Math.ceil(viewer.camera.positionCartographic.height);
extent.lon = Cesium.Math
.toDegrees(viewer.camera.positionCartographic.longitude);
extent.lat = Cesium.Math
.toDegrees(viewer.camera.positionCartographic.latitude);
extent.heading = Cesium.Math.toDegrees(viewer.camera.heading);
extent.pitch = Cesium.Math.toDegrees(viewer.camera.pitch);
extent.roll = Cesium.Math.toDegrees(viewer.camera.roll);
console.log("heading：" + extent.heading + "--pitch：" + extent.pitch
+ "--roll：" + extent.roll);
return extent;
}
标签：function,初始化,viewer,三维,scene,Cesium,nbsp,var,加载 来源： https://www.cnblogs.com/wanlige/p/12627507.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。