为采集设备模型添加下发任务功能

fuchengshen

2022-07-27 fc138d928dc7fe32b40afb1f6b0a0b10bb033409

 public/hn3d/example/00_hn_new.html

@@ -14,9 +14,10 @@
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />

  <!--第三方lib-->
  <script type="text/javascript" src="../lib/include-lib.js" libpath="../lib/"
    include="jquery,font-awesome,bootstrap,layer,haoutil,mars3d"></script>

  <!-- <script type="text/javascript" src="../lib/include-lib.js" libpath="../lib/"
    include="jquery,jquery.range,bootstrap,bootstrap-checkbox,font-awesome,web-icons,layer,haoutil,nprogress,toastr,admui,turf,echarts-liquidfill,mars3d,mars3d-widget,mars3d-esri"></script> -->
  <script type="text/javascript" src="../lib/include-lib.js?time=20210329" libpath="../lib/"
    include="jquery,jquery.range,bootstrap,bootstrap-checkbox,font-awesome,web-icons,layer,haoutil,nprogress,toastr,admui,turf,echarts-liquidfill,mars3d,mars3d-widget,mars3d-esri"></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">
@@ -59,6 +60,14 @@
    #timeline::-webkit-scrollbar {
      display: none;
    }

    #parentDiv {
      position: absolute;
      right: 10px;
      bottom: 100px;
      width: 300px;
      height: 500px;
    }
  </style>
</head>

@@ -81,6 +90,9 @@
      <input id="pengnei_btn" type="button" class="btn btn-primary" value="棚内" />
    </div>
  </div>


  <!-- <div id="parentDiv"></div> -->

  <!-- 操作按钮栏 -->
  <div class="infoview infoWindows handle">
@@ -139,7 +151,10 @@


    var map;
    var request;
    var graphicLayer
    var simu_layer
    var simu
    var heading_ = 0
    var work_ = true
    var dou_work
@@ -157,7 +172,7 @@
    // var data_url = 'http://127.0.0.1:8001/admin/business/devicegroup/getdata?bid='
    var data_url = 'http://47.92.33.19:8001/admin/business/devicegroup/getdata?bid='


    const socket_ = io("http://127.0.0.1:8001?token=123");
    var time_btn = $("#time_line button")
    var model_no = 0
    var distance_half = 111319.5;
@@ -165,8 +180,12 @@
    var time_mars = $('.mars-pannel')
    // 页面初始执行的方法
    $(document).ready(function () {
      request = haoutil.system.getRequest();
      console.log(time_btn)
      //plan 1:点击按钮式请求数据，并对模型位置进行移动




      $.ajax({
        type: 'get',
        dataType: 'json',
@@ -200,7 +219,75 @@

    })

    const socket_ = io("http://127.0.0.1:8001?token=123");
    // widget初始化
    function initWidget (map) {
      haoutil.loading.show();

      $.ajax({
        type: "get",
        dataType: "json",
        url: "config/widget.json",
        timeout: 0,
        success: function (widgetCfg) {
          haoutil.loading.hide();

          //url如果有传参时的处理
          if (haoutil.isutil.isNotNull(request.widget)) {
            if (request.onlyStart) {
              widgetCfg.openAtStart = [];
            }
            widgetCfg.openAtStart.push({
              uri: request.widget,
              name: request.name || "",
              windowOptions: {
                closeBtn: !request.onlyStart,
              },
              request: request,
            });
            map.flyHome({ duration: 0 });
          }

          //初始化widget管理器
          mars3d.widget.init(map, widgetCfg, "./"); //tip: 第3个参数支持定义widget目录的相对路径。

          if (window.lastWidgetItem) {
            activateWidget(lastWidgetItem);
            lastWidgetItem = null;
          }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
          haoutil.loading.hide();
          haoutil.alert("config/widget.json文件加载失败！");
        },
      });
      mars3d.widget.on(mars3d.widget.EventType.activated, function (event) {
        console.log("激活了widget", event);
      });
      mars3d.widget.on(mars3d.widget.EventType.disabled, function (event) {
        console.log("释放了widget", event);
      });
    }



    // 配置任务事件，激活对应的widget界面进行任务配置
    function showHistoryPathDetail (logic_id) {
      if (mars3d.widget.isActivate("widgets/rruRouterReplay/widget.js")) {
        var detailWiget = mars3d.widget.getClass("widgets/rruRouterReplay/widget.js");
        detailWiget.reloadData({
          "logic_id": logic_id
        });
      } else {
        mars3d.widget.activate({
          uri: "widgets/rruRouterReplay/widget.js",
          params: {
            "logic_id": logic_id
          }
        });
      }
    }


    socket_.on("comm", (data) => {
      console.log(data, "后端推送")
    })
@@ -213,6 +300,9 @@
    })
    socket_.on("disconnect", (data) => {
      console.log(data, "用户已断开连接")
    })
    socket_.on("test2", (data) => {
      console.log("test2", data)
    })


