template/liaocheng_gis.git

parent: f7462de5 | 补丁 | 提交 | ignore whitespace

2022-07-05 26156c8fb646998c87be464735c0df8ea26c836c

添加聊城遮罩层

1 文件已重命名

5个文件已修改

	gltf/BS.gltf	补丁 \| 查看 \| 原始文档 \| blame \| 历史
	index.html	2 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	js/function_1001.js	78 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	js/index.js	42 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	widgetsTS/widget_detail/view.js	1 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	widgetsTS/widget_grid/webworker.js	4 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史

 gltf/BS.gltf


 index.html

@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html class="no-js css-menubar" lang="zh-cn">
  <head>
    <title>聊城市市道路交通环境监测平台</title>
    <title>聊城市道路交通环境监测平台</title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <!-- 移动设备 viewport -->

 js/function_1001.js

@@ -5,48 +5,48 @@
// for change color locally.
var data_list_1001;

const graphicLayer = new this.mars3d.layer.GraphicLayer()
      map.addLayer(graphicLayer)
// const graphicLayer = new this.mars3d.layer.GraphicLayer()
//       map.addLayer(graphicLayer)


// 聊城边界
const maskLayer = new this.mars3d.layer.GeoJsonLayer({
  id: 300,
  url: "/data/liaocheng.geojson",
  mask: true,
  symbol: {
    styleOptions: {
      fill: true,
      color: "#111111",
      opacity: 0.9,
      outline: false,
      outlineColor: "#39E09B",
      outlineWidth: 8,
      outlineOpacity: 0.8,
      arcType: Cesium.ArcType.GEODESIC,
      clampToGround: true,
    },
  },
  show: true,
  flyTo: false
});
// 边界墙
const graphic = new this.mars3d.graphic.WallEntity({
  positions: this.liaocheng_boundary,
  style: {
    diffHeight: 1500,
    material: this.mars3d.MaterialUtil.createMaterialProperty(this.mars3d.MaterialType.LineFlow, {
      image: "img/textures/fence.png",
      color: "#bdf700",
      repeat: new Cesium.Cartesian2(5, 1),
      axisY: true, // 方向，true时上下，false左右
      speed: 15
    })
  }
})
graphicLayer.addGraphic(graphic)
// // 聊城边界
// const maskLayer = new this.mars3d.layer.GeoJsonLayer({
//   id: 300,
//   url: "/data/liaocheng.geojson",
//   mask: true,
//   symbol: {
//     styleOptions: {
//       fill: true,
//       color: "#111111",
//       opacity: 0.9,
//       outline: false,
//       outlineColor: "#39E09B",
//       outlineWidth: 8,
//       outlineOpacity: 0.8,
//       arcType: Cesium.ArcType.GEODESIC,
//       clampToGround: true,
//     },
//   },
//   show: true,
//   flyTo: false
// });
// // 边界墙
// const graphic = new this.mars3d.graphic.WallEntity({
//   positions: this.liaocheng_boundary,
//   style: {
//     diffHeight: 1500,
//     material: this.mars3d.MaterialUtil.createMaterialProperty(this.mars3d.MaterialType.LineFlow, {
//       image: "img/textures/fence.png",
//       color: "#bdf700",
//       repeat: new Cesium.Cartesian2(5, 1),
//       axisY: true, // 方向，true时上下，false左右
//       speed: 15
//     })
//   }
// })
// graphicLayer.addGraphic(graphic)

map.addLayer(maskLayer);
// map.addLayer(maskLayer);

function addWMSLayer(item) {


 js/index.js

@@ -72,6 +72,31 @@
      //构建地图
      initMap(data.map3d);


// 聊城边界
const maskLayer = new mars3d.layer.GeoJsonLayer({
  id: 300,
  url: "../data/liaocheng.geojson",
  mask: true,
  zIndex:100,
  symbol: {
    styleOptions: {
      fill: true,
      color: "#111111",
      opacity: 0.9,
      outline: false,
      outlineColor: "#39E09B",
      outlineWidth: 8,
      outlineOpacity: 0.8,
      arcType: Cesium.ArcType.GEODESIC,
      clampToGround: true,
    },
  },
  show: true,
  flyTo: false
});

map.addLayer(maskLayer);
      setTimeout(removeMask, 3000); //欢迎UI关闭处理
    },
    error: function (request, textStatus) {
@@ -83,8 +108,25 @@
  });

  initUI();




// const graphicLayer = new mars3d.layer.GraphicLayer()
//       map.addLayer(graphicLayer)






});






function removeMask() {
  $("#mask").remove();
}

 widgetsTS/widget_detail/view.js

