cesium 设置时间_Cesium 车辆跟踪事件气泡弹窗一直开启

展示图：

功能思路：

(1)设置创建时钟组件JulianDate，该时间组件很重要，不仅是用来追踪路线使用，还要监听每个时间点到达的坐标位置。

(2)气泡的实时根据坐标刷新，上一篇有说到，根据当前时间返回当前坐标值。

(3)鼠标左键监听事件换成了时钟帧数调用监听事件viewer.clock.onTick.addEventListener，根据路线图的每次的时间刻度调用实现气泡追踪。

部分代码：

创建path路线图

//路线参数处理

var positionData = paramObj.data.Coordinates;

Intervals = 0; //间隔时间

for (var i = 0; i < positionData.length; i++) {

var time = Cesium.JulianDate.addSeconds(starttime, Intervals, new Cesium.JulianDate());

var data = positionData[i];

var position = Cesium.Cartesian3.fromDegrees(data.x, data.y, 20);

property.addSample(time, position);

Intervals += paramObj.setTime.multiplier;

}

var stoptime = Cesium.JulianDate.addSeconds(starttime, Intervals, new Cesium.JulianDate()); //总停止秒数

//时钟设置

viewer.clock.startTime = starttime.clone();

viewer.clock.stopTime = stoptime.clone();

viewer.clock.currentTime = starttime.clone();

viewer.clock.clockRange = Cesium.ClockRange.CLAMPED; //Loop at the end

viewer.clock.multiplier = paramObj.setTime.multiplier;

entity = viewer.entities.add({

availability: new Cesium.TimeIntervalCollection([new Cesium.TimeInterval({

start: starttime,

stop: stoptime

})]),

position: property,

orientation: new Cesium.VelocityOrientationProperty(property),

billboard: {

image: paramObj.imgurl,

path: {

resolution: paramObj.resolution,

material: new Cesium.PolylineGlowMaterialProperty({ //线的材质

glowPower: 0.5,

color: Cesium.Color.YELLOW

}),

width: 5,

leadTime: 0,

trailTime: Intervals,

}

});

时钟帧数监听函数

//时间实时函数

function Stoptime(){

var position = entity.position.getValue(viewer.clock.currentTime);

var paramObj = {

id: 'trackPopUpContent',

HTMLdiv: '

' +

纬度:10,
经度:20

' +

Offset: {

x: 0,

y: 0

coordinate: position, //笛卡尔坐标参数

lineStyle: {

Linewidth: 3,

Lineheight: 25,

Linebackground: '#409EFF'

CircleStyle: {

Circleradius: 8,

Circlecolor: '#409EFF'

heighthidenum:10000,//高度隐藏值

}

//固定弹窗位置

PopupCoordinatePositioning(paramObj);

//当执行了时间停止监听的函数后,务必移除监听事件,因为时间一直在停止状态,函数将被一直执行

//viewer.clock.onStop.removeEventListener(Stoptime);

}

路线停止后的开启函数

//开启

function start(){

var stoptime = Cesium.JulianDate.addSeconds(starttime, Intervals, new Cesium.JulianDate());

viewer.clock.stopTime=stoptime.clone();

var popupchildrens=document.getElementById("bubbleContent").children;

for(var i=0;i

var childrenid=popupchildrens[i].id;

//popupchildrens[i].style.display="none";

$("#" + childrenid).remove(); //移除

}

代码下载：

未上传