SuperMap iClient for WebGL实体视角实现

在SuperMap iClient for WebGL中，可以添加多种类型的实体，且可以用viewer.trackedEntity去对实体进行跟踪显示，但是跟踪显示的过程中发现，这个跟踪视角和位置都不如人意，并且吧，还不会转弯，并且视角是一直跟着实体的，不是从实体的视角去看场景。视角是在entity.viewFrom中进行设置的，但是这个是个property，之前的时候觉得有点摸不着头脑，就用了一个其它的方法去设置，先记录下用的这个方法吧。

主要还是用的相机的lookat的方法，因为反正都是视角的移动嘛，所以都是控制相机，就直接找了camera中的方法看。

其实最终也是用了property，但是没往viewForm里放

先看下camera.lookat的文档说明

 需要两个参数，第一个是目标位置，第二个是偏移方向。得到这两个参数后，就可以开始去找啦!

首先计算一下方向，position是用线路节点进行插值后的结果；

var hpRange = new Cesium.VelocityOrientationProperty(position);

然后渲染的时候获取当前的时间，再用时间去entity里面获取位置数据，开始的时候我的节点高度因为是手动获取的，实在是太低了，干脆加了50，其实正常人没那么高，但是为了效果嘛哈哈哈哈哈哈……

var endPos = lk.position.getValue(viewer.clock.currentTime);
var cartographic = Cesium.Cartographic.fromCartesian(endPos);
var lon = Cesium.Math.toDegrees(cartographic.longitude);
var lat = Cesium.Math.toDegrees(cartographic.latitude);
var height = cartographic.height;
let center = new Cesium.Cartesian3.fromDegrees(lon, lat,height+50);

获取到第一个参数之后，接下来就是第二个参数了，第二个参数是方向，其实位置不难获取，主要是方向不好控制，笔者获取到的这个看起来也是丑兮兮的，所以有用定值调整了一下下的，但是其实可以可以用滑动监听控制的方式进行调整，这样得到的视角可能会更符合心意。

实时获取插值得到的方向，然后调整

var fangxiangsiyuanshu = hpRange.getValue(viewer.clock.currentTime);
let C3 = Cesium.Cartesian3.fromCartesian4(fangxiangsiyuanshu);
let h = C3.x;
let p = C3.y;
let r = C3.z ;  //需要调整这几个视角的值   需要降低俯仰角

let hpr = new Cesium.HeadingPitchRange(h, p, r);

再用上面得到的两个参数设置相机位置

viewer.camera.lookAt(center,hpr);

总代码是这样的，用了场景渲染监听，因为要实时设置嘛

var hpRange = new Cesium.VelocityOrientationProperty(position);
					scene.postRender.addEventListener(function(){
						console.log(lk.viewFrom)
						var fangxiangsiyuanshu = hpRange.getValue(viewer.clock.currentTime);
						var endPos = lk.position.getValue(viewer.clock.currentTime);
						let C3 = Cesium.Cartesian3.fromCartesian4(fangxiangsiyuanshu);
						let h = C3.x;
						let p = C3.y;
						let r = C3.z ;  //需要调整这几个视角的值   需要降低俯仰角
						// var m = 0.00000906;
						 var cartographic = Cesium.Cartographic.fromCartesian(endPos);
						 var lon = Cesium.Math.toDegrees(cartographic.longitude);
						 var lat = Cesium.Math.toDegrees(cartographic.latitude);
						var height = cartographic.height;
						// var m = 0.00000906;
						let center = new Cesium.Cartesian3.fromDegrees(lon, lat,height+50);
						let hpr = new Cesium.HeadingPitchRange(h, p, r);
						viewer.camera.lookAt(center,hpr);
						console.log("hpr",hpr);
						
					        });

//还是觉得这个方法有点过于笨重，后期有时间再改吧