@@ -252,6 +252,7 @@
        async: false, //同步
        url: backend_url,
        success: function (data) {
            console.log(data,"wange")
            var tableData = data.data.result;
            if (tableData != null && tableData.length > 0) {
                var seriesObj = {};

 widgetsTS/widget_grid/webworker.js

@@ -487,13 +487,16 @@


function createKrigingGrid(dataItems,gridLevel,qindex) {
    console.log(dataItems,"dataItems")
   
    var t = [];
    var x = [];
    var y = [];
    for (var i = 0, len = dataItems.length; i < len; i++) {

        t.push(dataItems[i][qindex]); // 权重值
        var tmp_grid_id = dataItems[i]["grid_id"];
        console.log(tmp_grid_id,"no split")
        var lon_lat = tmp_grid_id.split("_");
        if (gridLevel == 5000) {
            x.push(Number(lon_lat[0]) + 0.025); // x
@@ -517,6 +520,7 @@
console.log("webworker is loaded.");

this.onmessage = event => {
    console.log(event,"event")
    self.postMessage(createKrigingGrid(event.data.dataItems,event.data.gridLevel,event.data.qindex));
    //self.close();
}

			@@ -1,7 +1,7 @@
			<!DOCTYPE html>
			<html class="no-js css-menubar" lang="zh-cn">
			<head>
			<title>聊城市市道路交通环境监测平台</title>
			<title>聊城市道路交通环境监测平台</title>
			<meta charset="utf-8" />
			<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
			<!-- 移动设备 viewport -->

			@@ -5,48 +5,48 @@
			// for change color locally.
			var data_list_1001;

			const graphicLayer = new this.mars3d.layer.GraphicLayer()
			map.addLayer(graphicLayer)
			// const graphicLayer = new this.mars3d.layer.GraphicLayer()
			// map.addLayer(graphicLayer)


			// 聊城边界
			const maskLayer = new this.mars3d.layer.GeoJsonLayer({
			id: 300,
			url: "/data/liaocheng.geojson",
			mask: true,
			symbol: {
			styleOptions: {
			fill: true,
			color: "#111111",
			opacity: 0.9,
			outline: false,
			outlineColor: "#39E09B",
			outlineWidth: 8,
			outlineOpacity: 0.8,
			arcType: Cesium.ArcType.GEODESIC,
			clampToGround: true,
			},
			},
			show: true,
			flyTo: false
			});
			// 边界墙
			const graphic = new this.mars3d.graphic.WallEntity({
			positions: this.liaocheng_boundary,
			style: {
			diffHeight: 1500,
			material: this.mars3d.MaterialUtil.createMaterialProperty(this.mars3d.MaterialType.LineFlow, {
			image: "img/textures/fence.png",
			color: "#bdf700",
			repeat: new Cesium.Cartesian2(5, 1),
			axisY: true, // 方向，true时上下，false左右
			speed: 15
			})
			}
			})
			graphicLayer.addGraphic(graphic)
			// // 聊城边界
			// const maskLayer = new this.mars3d.layer.GeoJsonLayer({
			// id: 300,
			// url: "/data/liaocheng.geojson",
			// mask: true,
			// symbol: {
			// styleOptions: {
			// fill: true,
			// color: "#111111",
			// opacity: 0.9,
			// outline: false,
			// outlineColor: "#39E09B",
			// outlineWidth: 8,
			// outlineOpacity: 0.8,
			// arcType: Cesium.ArcType.GEODESIC,
			// clampToGround: true,
			// },
			// },
			// show: true,
			// flyTo: false
			// });
			// // 边界墙
			// const graphic = new this.mars3d.graphic.WallEntity({
			// positions: this.liaocheng_boundary,
			// style: {
			// diffHeight: 1500,
			// material: this.mars3d.MaterialUtil.createMaterialProperty(this.mars3d.MaterialType.LineFlow, {
			// image: "img/textures/fence.png",
			// color: "#bdf700",
			// repeat: new Cesium.Cartesian2(5, 1),
			// axisY: true, // 方向，true时上下，false左右
			// speed: 15
			// })
			// }
			// })
			// graphicLayer.addGraphic(graphic)

			map.addLayer(maskLayer);
			// map.addLayer(maskLayer);

			function addWMSLayer(item) {

			@@ -72,6 +72,31 @@
			//构建地图
			initMap(data.map3d);


			// 聊城边界
			const maskLayer = new mars3d.layer.GeoJsonLayer({
			id: 300,
			url: "../data/liaocheng.geojson",
			mask: true,
			zIndex:100,
			symbol: {
			styleOptions: {
			fill: true,
			color: "#111111",
			opacity: 0.9,
			outline: false,
			outlineColor: "#39E09B",
			outlineWidth: 8,
			outlineOpacity: 0.8,
			arcType: Cesium.ArcType.GEODESIC,
			clampToGround: true,
			},
			},
			show: true,
			flyTo: false
			});

			map.addLayer(maskLayer);
			setTimeout(removeMask, 3000); //欢迎UI关闭处理
			},
			error: function (request, textStatus) {
			@@ -83,8 +108,25 @@
			});

			initUI();




			// const graphicLayer = new mars3d.layer.GraphicLayer()
			// map.addLayer(graphicLayer)






			});






			function removeMask() {
			$("#mask").remove();
			}

			@@ -252,6 +252,7 @@
			async: false, //同步
			url: backend_url,
			success: function (data) {
			console.log(data,"wange")
			var tableData = data.data.result;
			if (tableData != null && tableData.length > 0) {
			var seriesObj = {};

			@@ -487,13 +487,16 @@


			function createKrigingGrid(dataItems,gridLevel,qindex) {
			console.log(dataItems,"dataItems")

			var t = [];
			var x = [];
			var y = [];
			for (var i = 0, len = dataItems.length; i < len; i++) {

			t.push(dataItems[i][qindex]); // 权重值
			var tmp_grid_id = dataItems[i]["grid_id"];
			console.log(tmp_grid_id,"no split")
			var lon_lat = tmp_grid_id.split("_");
			if (gridLevel == 5000) {
			x.push(Number(lon_lat[0]) + 0.025); // x
			@@ -517,6 +520,7 @@
			console.log("webworker is loaded.");

			this.onmessage = event => {
			console.log(event,"event")
			self.postMessage(createKrigingGrid(event.data.dataItems,event.data.gridLevel,event.data.qindex));
			//self.close();
			}