@@ -234,7 +324,7 @@
    })



    // 点击页面使时间轴详情页面隐藏
    $(document).on('click', function () {
      console.log("ddd")

@@ -277,7 +367,7 @@
            position: {
              lng: 121.403176,
              lat: 31.467125,
              alt: 0,
              alt: -10,
            },
            maximumScreenSpaceError: 1,
            maximumMemoryUsage: 1024,
@@ -397,14 +487,74 @@
      });




      var eventTarget = new mars3d.BaseClass()
      //创建三维地球场景
      map = new mars3d.Map("mars3dContainer", mapOptions);
      initWidget(map)
      var clockAnimate = new mars3d.control.ClockAnimate({
        format: "yyyy-MM-dd HH:mm:ss"
      })
      map.addControl(clockAnimate)

      // 添加采集设备模型
      simu_layer = new mars3d.layer.GraphicLayer({
        name: "四目设备",
        show: true
      })
      map.addLayer(simu_layer)
      //获取采集设备信息，根据信息添加模型
      $.ajax({
        type: 'get',
        dataType: 'json',
        async: false,//同步
        headers: {
          "Access-Control-Allow-Origin": "*"
          // "Accept": "application/json"
        },
        url: `${data_url}get_simu`,
        success: function (data) {
          console.log(data.data, "simu")
          simu = new mars3d.graphic.ModelEntity({

            position: [121.406729, 31.467183, 50], // 楼栋位置

            style: {
              // url: "http://112.74.77.127:9100/hn/doulunji/dabi/doulunji_dabi.gltf",
              url: "../model/simu_0322/simu_0322.gltf",
              scale: 0.005,
              color: "#ff0000",
              fill: true
            },
            // 弹出框中打开任务下发表单
            popup: "<br/><p><a href='#' onclick='javascript:showHistoryPathDetail(" + "12345" + ")' >配置任务</a></p>",
            allowDrillPick: false,
          })
          simu_layer.addGraphic(simu)
        },
        error: function (request, textStatus) {

        }
      })



      try {
        socket_.on("test_test", (data) => {
          console.log(data, "新的测试")
        })

      } catch (err) {
        console.log("没有接收到")
      }






      // Mars3D事件轴组件
      clockAnimate.on(mars3d.EventType.click, function (event) {
        if (event.targetType === "label") {
          console.log("单击了时间文本区域", event)
@@ -446,8 +596,7 @@
          // url: "https://a.amap.com/jsapi_demos/static/gltf/Duck.gltf",
          scale: 0.6
        },
        poup: '<p>我是斗轮</p>',
        tooltip: '<p>我是斗轮</p>',
        popup: "<br/><p><a href='#' onclick='javascript:showHistoryPathDetail(" + "12345" + ")' >配置任务</a></p>",
        allowDrillPick: false,
      })
      graphicLayer.addGraphic(dou2)
@@ -461,7 +610,6 @@
          scale: 0.6
        },
        poup: '<p>我是斗轮</p>',
        tooltip: '<p>我是斗轮</p>',
        allowDrillPick: false,
      })
      graphicLayer.addGraphic(dou3)