取消移动端车模型点击弹窗

zhaoxing

2023-08-03 39856a8269d248a3ea2730ef314868ed3121c308

取消移动端车模型点击弹窗

 cars.html

@@ -49,7 +49,7 @@
    <script src="js/enc-base64-min.js"></script>    
    <script src="js/changable_params.js"></script>
    <script src="js/function_1001.js"></script>
    <script src="js/function_1004.js"></script>
    <script src="js/function_1004M.js"></script>
    <script src="js/function_wind.js"></script>
    <script src="js/function.js"></script>
    <script src="js/server.js"></script>

 js/function_1004M.js

New file
@@ -0,0 +1,307 @@
"use script"; //开发环境建议开启严格模式
//系统 功能入口

var data_list_1004;
var data_list_1004_paths = new Map();
var taxi_layer;


var polygon_Points;

  
  

function addTaxiLayer(item) {
  
  taxi_layer = new mars3d.layer.GraphicLayer({
    id: item.id,
    name: item.name,
    pid: item.pid, //图层管理 中使用，父节点id
    center: { "lat": 30.62156, "lng": 121.44918, "alt": 48716, "heading": 359, "pitch": -40 },
    noCenter: true,
    style_selected: item.style_selected,
    style_options: item.styleoptions,
    show: item.show,
    onWidget: "widgetsTS/taxi_layer_setting/widget.js",
  });
  map.addLayer(taxi_layer);

  taxi_layer.on(mars3d.EventType.click, function (event) {
    console.log("监听layer，单击了矢量对象", event);
    var item = event.graphic?.attr;
  });
  //taxi_layer.bindPopup(bindPopupFunction);

  getTaxiListFromServerByUserId(taxi_layer);
}

function getTaxiListFromServerByUserId(tmpLayer) {
  setTaxiLayerMapClock();
  $.getJSON(mars3d.global_variables.nodejs_url_predix + "dataapi/Bdata?bid=get_1004_list_by_userid&regionCode="+mars3d.global_variables.regionCode+"&userid=" + mars3d.global_variables.userid, (result) => {
    data_list_1004 = result.data.result;
    for (var i = 0, len = result.data.result.length; i < len; i++) {
      let item = result.data.result[i];
      getTaxiPathFromServerbySN(item, tmpLayer);
    }
  });

}

