166 lines
6.7 KiB
HTML
166 lines
6.7 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
<html lang="en">
|
|||
|
|
|||
|
<head>
|
|||
|
<meta charset="UTF-8">
|
|||
|
<title>Title</title>
|
|||
|
<!-- <script src="https://cesium.com/downloads/cesiumjs/releases/1.117/Build/Cesium/Cesium.js"></script> -->
|
|||
|
<script src="../sdk/YJEarth.min.js"></script>
|
|||
|
<script src="vue.js"></script>
|
|||
|
<script src="./js/video.js"></script>
|
|||
|
<style>
|
|||
|
body {
|
|||
|
width: 100%;
|
|||
|
height: 100%;
|
|||
|
}
|
|||
|
</style>
|
|||
|
</head>
|
|||
|
|
|||
|
<body>
|
|||
|
<div id="app" class="fullSize">
|
|||
|
<live-player style="display: inline-block;width: 300px;height: 150px;"
|
|||
|
video-url="http://127.0.0.1:5501/example/video/1.flv" live="false" stretch="true"></live-player>
|
|||
|
<button style="position: absolute;z-index: 99999;" @Click="test">显隐</button>
|
|||
|
<button style="position: absolute;z-index: 99999;left: 50px;" @Click="draw1">1</button>
|
|||
|
<button style="position: absolute;z-index: 99999;left: 80px;" @Click="draw2">2</button>
|
|||
|
</div>
|
|||
|
</body>
|
|||
|
|
|||
|
</html>
|
|||
|
|
|||
|
<script>
|
|||
|
new Vue({
|
|||
|
el: "#app",
|
|||
|
data: {
|
|||
|
// flag: false,
|
|||
|
},
|
|||
|
async mounted() {
|
|||
|
await YJ.on({ host: 'http://192.168.110.71:82' })
|
|||
|
this.createEarth()
|
|||
|
},
|
|||
|
methods: {
|
|||
|
createEarth() {
|
|||
|
window.sdk = new YJ.YJEarth("app")
|
|||
|
YJ.Global.CesiumContainer(sdk, {
|
|||
|
info: true
|
|||
|
})
|
|||
|
let draw = new YJ.Draw.DrawPoint(window.sdk);
|
|||
|
draw.start((err, position) => {
|
|||
|
if (position != undefined) {
|
|||
|
position.alt += 20
|
|||
|
const LoadObjModel = new YJ.Obj.LoadObjModel(
|
|||
|
sdk,
|
|||
|
{
|
|||
|
name: '4444444',
|
|||
|
position: position,
|
|||
|
// objId: '82',
|
|||
|
// videoId: '8108999150859255808',
|
|||
|
objUrl: "model/同心小区30栋楼顶东北向东(枪)/同心小区30栋楼顶东北向东(枪).obj",
|
|||
|
// videoUrl: "ws://192.168.112.127:10000/sms/34020000002020000001/ws-flv/hls/65320100001321234193_65320100001321234193.flv",
|
|||
|
videoUrl: "http://127.0.0.1:5501/example/video/1.flv",
|
|||
|
// heading: 106,
|
|||
|
// pitch: 89,
|
|||
|
// roll: 65
|
|||
|
}
|
|||
|
);
|
|||
|
window.LoadObjModel = LoadObjModel;
|
|||
|
LoadObjModel.Dialog.confirmCallBack = (v) => {
|
|||
|
console.log(v)
|
|||
|
}
|
|||
|
LoadObjModel.load(() => {
|
|||
|
LoadObjModel.flyTo()
|
|||
|
LoadObjModel.edit(true)
|
|||
|
})
|
|||
|
}
|
|||
|
});
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
window.tileset = new YJ.Obj.Tileset(window.sdk, {
|
|||
|
show: true,
|
|||
|
url: "http://127.0.0.1:8891/yjearth4.0/data/tileset/24b9be7e2cdfa679b3a77c6c51b47bdc/tileset.json",
|
|||
|
id: "123456",
|
|||
|
// transparency: 0.2
|
|||
|
position: { lng: 100, lat: 40, alt: 10 }
|
|||
|
})
|
|||
|
this.sdk = window.sdk
|
|||
|
tileset.on().then((res) => {
|
|||
|
tileset.flyTo()
|
|||
|
tileset.edit(true)
|
|||
|
}).catch(msg => {
|
|||
|
console.log(msg)
|
|||
|
})
|
|||
|
|
|||
|
|
|||
|
},
|
|||
|
draw1() {
|
|||
|
let draw = new YJ.Draw.DrawPoint(window.sdk);
|
|||
|
draw.start((err, position) => {
|
|||
|
if (position != undefined) {
|
|||
|
position.alt += 20
|
|||
|
const LoadObjModel = new YJ.Obj.LoadObjModel(
|
|||
|
sdk,
|
|||
|
{
|
|||
|
name: '4444444',
|
|||
|
position: position,
|
|||
|
// objId: '53',
|
|||
|
// videoId: '8108999150859255808',
|
|||
|
objUrl: "model/同心小区obj/同心小区42栋楼顶南向南(枪)/同心小区42栋楼顶南向南(枪).obj",
|
|||
|
videoUrl: "ws://192.168.112.127:10000/sms/34020000002020000001/ws-flv/hls/65320100001321234193_65320100001321234193.flv",
|
|||
|
// videoUrl: "http://220.161.87.62:8800/hls/1/index.m3u8",
|
|||
|
// heading: 106,
|
|||
|
// pitch: 89,
|
|||
|
// roll: 65
|
|||
|
}
|
|||
|
);
|
|||
|
window.LoadObjModel = LoadObjModel;
|
|||
|
LoadObjModel.Dialog.confirmCallBack = (v) => {
|
|||
|
}
|
|||
|
LoadObjModel.load(() => {
|
|||
|
LoadObjModel.flyTo()
|
|||
|
LoadObjModel.edit(true)
|
|||
|
})
|
|||
|
}
|
|||
|
});
|
|||
|
},
|
|||
|
draw2() {
|
|||
|
let draw = new YJ.Draw.DrawPoint(window.sdk);
|
|||
|
draw.start((err, position) => {
|
|||
|
if (position != undefined) {
|
|||
|
position.alt += 20
|
|||
|
const LoadObjModel = new YJ.Obj.LoadObjModel(
|
|||
|
sdk,
|
|||
|
{
|
|||
|
name: '4444444',
|
|||
|
position: position,
|
|||
|
// objId: '53',
|
|||
|
// videoId: '8108999150859255808',
|
|||
|
objUrl: "model/同心小区obj/同心小区42栋楼顶南向南(枪)/同心小区42栋楼顶南向南(枪).obj",
|
|||
|
videoUrl: "ws://192.168.112.127:10000/sms/34020000002020000001/ws-flv/hls/65320100001321234193_65320100001321234193.flv",
|
|||
|
// videoUrl: "http://220.161.87.62:8800/hls/1/index.m3u8",
|
|||
|
// heading: 106,
|
|||
|
// pitch: 89,
|
|||
|
// roll: 65
|
|||
|
}
|
|||
|
);
|
|||
|
window.LoadObjModel = LoadObjModel;
|
|||
|
LoadObjModel.Dialog.confirmCallBack = (v) => {
|
|||
|
}
|
|||
|
LoadObjModel.load(() => {
|
|||
|
LoadObjModel.flyTo()
|
|||
|
LoadObjModel.edit(true)
|
|||
|
})
|
|||
|
}
|
|||
|
});
|
|||
|
},
|
|||
|
test() {
|
|||
|
LoadObjModel.show = this.flag
|
|||
|
this.flag = !this.flag
|
|||
|
}
|
|||
|
}
|
|||
|
})
|
|||
|
</script>
|