From 5f1ab2845cc49450bc9af1002f421574c7e1fe12 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Tue, 15 Jun 2021 16:09:18 +0800
Subject: [PATCH] 地图图标点击 视频和监控完成
---
widgets/searchTabaPopup/Widget.js | 9 +++-
widgets/searchTabaPopup/Widget.html | 7 ++-
widgets/searchTabaPopup/css/style.css | 14 ++++---
widgets/searchL/Widget.js | 83 ++++++++++++++++++++++++++++++++++++-----
4 files changed, 93 insertions(+), 20 deletions(-)
diff --git a/widgets/searchL/Widget.js b/widgets/searchL/Widget.js
index 2881845..b549d7c 100644
--- a/widgets/searchL/Widget.js
+++ b/widgets/searchL/Widget.js
@@ -78,7 +78,7 @@
that.map.camera.flyTo({
// destination: Cesium.Cartesian3.fromDegrees(Number(lng), Number(lat), Number(gaodu))
destination: Cesium.Cartesian3.fromDegrees(Number(that.searchDatas[0]), Number(that.searchDatas[1]), Number(8000))
-
+
});
} else {
layui.use(function () { //亦可加载特定模块：layui.use(['layer', 'laydate', function(){
@@ -205,6 +205,76 @@
that.getData(val, that.searchDatas);
});
});
+
+ // 地图图标点击事件
+ this.movehandLer();
+ },
+ // 获取鼠标事件
+ movehandLer: function movehandLer() {
+ // 取消默认双击事件
+ this.map.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
+ // 获取鼠标事件
+ this.mountainHandler = new Cesium.ScreenSpaceEventHandler(this.map.scene.canvas);
+ // 给鼠标左键添加事件函数
+ // this.mountainHandler.setInputAction(lang.hitch(this, this.mouseMove), Cesium.ScreenSpaceEventType.MOUSE_MOVE);
+ this.mountainHandler.setInputAction(lang.hitch(this, this.clickHand), Cesium.ScreenSpaceEventType.LEFT_CLICK);
+ },
+ // 注册鼠标左键单击事件
+ clickHand: function clickHand(data) {
+ var pickedObjects = this.map.scene.drillPick(data.position);
+ console.log(pickedObjects[0].primitive.id.onceData);
+ var data = pickedObjects[0].primitive.id.onceData[1];
+ if (pickedObjects[0].primitive.id.onceData[0] == 1) {//全景
+ var address = data.panAddress;
+ var dom = $('.header'),
+ str = `${data.name}--全景`;
+ dom.empty();
+ dom.append(str);
+
+ dom = $('#poput-m-t-quanjing');
+ str = `<iframe id="poput-m-t-quanjing-iframe" src="${address}" frameborder="0"></iframe>`;
+ dom.empty();
+ dom.append(str);
+ $('.jimu-widget-searchTabaPopup').css({ 'display': 'block' });
+ $('.jimu-widget-searchTabaPopup').find('.p-main').eq(0).css({ 'display': 'block' }).siblings().css({ 'display': 'none' });
+ }
+ if (pickedObjects[0].primitive.id.onceData[0] == 2) {//视频
+ var dom = $('.header'),
+ str = `${data.name}--实时视频`;
+ dom.empty();
+ dom.append(str);
+ if (data.flv) {
+ dom = $('#poput-m-t-video');
+ str = `
+ <video id="poput-m-t-video-video" ></video>
+ `;
+ dom.empty();
+ dom.append(str);
+ if (flvjs.isSupported()) {
+ var videoElement = document.getElementById('poput-m-t-video-video');
+ var flvPlayer = flvjs.createPlayer({
+ type: 'flv',
+ url: data.flv
+ });
+ flvPlayer.attachMediaElement(videoElement);
+ flvPlayer.load();
+ flvPlayer.play();
+ }
+ window.$myVideoFlvplayer = flvPlayer;
+ // var time = setTimeout(() => {
+
+ // }, 2000);
+ } else {
+ var dom = $('#poput-m-t-video'),
+ str = `
+ <div id="poput-m-t-video-none" >·暂无视频</div>
+ `;
+ dom.empty();
+ dom.append(str);
+ }
+ $('.jimu-widget-searchTabaPopup').css({ 'display': 'block' });
+ $('.jimu-widget-searchTabaPopup').find('.p-main').eq(0).css({ 'display': 'block' }).siblings().css({ 'display': 'none' });
+ }
},
onClose: function () {
@@ -262,7 +332,8 @@
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
disableDepthTestDistance: Number.POSITIVE_INFINITY,
// rotation: Cesium.Math.toRadians(angle),
- }
+ },
+ onceData: [i, data]
})
},
beginLayUi: function (data = 1, data1 = 1, data2 = 1) {
@@ -351,16 +422,11 @@
dom.append(str);
if (obj.data.flv) {
var dom = $('#poput-m-t-video'),
- // <div id="poput-m-t-video-login"><i class="layui-icon"></i></div>
str = `
<video id="poput-m-t-video-video" ></video>
`;
dom.empty();
dom.append(str);
-
- // console.log(obj.data.name);
- // console.log(obj.data.flv);
-
if (flvjs.isSupported()) {
var videoElement = document.getElementById('poput-m-t-video-video');
var flvPlayer = flvjs.createPlayer({
@@ -383,9 +449,6 @@
dom.empty();
dom.append(str);
}
-
-
-
$('.jimu-widget-searchTabaPopup').css({ 'display': 'block' });
$('.jimu-widget-searchTabaPopup').find('.p-main').eq(0).css({ 'display': 'block' }).siblings().css({ 'display': 'none' });
} else if (layEvent === 'edit') {
diff --git a/widgets/searchTabaPopup/Widget.html b/widgets/searchTabaPopup/Widget.html
index 5273bde..544d395 100644
--- a/widgets/searchTabaPopup/Widget.html
+++ b/widgets/searchTabaPopup/Widget.html
@@ -1,11 +1,14 @@
<div>
<div class="popup">
<div class="p-main two" id="twovideo">
- <div class="cloce"><i class="layui-icon">ဆ</i></div>
+ <div class="cloce"><i class="layui-icon">ဆ</i></div>
<div class="header">江豚湾--实时视频</div>
<div id="poput-m-t-video">
<!-- <video id="poput-m-t-video-video" ></video> -->
- </div>
+ </div>
+ <div id="poput-m-t-quanjing">
+ <!-- <iframe id="poput-m-t-quanjing-iframe" src="http://vr.jxpskj.com/pyhyjpt/wxbhxz/QJ1/" frameborder="0"></iframe> -->
+ </div>
</div>
<div class="p-main three">
<div class="cloce"><i class="layui-icon">ဆ</i></div>
diff --git a/widgets/searchTabaPopup/Widget.js b/widgets/searchTabaPopup/Widget.js
index af52577..af73839 100644
--- a/widgets/searchTabaPopup/Widget.js
+++ b/widgets/searchTabaPopup/Widget.js
@@ -46,6 +46,11 @@
that.myChart2.clear();
$('.myCHosetimeinput').val("");
that.times = [1];
+
+ var dom = $('#poput-m-t-video');
+ dom.empty();
+ dom = $('#poput-m-t-quanjing');
+ dom.empty();
})
$('.jimu-widget-searchTabaPopup').find('#query').click(() => {
@@ -81,7 +86,7 @@
onOpen: function () {
var that = this;
-
+
// $('.jimu-widget-searchTabaPopup').css({ 'display': 'block' });
// $('.jimu-widget-searchTabaPopup').find('.p-main').eq(1).css({ 'display': 'block' }).siblings().css({ 'display': 'none' });
@@ -218,7 +223,7 @@
// text: '折线图堆叠'
// },
animationDuration: 1000,
- color: ['#1AD4AD', '#5AB1EF', '#F96D85', '#FFBD87', '#0067A5','#CABDE7','#D87C82','#A0BEFF','#D9D0C7','#8DAD9C'],
+ color: ['#1AD4AD', '#5AB1EF', '#F96D85', '#FFBD87', '#0067A5', '#CABDE7', '#D87C82', '#A0BEFF', '#D9D0C7', '#8DAD9C'],
dataZoom: [{
type: 'slider'
}, {
diff --git a/widgets/searchTabaPopup/css/style.css b/widgets/searchTabaPopup/css/style.css
index 412e374..551da24 100644
--- a/widgets/searchTabaPopup/css/style.css
+++ b/widgets/searchTabaPopup/css/style.css
@@ -77,12 +77,14 @@
overflow: hidden;
}
-/* .jimu-widget-searchTabaPopup .two #poput-m-t-video .title{
- color: #409EFF;
- width: 92%;
- font-size: 25px;
- padding: 20px 0 8px 0;
-} */
+
+.jimu-widget-searchTabaPopup .two #poput-m-t-quanjing-iframe{
+ width: 100%;
+ height: 560px;
+ position: absolute;
+ top: 40px;
+ /* z-index: 14; */
+}
.jimu-widget-searchTabaPopup .two .header {
background-color: #409EFF;
--
Gitblit v1.9.3