function setTaxiLayerMapClock() {
  
  map.clock.shouldAnimate = true;
  map.clock.startTime = Cesium.JulianDate.fromDate(new Date(mars3d.global_variables.queryDataTStartTaxi));
  map.clock.currentTime = Cesium.JulianDate.fromDate(new Date(mars3d.global_variables.queryDataTStartTaxi));
  map.clock.stopTime = Cesium.JulianDate.fromDate(new Date(mars3d.global_variables.queryDataTEnd));
  map.clock.multiplier = 2.0;
  map.clock.clockRange = Cesium.ClockRange.LOOP_STOP;
  var last_time_second = 0;


  map.on(mars3d.EventType.clockTick, function (event) {

    if (mars3d.global_variables.is_single_taxi_replaying) {
      mars3d.global_variables.singleTaxiReplayData
      var current_date = new Date(Cesium.JulianDate.toDate(event._currentTime));
      if (current_date.getSeconds() != last_time_second) {
        last_time_second = current_date.getSeconds();
        changeTaxiLayerStyleAndAttr_Single(getFormattedDateTime(current_date));
      }
    } else if (map.getLayerById(1004).options.show) {
      var current_date = new Date(Cesium.JulianDate.toDate(event._currentTime));
      if (current_date.getSeconds() != last_time_second) {
        last_time_second = current_date.getSeconds();
        changeTaxiLayerStyleAndAttr_All(getFormattedDateTime(current_date));
      }
    }
  });
}
function changeTaxiLayerStyleAndAttr_All(current_date) {
  var tmpattr;
  //current_date = "2021-07-01 00:00:32";
  taxi_layer.eachGraphic(function (item) {
    tmpattr = getTaxiAttrFromTimeListData(current_date, data_list_1004_paths.get(item.options.id));
    if (tmpattr && tmpattr != null) {
      //item.options.attr = tmpattr;
      let tmpTaxiColor = getLayerPointColorByQindexandValue(1004, item._layer.options.style_selected, tmpattr[item._layer.options.style_selected]);
      mars3d.global_variables.style_selected = item._layer.options.style_selected;
      let tmpTaxigltfurl = "gltf/" + (tmpattr["code"]).substring(0, 2) + tmpTaxiColor.substring(1) + ".gltf";
      item.setOptions({
        attr: tmpattr,
        style: {
          url: tmpTaxigltfurl,
          label: {
            color: tmpTaxiColor,
          }
        }
      })
      //item.options.style.label.color = getLayerPointColorByQindexandValue(1004, item._layer.options.style_selected, tmpattr[item._layer.options.style_selected]);
      //console.log('color has been changed.' + item.options.id);
    }

  });
}
function changeTaxiLayerStyleAndAttr_Single(current_date) {
  var tmpattr;
  var taxi_qindex = map.getLayerById(1004).options.style_selected;
  let single_taxi = taxi_layer.getGraphicById(mars3d.global_variables.singleTaxiReplayData[0]["code"]);
  if (!single_taxi) {
    console.log("进入第一个if")
    var tmpPositionProperty = new Cesium.SampledPositionProperty();
    for (var i = 0, len = mars3d.global_variables.singleTaxiReplayData.length; i < len; i++) {
      let item = mars3d.global_variables.singleTaxiReplayData[i];
      tmpPositionProperty.addSample(Cesium.JulianDate.fromDate(new Date(item["datatime"])), Cesium.Cartesian3.fromDegrees(item["lon"], item["lat"], 0.2))
      console.log(tmpPositionProperty,"汽车路线经纬度")
    }

    single_taxi = new mars3d.graphic.ModelEntity({
      id: mars3d.global_variables.singleTaxiReplayData[0].code,
      attr: mars3d.global_variables.singleTaxiReplayData[0],
      style: {
        url: "gltf/" + (mars3d.global_variables.singleTaxiReplayData[0]["code"]).substring(0, 2) + ".gltf",
        scale: 0.5,
        minimumPixelSize: 20,
        highlight: {
          type: mars3d.EventType.click,
          silhouette: false,
          silhouetteColor: "#ff0000",
          silhouetteSize: 4,
        },
        label: {
          //不需要文字时，去掉label配置即可
          text: mars3d.global_variables.singleTaxiReplayData[0]["code"],
          font_size: 16,
          // TODO need to be changed according to qindex color.
          color: "#ff00ff",
          outline: true,
          outlineColor: "#000000",
          pixelOffsetY: -20,
          distanceDisplayCondition: true,
          distanceDisplayCondition_far: 50000,
          distanceDisplayCondition_near: 100,
        },
      },
    });
    single_taxi.position = tmpPositionProperty;
    map.getLayerById(1004).addGraphic(single_taxi);

  }
  tmpattr = getTaxiAttrFromTimeListData(current_date, mars3d.global_variables.singleTaxiReplayData);
  if (tmpattr && tmpattr != null) {
    let tmpTaxiColor = getLayerPointColorByQindexandValue(1004, taxi_qindex, tmpattr[taxi_qindex]);
    let tmpTaxigltfurl = "gltf/" + (tmpattr["code"]).substring(0, 2) + tmpTaxiColor.substring(1) + ".gltf";
    single_taxi.setOptions({
      attr: tmpattr,
      style: {
        url: tmpTaxigltfurl,
        label: {
          color: tmpTaxiColor,
        }
      }
    })
    // refresh Taxi Replay Detail table:
    // assum that detailed widget is active;
    let taxiReplayWiget = mars3d.widget.getClass("widgetsTS/taxiRouteReplay/widget.js");
    let taxiReplayWiget2 = mars3d.widget.getClass("widgetsTS/taxiRouteReplay2/widget.js");
    let taxiReplayWiget_end = taxiReplayWiget2 == undefined?taxiReplayWiget:taxiReplayWiget2;
    taxiReplayWiget_end.refreshDetailTable(tmpattr);
  }



}
function getTaxiAttrFromTimeListData(datetime, datalist) {
  for (var i = 0; i < datalist.length; i++) {
    if (datalist[i]["datatime"] == datetime) {
      return datalist[i];
    }
  }
}



