Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
C
cesium-frame
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
jlc
cesium-frame
Commits
fe7e0488
Commit
fe7e0488
authored
Aug 05, 2024
by
jlc
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
update:大批量动目标websocket的初步修改
parent
e22378a3
Show whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
74 additions
and
75 deletions
+74
-75
movingTargetsWebsocket-function.js
...movingTargetsWebsocket/movingTargetsWebsocket-function.js
+62
-62
movingTargetsWebsocket.vue
...gTarget/movingTargetsWebsocket/movingTargetsWebsocket.vue
+12
-13
No files found.
src/examples/movingTarget/movingTargetsWebsocket/movingTargetsWebsocket-function.js
View file @
fe7e0488
...
...
@@ -4,68 +4,6 @@ export function addMovingTargetsWebsocket(viewer) {
console
.
log
(
'连接开启'
);
};
let
property
=
new
Cesium
.
SampledPositionProperty
();
let
start
=
Cesium
.
JulianDate
.
fromDate
(
new
Date
());
// 设置时间轴当前时间为开始时间
start
=
Cesium
.
JulianDate
.
addHours
(
start
,
8
,
new
Cesium
.
JulianDate
());
// 开始时间加8小时改为北京时间
let
stop
=
Cesium
.
JulianDate
.
addSeconds
(
start
,
400
,
new
Cesium
.
JulianDate
());
// 设置结束时间为开始时间加400秒
viewer
.
clock
.
startTime
=
start
.
clone
();
// 设置时钟开始时间
viewer
.
clock
.
currentTime
=
start
.
clone
();
// 设置时钟当前时间
viewer
.
clock
.
stopTime
=
stop
.
clone
();
// 设置时钟结束时间
viewer
.
clock
.
multiplier
=
1
;
// 设置时间倍数
viewer
.
timeline
.
zoomTo
(
start
,
stop
);
// 时间轴绑定到viewer上去
viewer
.
clock
.
clockRange
=
Cesium
.
ClockRange
.
LOOP_STOP
;
// 循环执行,到达终止时间,重新从起点时间开始
let
entity
=
viewer
.
entities
.
add
({
availability
:
new
Cesium
.
TimeIntervalCollection
([
new
Cesium
.
TimeInterval
({
start
:
start
,
stop
:
stop
})]),
position
:
property
,
orientation
:
new
Cesium
.
VelocityOrientationProperty
(
property
),
// 根据速度计算方向角
model
:
{
uri
:
'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/3Dmodel/ship.glb'
,
//gltf文件的URL
scale
:
0.05
,
// 放大倍数
silhouetteColor
:
Cesium
.
Color
.
fromCssColorString
(
'rgba(0, 255, 0, 1)'
),
// 船模型边框颜色
silhouetteSize
:
1
,
// 船模型边框宽度
minimumPixelSize
:
128
},
path
:
{
// 船路径
resolution
:
1
,
// 这个不知道是啥
material
:
new
Cesium
.
PolylineGlowMaterialProperty
({
glowPower
:
0.1
,
// 颜色透明度
color
:
Cesium
.
Color
.
fromCssColorString
(
'rgba(0, 253, 239, 0.5)'
)
// 路线颜色
}),
width
:
2
// 路线的显示宽度
}
});
viewer
.
trackedEntity
=
entity
;
// 视角跟随模型
ws
.
onmessage
=
function
(
event
)
{
const
data
=
JSON
.
parse
(
event
.
data
);
console
.
log
(
'Received data:'
,
data
);
// 更新位置属性
let
time
=
Cesium
.
JulianDate
.
addSeconds
(
start
,
data
.
time
,
new
Cesium
.
JulianDate
());
let
position
=
Cesium
.
Cartesian3
.
fromDegrees
(
data
.
longitude
,
data
.
latitude
,
data
.
height
);
property
.
addSample
(
time
,
position
);
};
ws
.
onclose
=
function
()
{
console
.
log
(
'连接关闭'
);
};
}
/**
* export function addMovingTargets(viewer) {
const ws = new WebSocket('ws://localhost:8080');
ws.onopen = function() {
console.log('连接开启');
};
let
start
=
Cesium
.
JulianDate
.
fromDate
(
new
Date
());
// 设置时间轴当前时间为开始时间
start
=
Cesium
.
JulianDate
.
addHours
(
start
,
8
,
new
Cesium
.
JulianDate
());
// 开始时间加8小时改为北京时间
let
stop
=
Cesium
.
JulianDate
.
addSeconds
(
start
,
400
,
new
Cesium
.
JulianDate
());
// 设置结束时间为开始时间加400秒
...
...
@@ -156,4 +94,65 @@ export function addMovingTargetsWebsocket(viewer) {
console
.
log
(
'连接关闭'
);
};
}
/**
* export function addMovingTargetsWebsocket(viewer) {
const ws = new WebSocket('ws://localhost:8080');
ws.onopen = function() {
console.log('连接开启');
};
let property = new Cesium.SampledPositionProperty();
let start = Cesium.JulianDate.fromDate(new Date()); // 设置时间轴当前时间为开始时间
start = Cesium.JulianDate.addHours(start, 8, new Cesium.JulianDate()); // 开始时间加8小时改为北京时间
let stop = Cesium.JulianDate.addSeconds(start, 400, new Cesium.JulianDate()); // 设置结束时间为开始时间加400秒
viewer.clock.startTime = start.clone(); // 设置时钟开始时间
viewer.clock.currentTime = start.clone(); // 设置时钟当前时间
viewer.clock.stopTime = stop.clone(); // 设置时钟结束时间
viewer.clock.multiplier = 1; // 设置时间倍数
viewer.timeline.zoomTo(start, stop); // 时间轴绑定到viewer上去
viewer.clock.clockRange = Cesium.ClockRange.LOOP_STOP; // 循环执行,到达终止时间,重新从起点时间开始
let entity = viewer.entities.add({
availability: new Cesium.TimeIntervalCollection([new Cesium.TimeInterval({
start: start,
stop: stop
})]),
position: property,
orientation: new Cesium.VelocityOrientationProperty(property), // 根据速度计算方向角
model: {
uri: 'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/3Dmodel/ship.glb', //gltf文件的URL
scale: 0.05, // 放大倍数
silhouetteColor: Cesium.Color.fromCssColorString('rgba(0, 255, 0, 1)'), // 船模型边框颜色
silhouetteSize: 1, // 船模型边框宽度
minimumPixelSize: 128
},
path: { // 船路径
resolution: 1, // 这个不知道是啥
material: new Cesium.PolylineGlowMaterialProperty({
glowPower: 0.1, // 颜色透明度
color: Cesium.Color.fromCssColorString('rgba(0, 253, 239, 0.5)') // 路线颜色
}),
width: 2 // 路线的显示宽度
}
});
viewer.trackedEntity = entity; // 视角跟随模型
ws.onmessage = function(event) {
const data = JSON.parse(event.data);
console.log('Received data:', data);
// 更新位置属性
let time = Cesium.JulianDate.addSeconds(start, data.time, new Cesium.JulianDate());
let position = Cesium.Cartesian3.fromDegrees(data.longitude, data.latitude, data.height);
property.addSample(time, position);
};
ws.onclose = function() {
console.log('连接关闭');
};
}
*/
\ No newline at end of file
src/examples/movingTarget/movingTargetsWebsocket/movingTargetsWebsocket.vue
View file @
fe7e0488
...
...
@@ -18,16 +18,16 @@ onMounted(() => {
baseLayerPicker
:
false
,
// 影像切换
animation
:
true
,
//是否显示动画控件
timeline
:
false
,
//是否显示时间线控件
infoBox
:
fals
e
,
//是否显示点击要素之后显示的信息
infoBox
:
tru
e
,
//是否显示点击要素之后显示的信息
geocoder
:
false
,
//是否显示地名查找控件
timeline
:
true
,
//是否启用时间线控件
fullscreenButton
:
false
,
shouldAnimate
:
true
,
navigationHelpButton
:
false
,
//是否显示帮助信息控件
terrainProvider
:
Cesium
.
createWorldTerrain
({
requestWaterMask
:
true
,
// required for water effects
requestVertexNormals
:
true
// required for terrain lighting
})
//
terrainProvider: Cesium.createWorldTerrain({
//
requestWaterMask: true, // required for water effects
//
requestVertexNormals: true // required for terrain lighting
//
})
})
addMovingTargetsWebsocket
(
viewer
)
...
...
@@ -48,7 +48,6 @@ onMounted(() => {
}
</
style
>
<!--
<template>
<div id="cesiumContainer" class="cesium-container"></div>
...
...
@@ -56,7 +55,7 @@ onMounted(() => {
<script setup>
import { onMounted } from 'vue';
import { addMovingTargets } from './function';
import { addMovingTargets
Websocket
} from './function';
let viewer;
...
...
@@ -70,19 +69,19 @@ onMounted(() => {
baseLayerPicker: false, // 影像切换
animation: true, //是否显示动画控件
timeline: false, //是否显示时间线控件
infoBox:
tru
e, //是否显示点击要素之后显示的信息
infoBox:
fals
e, //是否显示点击要素之后显示的信息
geocoder: false, //是否显示地名查找控件
timeline: true, //是否启用时间线控件
fullscreenButton: false,
shouldAnimate: true,
navigationHelpButton: false, //是否显示帮助信息控件
//
terrainProvider: Cesium.createWorldTerrain({
//
requestWaterMask: true, // required for water effects
//
requestVertexNormals: true // required for terrain lighting
//
})
terrainProvider: Cesium.createWorldTerrain({
requestWaterMask: true, // required for water effects
requestVertexNormals: true // required for terrain lighting
})
})
addMovingTargets(viewer)
addMovingTargets
Websocket
(viewer)
};
document.head.appendChild(script);
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment