From c6b04bbd291289e93131155249042c69c8d2d0bc Mon Sep 17 00:00:00 2001
From: master <master@163.com>
Date: 星期四, 09 六月 2022 10:49:05 +0800
Subject: [PATCH] 添加日历时间选择
---
public/hn3d/example/00_hn_new.html | 218 +++++++++++++++++++++++++++++++-----------------------
1 files changed, 126 insertions(+), 92 deletions(-)
diff --git a/public/hn3d/example/00_hn_new.html b/public/hn3d/example/00_hn_new.html
index 8e033a2..2739517 100644
--- a/public/hn3d/example/00_hn_new.html
+++ b/public/hn3d/example/00_hn_new.html
@@ -25,6 +25,8 @@
include="jquery,font-awesome,bootstrap,layer,haoutil,mars3d"></script>
<link href="./css/style.css" rel="stylesheet" />
+ <link rel="stylesheet" href="./css/time_search.css">
+ <link rel="stylesheet" href="./js/bootstrap/bootstrap-datepicker/bootstrap-datetimepicker.css">
<style>
.btn-primary {
margin: 2px;
@@ -91,7 +93,7 @@
<input type="button" class="btn btn-primary" value="妫氬唴" onclick="centerAtDX3()" />
</div>
</div>
-
+ <!-- 鎿嶄綔鎸夐挳鏍� -->
<div class="infoview handle">
<button type="button" id="meipeng" class="btn btn-primary active" style="width: 100%;">鐓ゆ鏁翠綋</button>
<button type="button" id="meipeng_qiang_ding" class="btn btn-primary" style="width: 100%;">澧欓潰妫氶《</button>
@@ -103,11 +105,38 @@
<button type="button" id="point_btn" class="btn btn-primary" style="width: 100%;">鐓ゅ爢</button>
</div>
<!-- 鏃堕棿绾� -->
- <div id="timeline"
- style="white-space:nowrap;height: 20px;width: 500px;position: absolute;bottom: 100px;left: 100px;overflow: scroll;">
- <!-- <hr class="time_line"> -->
+ <div id="timeline">
</div>
+
+ <!-- 鏃ュ巻閫夋嫨妗� -->
+
+ <div class="search">
+ <div class="container">
+ <form action="" class="form-horizontal">
+ <fieldset>
+ <div class="controls input-append date form_datetime" data-date="2019-09-16T05:25:07Z"
+ data-date-format="dd MM yyyy - HH:ii p" data-link-field="dtp_input1">
+ <input size="16" type="text" value="2019-10-01 10:07:00" readonly class="time1">
+ <!-- <span class="add-on"><i class="icon-remove"></i></span> -->
+ <span class="add-on"><i class="icon-th"></i></span>
+ </div>
+ <input type="hidden" id="dtp_input1" value="" />
+ <div class="controls input-append date form_datetime" data-date="2019-09-16T05:25:07Z"
+ data-date-format="dd MM yyyy - HH:ii p" data-link-field="dtp_input1">
+ <input size="16" type="text" value="2019-10-01 12:00:00" readonly class="time2">
+ <!-- <span class="add-on"><i class="icon-remove"></i></span> -->
+ <span class="add-on"><i class="icon-th"></i></span>
+ </div>
+ <input type="hidden" id="dtp_input1" value="" />
+ </fieldset>
+ </form>
+ </div><br />
+ <button class="search_time_btn" style="background-color: #394582;">鏌ヨ</button>
+ </div>
+
+ <script src="./js/bootstrap/bootstrap-datepicker/bootstrap-datetimepicker.js"></script>
+ <script src="./js/bootstrap/bootstrap-datepicker/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="./js/common.js"></script>
<script type="text/javascript">
"use script"; //寮�鍙戠幆澧冨缓璁紑鍚弗鏍兼ā寮�
@@ -156,31 +185,44 @@
}
})
- $.ajax({
- type: 'get',
- dataType: 'json',
- async: false,//鍚屾
- headers: {
- "Access-Control-Allow-Origin": "*"
- // "Accept": "application/json"
- },
- url: `${data_url}get_point_cloud`,
- success: function (data) {
- console.log(data, "point_data")
- point_model = data.data
- var time_box_html = ''
- for (let i = 1; i < point_model.length; i++) {
- time_box_html += `<span class="time_box "></span>
- <span class="message">${point_model[i].createTime}</span>`
- }
- $("#timeline").append(time_box_html)
- },
- error: function (request, textStatus) {
+ // $.ajax({
+ // type: 'get',
+ // dataType: 'json',
+ // async: false,//鍚屾
+ // headers: {
+ // "Access-Control-Allow-Origin": "*"
+ // // "Accept": "application/json"
+ // },
+ // url: `${data_url}get_point_cloud`,
+ // success: function (data) {
+ // console.log(data, "point_data")
+ // point_model = data.data
+ // var time_box_html = ''
+ // for (let i = 1; i < point_model.length; i++) {
+ // time_box_html += `<span class="time_box "></span>
+ // <span class="message">${point_model[i].createTime}</span>`
+ // }
+ // $("#timeline").append(time_box_html)
+ // },
+ // error: function (request, textStatus) {
- }
- })
+ // }
+ // })
+
+ $('.form_datetime').datetimepicker({
+ language: 'zh-CN', //璁剧疆涓轰腑鏂�
+ format: 'yyyy-mm-dd hh:ii:00', //璁剧疆鏃ユ湡鏍煎紡
+ weekStart: 1,
+ todayBtn: 1,
+ autoclose: 1,
+ todayHighlight: 1,
+ startView: 2,
+ forceParse: 0,
+ showMeridian: 1
+ });
})
+ // 鍒濆鍖栧湴鐞冨弬鏁�
function initMap (options) {
//鍚堝苟灞炴�у弬鏁帮紝鍙鐩朿onfig.json涓殑瀵瑰簲閰嶇疆
var mapOptions = mars3d.Util.merge(options, {
@@ -308,7 +350,7 @@
],
});
- addCustomLayers()
+ // addCustomLayers()
//鍒涘缓涓夌淮鍦扮悆鍦烘櫙
@@ -422,8 +464,11 @@
});
// 鐐瑰嚮鏃堕棿杞村垏鎹㈢叅鍫嗘ā鍨�
- $(".time_box").click(function (e) {
- var index_ = $("#timeline .time_box").index(this);
+ $(document).on('click', '.time_box', function (e) {
+ console.log(e.target.nextSibling.nextSibling.textContent, "鐐瑰嚮")
+ let time_ = e.target.nextSibling.nextSibling.textContent;
+ // var index_ = $("#timeline .time_box").index(this);
+ // console.log(index_)
$.ajax({
type: 'get',
dataType: 'json',
@@ -432,12 +477,11 @@
"Access-Control-Allow-Origin": "*"
// "Accept": "application/json"
},
- url: `${data_url}get_point_cloud_NO&index_=${index_}`,
+ url: `${data_url}get_point_cloud_NO&index_=${time_}`,
success: function (data) {
console.log(data, "NO_data")
let data_path = data.data[0].data_path
if (pointPrimitives) {
- console.log("绉婚櫎")
pointPrimitives.destroy(true)
}
$.ajax({
@@ -458,6 +502,7 @@
// 璇锋眰鏁版嵁搴撴暟鎹紝瀵规枟杞満妯″瀷杩涜鎿嶄綔
$("#test_btn").click(function () {
+ // openTimeBox()
$("#test_btn").addClass("disable");
console.log(dou_params)
if (model_no < dou_params.length - 1) {
@@ -466,21 +511,6 @@
model_no = 0
}
let item = dou_params[model_no]
- console.log(item)
- // var data_path = item.data_path
- // console.log("鎴戠偣鍑讳簡")
- // console.log(pointPrimitives)
- // if (pointPrimitives) {
- // console.log("绉婚櫎")
- // pointPrimitives.destroy(true)
- // }
- // $.ajax({
- // url: data_path,
- // dataType: 'text',
- // success: function (data) {
- // addPointCloud(data)
- // }
- // });
dou_move(item.longitude, item.latitude, item.elevation, item.heading_angle)
setTimeout(function () {
@@ -540,32 +570,7 @@
})
- // 鏂楄疆鏈虹Щ鍔�
- $("#dou_move").click(function () {
- dou1.moveTo({
- position: [121.406371, 31.466697, 15.3]
- })
- dou2.moveTo({
- position: [121.406371, 31.466697, 15.3]
- })
- dou3.moveTo({
- position: [121.406371, 31.466697, 15.3]
- })
- dou4.moveTo({
- position: [121.406371, 31.466697, 15.3]
- })
- })
-
-
-
- // 鏂楄疆鏈哄伐浣�
- function douWork () {
- console.log("宸ヤ綔涓�")
- dou3.setStyle({
- roll: 50
- })
- }
@@ -584,8 +589,12 @@
heading: dou_data.heading
})
})
+
+ // 鐓ゅ爢鎸夐挳
$("#point_btn").click(function () {
- $("#timeline").toggle();
+ $("#timeline").css({ display: 'none' })
+ $(".search").toggle();
+ console.log(search)
})
$(function () {
@@ -607,7 +616,7 @@
return newArray;
}
- // 鍔犺浇鐐逛簯鏂规硶
+ // 灏佽鍔犺浇鐐逛簯鏂规硶
function addPointCloud (data) {
// 鐢虫槑鐐规覆鏌撻泦鍚�
pointPrimitives = map.viewer.scene.primitives.add(new Cesium.PointPrimitiveCollection());
@@ -616,9 +625,13 @@
list = group(data_list, 3)//灏嗚浆鎹㈠悗鐨勬暟鎹瘡鍏釜鍒嗕负涓�缁�
// 寰幆鏁扮粍锛屽姞杞界偣浜�
for (var i = 0; i < list.length; i++) {
- var hn_lon = Number(list[i][0]) / distance_half + 121.398442;
- var hn_lat = Number(list[i][1]) / distance_half + 31.460107;
- var hn_h = 300 - Number(list[i][2]);
+ // 鐪熺湡瀹炴硶
+ // var hn_lon = Number(list[i][0]) / distance_half + 121.398442;
+ // var hn_lat = Number(list[i][1]) / distance_half + 31.460107;
+ // var hn_h = 300 - Number(list[i][2]);
+ var hn_lon = Number(list[i][0]) / 151319.5 + 121.405902;
+ var hn_lat = Number(list[i][1]) / 151319.5 + 31.467607;
+ var hn_h = 200 - Number(list[i][2]);
var color_b = Math.floor(hn_h)
if (hn_h <= 50) {
color = Cesium.Color.fromCssColorString(`rgba(0, ${color_b}, ${color_b}, 1)`)
@@ -642,6 +655,43 @@
+ // 鎵撳紑
+ $(".search_time_btn").click(function () {
+ $("#timeline").css({ display: 'block' })
+ $("#timeline").empty()
+ let time1 = $(".time1").val()
+ let time2 = $(".time2").val()
+ $.ajax({
+ type: 'get',
+ dataType: 'json',
+ async: false,//鍚屾
+ headers: {
+ "Access-Control-Allow-Origin": "*"
+ // "Accept": "application/json"
+ },
+ url: `${data_url}get_point_by_time&time1=${time1}&time2=${time2}`,
+ success: function (data) {
+ console.log(data, "point_data")
+ point_model = data.data
+ var time_box_html = ''
+ for (let i = 1; i < point_model.length + 1; i++) {
+ time_box_html += `<span class="time_box"></span>
+ <span class="message">${point_model[i - 1].createTime}</span>`
+ }
+ $("#timeline").append(time_box_html)
+
+ },
+ error: function (request, textStatus) {
+
+ }
+ })
+ })
+
+
+
+
+
+
@@ -660,19 +710,6 @@
-
-
-
-
-
-
-
-
-
- // 璇曞姞杞絋XT鐐逛簯鏂囦欢
- function addPrimitivesPointFromJSONTest () {
- console.log(map, "map")
- }
@@ -706,9 +743,6 @@
});
}
- function addCustomLayers () {
- addPrimitivesPointFromJSONTest()
- }
</script>
</body>
--
Gitblit v1.9.1