// 判断一个点是否在一个区域内方法
function isInPolygon(checkPoint, polygonPoints) {
  var counter = 0;
  var i;
  var xinters;
  var p1, p2;
  var pointCount = polygonPoints.length;
  p1 = polygonPoints[0];

  for (i = 1; i <= pointCount; i++) {
      p2 = polygonPoints[i % pointCount];
      if (
          checkPoint[0] > Math.min(p1[0], p2[0]) &&
          checkPoint[0] <= Math.max(p1[0], p2[0])
      ) {
          if (checkPoint[1] <= Math.max(p1[1], p2[1])) {
              if (p1[0] != p2[0]) {
                  xinters =
                      (checkPoint[0] - p1[0]) *
                          (p2[1] - p1[1]) /
                          (p2[0] - p1[0]) +
                      p1[1];
                  if (p1[1] == p2[1] || checkPoint[1] <= xinters) {
                      counter++;
                  }
              }
          }
      }
      p1 = p2;
  }
  if (counter % 2 == 0) {
      return false;
  } else {
      return true;
  }
}

function getTaxiPathFromServerbySN(taxi_mn, target_layer) {
  $.getJSON(mars3d.global_variables.nodejs_url_predix + "dataapi/Bdata?bid=get_1004_real&siteid=" + taxi_mn["code"], {
    datatime1: mars3d.global_variables.queryDataTStartTaxi,
    datatime2: mars3d.global_variables.queryDataTEnd
  }, (result) => {

    if (result.data.result.length > 0) {
      // 保存临时数据，为后续替换颜色做准备。
      data_list_1004_paths.set(result.data.result[0].code, result.data.result);
      var tmpPositionProperty = new Cesium.SampledPositionProperty();

      if(regionCode == 0){
        $.getJSON("./data/shanghai.json", (result2) => {
          polygon_Points = result2.features[0].geometry.coordinates[0][0]
          for (var i = 0, len = result.data.result.length; i < len; i++) {
            let item = result.data.result[i];
            let isIn = isInPolygon([item.lon,item.lat],polygon_Points)
            if(isIn){
                tmpPositionProperty.addSample(Cesium.JulianDate.fromDate(new Date(item["datatime"])), Cesium.Cartesian3.fromDegrees(item["lon"], item["lat"], 0.2))
              }
          }
          
        })
      }else{
        $.getJSON("./data/"+regionCode+".geojson", (result2) => {
          polygon_Points = result2.features[0].geometry.coordinates[0][0]
          for (var i = 0, len = result.data.result.length; i < len; i++) {
            let item = result.data.result[i];
            let isIn = isInPolygon([item.lon,item.lat],polygon_Points)
            if(isIn){
                tmpPositionProperty.addSample(Cesium.JulianDate.fromDate(new Date(item["datatime"])), Cesium.Cartesian3.fromDegrees(item["lon"], item["lat"], 0.2))
              }
            // mpPositionProperty.addSample(Cesium.JulianDate.fromDate(new Date(item["datatime"])), Cesium.Cartesian3.fromDegrees(item["lon"], item["lat"], 0.2))
          }
          
        })
      }

      let graphic = new mars3d.graphic.ModelEntity({
        id: result.data.result[0].code,
        attr: result.data.result[0],
        style: {
          url: "gltf/" + (result.data.result[0]["code"]).substring(0, 2) + ".gltf",
          scale: 0.5,
          minimumPixelSize: 40,
          highlight: {
            type: mars3d.EventType.click,
            silhouette: false,
            silhouetteColor: "#ff0000",
            silhouetteSize: 4,
          },
          label: {
            //不需要文字时，去掉label配置即可
            text: result.data.result[0]["code"],
            font_size: 16,
            // TODO need to be changed according to qindex color.
            color: "#ff00ff",
            outline: true,
            outlineColor: "#000000",
            pixelOffsetY: -20,
            distanceDisplayCondition: true,
            distanceDisplayCondition_far: 50000,
            distanceDisplayCondition_near: 100,
          },
        },
      });
      graphic.position = tmpPositionProperty;
      target_layer.addGraphic(graphic);
    }
  });
}

function getFormattedDateTime(date) {

  var year = date.getFullYear();//年
  var month = date.getMonth();//月
  var day = date.getDate();//日
  var hours = date.getHours();//时
  var mins = date.getMinutes();//分
  var seconds = date.getSeconds();//秒

  return date.getFullYear() + "-" +
    ((month + 1) > 9 ? (month + 1) : "0" + (month + 1)) + "-" +
    (day > 9 ? day : ("0" + day)) + " " +
    (hours > 9 ? hours : ("0" + hours)) + ":" +
    (mins > 9 ? mins : ("0" + mins)) + ":" +
    (seconds > 9 ? seconds : ("0" + seconds));
}