sgyzt-front/public/map-easy-client/titleLayer.wmts.realtime.zt.js

window.getRouteLineByUrl = function (lanlats) {
  var latlngsArr = lanlats
  var len = lanlats.length;

  var startPoint = lanlats[0];
  var origin = startPoint[1] + "," + startPoint[0]
  var endPoint = lanlats[(len - 1)];
  var destination = endPoint[1] + "," + endPoint[0]

  var waypoints = "";
  var passPoint = lanlats[1];
  //为避免途径点过多，导致get请求失败，因此默认设置最多只取300个途径点
  // let ys = Math.floor(len / 300)
  for (var i = 1; i < len - 1; i++) {
    var passPoint = lanlats[i];
    waypoints += passPoint[1] + "," + passPoint[0] + ";"
  }
  waypoints = waypoints.substring(0, waypoints.length - 1)
  var url = window.SITE_CONFIG['routeUrl'] + "?origin=" + origin + "&destination=" + destination + "&waypoints=" + waypoints + "&format=json"
  window.doXHRBySync(url, function (data) {
    if (data.status === "ok") {
      for (var i = 0; i < data.results.length; i++) {
        var steps = data.results[i].steps
        var num = 0
        latlngsArr = []
        for (var j = 0; j < steps.length; j++) {
          var polyline = steps[j].path
          var startIndex = polyline.indexOf('(') + 1
          var endIndex = polyline.indexOf(')')
          var polylineNew = polyline.substring(startIndex, endIndex)
          var polylineArr = polylineNew.split(',')
          for (var z = 0; z < polylineArr.length; z++) {
            var polylineStr = []
            var polylineArrNew = polylineArr[z].replace(/^\s+|\s+$/g, '')
            polylineStr[0] = parseFloat(polylineArrNew.split(' ')[1])
            polylineStr[1] = parseFloat(polylineArrNew.split(' ')[0])
            latlngsArr[num] = polylineStr
            num++
          }
        }
      }
    }
  });
  // console.log(latlngsArr);
  return latlngsArr;
}

window.getCarMarkerPopup = function (attr) {
  if (attr) {
    let name = attr.name ? attr.name : "-"
    let createTime = attr.attributes.createTime ? attr.attributes.createTime : "-"
    let speed = attr.attributes.speed ? attr.attributes.speed : "-"
    let head = attr.attributes.head ? attr.attributes.head : "-"
    let lon = attr.lon ? attr.lon : "-"
    let lat = attr.lat ? attr.lat : "-"
    let mileage = attr.attributes.mileage ? attr.attributes.mileage : "-"
    let height = attr.attributes.height ? attr.attributes.height : "-"

    var html = "<div class='ship-ss-pop'>"

      + "<span>车牌号：" + name + "</span></br>"
      + "<span>定位时间：" + createTime + "</span></br>"
      + "<span>车速：" + speed + "</span></br>"
      + "<span>方向：" + head + "</span></br>"
      + "<span>经度：" + lon + "</span></br>"
      + "<span>纬度：" + lat + "</span></br>"
      + "<span>里程：" + mileage + "</span></br>"
      + "<span>海拔：" + height + "</span></br>"
      + "</div>"
    return html;
  }
}

window.getLssMarkerPopup = function (attr) {
  let targetID = attr.attributes._targetID ? attr.attributes._targetID : "-"
  let name = attr.name ? attr.name : "-"
  let scanTime = attr.attributes.scanTime ? attr.attributes.scanTime : "-"
  let rate = attr.attributes.rate ? attr.attributes.rate : "-"
  let heading = attr.attributes.heading ? attr.attributes.heading : "-"
  let altitude = attr.attributes.altitude ? attr.attributes.altitude : "-"
  let lon = attr.lon ? attr.lon : "-"
  let lat = attr.lat ? attr.lat : "-"
  let dz = attr.dz ? attr.dz : "-"

  var html = "<div class='ship-ss-pop'>"
    + "<span>设备编号：" + targetID + "</span></br>"
    + "<span>设备名称：" + name + "</span></br>"
    + "<span>扫描时间：" + scanTime + "</span></br>"
    + "<span>速率：" + rate + "</span></br>"
    + "<span>航向：" + heading + "</span></br>"
    + "<span>高度：" + altitude + "</span></br>"
    + "<span>经度：" + lon + "</span></br>"
    + "<span>纬度：" + lat + "</span></br>"
    + "<span>所属市县：" + dz + "</span></br>"
    + "</div>"
  return html;
}

window.getWgyInfoById = function (id){
  var wgyInfo = {}
  var url = "http://10.110.35.55:9900/api-idaas/idaas/app/account/detail/"+id
  window.doXHRByWgySync(url,  function (data){
    if (data.code === 0) {
      wgyInfo.displayName = data.userInfo.displayName
      wgyInfo.email = data.userInfo.email
      wgyInfo.ouDirectory = data.userInfo.userOrganization[0].organizationName
      wgyInfo.ename = data.userInfo.username
      wgyInfo.phoneNumber = data.userInfo.phoneNumber
    }
  });
  return wgyInfo;
}


window.getWgyMarkerPopup = function (attr) {
  let id = attr.attributes._targetID ? attr.attributes._targetID : "-"
  let name = attr.name ? attr.name : "-"
  // let wgyInfo = window.getWgyInfoById(id)
  // let name = wgyInfo.displayName ? wgyInfo.displayName : "-"

  let time = '-'
  if( typeof attr.time === 'number' ){
      if((attr.time+"").length === 10 ){
        time = formatDate(attr.time * 1000)
      }else if((attr.time+"").length === 13){
        time = formatDate(attr.time)
      }
  }else if(typeof attr.time === 'string'){
    if(attr.time.length === 10 ){
      time = formatDate(parseInt(attr.time) * 1000)
    }else if(attr.time.length === 13){
      time = formatDate(parseInt(attr.time))
    }
  }

  var html = "<div class='ship-ss-pop'>"
    + "<span>编码：" + id + "</span></br>"
    + "<span>名称：" + name + "</span></br>"
    + "<span>经度：" + attr.lon + "</span></br>"
    + "<span>纬度：" + attr.lat + "</span></br>"
    + "<span>更新时间：" + time + "</span></br>"
    + "<span>来源：" + attr.layerCnName + "</span></br>"
    + "</div>"
  return html;
}

window.getYjMarkerPopupByCar = function (attr) {
  let title = attr.attributes.title ? attr.attributes.title : "-"
  let lon = attr.lon ? attr.lon : "-"
  let lat = attr.lat ? attr.lat : "-"
  let happenTime = attr.attributes.happenTime ? window.CstTimeToNomalTime(new Date(parseInt(attr.attributes.happenTime))) : "-"
  let happenPlace = attr.attributes.happenPlace ? attr.attributes.happenPlace : "-"
  let reliableLevelName = attr.attributes.reliableLevelName ? attr.attributes.reliableLevelName : "-"
  let sensitiveLevelName = attr.attributes.sensitiveLevelName ? attr.attributes.sensitiveLevelName : "-"
  let details = attr.attributes.details ? attr.attributes.details : "-"

  var html = "<div class='ship-ss-pop'>"
    + "<span>预警名称：" + title + "</span></br>"
    + "<span>经度：" + lon + "</span></br>"
    + "<span>纬度：" + lat + "</span></br>"
    + "<span>发生时间：" + happenTime + "</span></br>"
    + "<span>发生地点：" + happenPlace + "</span></br>"
    + "<span>可信度：" + reliableLevelName + "</span></br>"
    + "<span>关注度：" + sensitiveLevelName + "</span></br>"
    + "<span>详情：" + details + "</span></br>"
    + "</div>"
  return html;
}

L.TileLayer.WMTS.REALTIME.ZT = L.TileLayer.WMTS.REALTIME.extend({
});

L.tileLayer.wmts.realtime.zt = function (url, jsonUrl, options, markerClick) {
  return new L.TileLayer.WMTS.REALTIME.ZT(url, jsonUrl, options, markerClick);
};

L.REALTIMEGJ.ZT = L.REALTIMEGJ.extend({

  options: {
    routeLine: ''
  },
  pauseGuiji: function (targetList) {
    targetList.forEach((e) => {
      if (this.gjLayer.movingMarker[e]) {
        this.gjLayer.movingMarker[e].pause()
      }
    })
  },
  jixuHuifang: function (targetList) {
    targetList.forEach((e) => {
      if (this.gjLayer.movingMarker[e]) {
        this.gjLayer.movingMarker[e].start()
      }
    })
  },


  startPlayGJ: function (_targetID, gjData) {
    // console.log("gjData", gjData)
    this.clearGjLayerLayerGroup(_targetID);
    var lanlats = [], courses = [], speeds = [], collectimes = [], newLanLats = [], lanlatStr = [];
    if (!this.gjLayer.gjCircleMarker[_targetID]) {
      this.gjLayer.gjCircleMarker[_targetID] = [];
    }
    if (!this.gjLayer.seMarker[_targetID]) {
      this.gjLayer.seMarker[_targetID] = {};
    }
    let iconAnchor, noRealtimeGjList = {};
    this.gjLayer.gjPoyline[_targetID] = {};
    for (var i in gjData) {
      gjData[i].isTjd = "Y"
      collectimes.push(gjData[i].attributes.collecTime);
      courses.push(gjData[i].attributes.course);
      speeds.push(gjData[i].attributes.speed);
      lanlatStr.push(gjData[i].lat + "," + gjData[i].lon)
      // lanlats.push([gjData[i].lat, gjData[i].lon]);

      //处理过虚拟位置不打点
      if (gjData[i].attributes.no_realtime_gj
        && gjData[i].attributes.no_realtime_gj === 'no_realtime_gj') {
        noRealtimeGjList[i] = i;
        if (i !== 0 && !(gjData[i].lat + "_" + gjData[i].lon in (this.gjLayer.gjPoyline[_targetID]))) {
          this.gjLayer.gjPoyline[_targetID][gjData[i].lat + "_" + gjData[i].lon]
            = L.polyline([[gjData[i - 1].lat, gjData[i - 1].lon]
              , [gjData[i].lat, gjData[i].lon]], { color: 'red', dashArray: '10' }).addTo(this.gjLayer.layerGroup);
        }
        continue;
      }
      // if (i !== "0" && !(gjData[i].lat + "_" + gjData[i].lon in (this.gjLayer.gjPoyline[_targetID]))) {
      //   this.gjLayer.gjPoyline[_targetID][gjData[i].lat + "_" + gjData[i].lon]
      //     = L.polyline([[gjData[i - 1].lat, gjData[i - 1].lon]
      //       , [gjData[i].lat, gjData[i].lon]], { color: 'red' }).addTo(this.gjLayer.layerGroup);
      // }
      var title = formatDate(gjData[i].attributes.collecTime * 1000);
      let m = L.circleMarker([gjData[i].lat, gjData[i].lon], { zIndexOffset: 10, radius: 2, color: '#f00' }).addTo(this.gjLayer.layerGroup);
      var circlePoint = L.circleMarker([gjData[i].lat, gjData[i].lon], { zIndexOffset: 10, title: title, radius: 3, color: 'blue' }).addTo(this.gjLayer.layerGroup);
      this.gjLayer.gjCircleMarker[_targetID].push(m);
      this.gjLayer.gjCircleMarker[_targetID].push(circlePoint);
      m.attributes = gjData[i];
      m.bindPopup(this.options.markerPopup(m.attributes), { autoPan: false, closeButton: false, offset: L.point(130, 315) });
      circlePoint.bindPopup(this.options.markerPopup(m.attributes), { autoPan: false, closeButton: false, offset: L.point(130, 255) });
      //autoPanPaddingBottomRight ,,{autoPan:false,closeButton:false,offset:L.point(120,185)}
      // var url =  _this._jsonUrl+"?format=json&layer="+_this.options.gjLayer+"&customsQuery="+encodeURIComponent("{\"must\":[{\"term\":{\"attributes._targetID\":\""+attr.attributes._targetID+"\"}},{\"range\":{\"attributes.collectime\":{\"lte\":"+endTime+",\"gt\":"+startTime+"}}}]}")+"&sort=collectime:asc";
      let _this = this;
      m.on('mouseover', function (ev) {
        if (_this.pupopOpenHander) {
          clearTimeout(_this.pupopOpenHander);
        }
        _this.pupopOpenHander = setTimeout(function () {
          ev.target.openPopup();
        }, 500);
        if (_this.markerDrawJ) {
          _this.gjLayer.layerGroup.removeLayer(_this.markerDrawJ)
        }
        _this.markerDrawJ = L.marker(ev.target.getLatLng(), { zIndexOffset: 12, icon: new L.AngleIcon({ iconSize: new L.Point(32, 32) }) }).addTo(_this.gjLayer.layerGroup);
        _this.markerDrawJ.options.icon.drawJ();
      });
      circlePoint.on('mouseover', function (ev) {
        if (_this.pupopOpenHander) {
          clearTimeout(_this.pupopOpenHander);
        }
        _this.pupopOpenHander = setTimeout(function () {
          ev.target.openPopup();
        }, 500);
        if (_this.markerDrawJ) {
          _this.gjLayer.layerGroup.removeLayer(_this.markerDrawJ)
        }
        _this.markerDrawJ = L.marker(ev.target.getLatLng(), { icon: new L.AngleIcon({ iconSize: new L.Point(32, 32) }) }).addTo(_this.gjLayer.layerGroup);
        _this.markerDrawJ.options.icon.drawJ();
      });

      iconAnchor = [-70, 10];
      let pos = 'right';
      if (i % 2 == 0) {
        iconAnchor = [120, 10]
        pos = 'left';
      }
      // this.gjLayer.gjTimeMarker[_targetID].push(L.marker([gjData[i].lat, gjData[i].lon],{zIndexOffset:-10,icon:L.divIcon({iconSize: [120, 18] ,iconAnchor:iconAnchor,html:'<span>'+formatDate(gjData[i].attributes.collecTime*1000)+'</span>'})}).addTo(this.gjLayer.layerGroup));
      this.gjLayer.gjTimeMarker[_targetID][i] = L.marker([gjData[i].lat, gjData[i].lon], { zIndexOffset: -10, icon: L.iconWithLine({ pos: pos, iconSize: [120, 18], iconAnchor: iconAnchor, html: '<span>' + formatDate(gjData[i].time * 1000) + '</span>' }) });
      this.gjLayer.gjTimeMarker[_targetID][i].addTo(_this.gjLayer.layerGroup);
      //).addTo(this.gjLayer.layerGroup));
    }

    // console.log("guiji:", lanlatStr)
    let new_lanlats = [...new Set(lanlatStr)];
    console.log("new_lanlats", new_lanlats)
    new_lanlats.forEach((e) => {
      let splitLonlat = e.split(",");
      lanlats.push([splitLonlat[0], splitLonlat[1]]);
    })

    // console.log("lanlats:", lanlats)
    if (this.options.routeLine) {
      newLanLats = this.options.routeLine(lanlats)
    }
    for (var j in newLanLats) {
      if (j !== "0" && !(newLanLats[j][0] + "_" + newLanLats[j][1] in (this.gjLayer.gjPoyline[_targetID]))) {
        this.gjLayer.gjPoyline[_targetID][newLanLats[j][0] + "_" + newLanLats[j][1]]
          = L.polyline([[newLanLats[j - 1][0], newLanLats[j - 1][1]]
            , [newLanLats[j][0], newLanLats[j][1]]], { color: 'red' }).addTo(this.gjLayer.layerGroup);
      }
      // let m = L.circleMarker([newLanLats[j][0], newLanLats[j][1]], { zIndexOffset: 10, radius: 2, color: '#f00' }).addTo(this.gjLayer.layerGroup);
      // this.gjLayer.gjCircleMarker[_targetID].push(m);
    }
    var sicon = L.icon({ iconUrl: window.EASYMAP_CONFIG.myUrl + 'map-easy-client/track_start.png', iconSize: [25, 39], iconAnchor: [12, 39] });
    var eicon = L.icon({ iconUrl: window.EASYMAP_CONFIG.myUrl + 'map-easy-client/track_end.png', iconSize: [25, 39], iconAnchor: [12, 39] });
    var stitle = formatDate(gjData[0].time * 1000);
    this.gjLayer.seMarker[_targetID]['s'] = L.marker([gjData[0].lat, gjData[0].lon], { icon: sicon, title: stitle }).addTo(this.gjLayer.layerGroup);
    //console.log(data.resultList[data.resultList.length-1].attributes.collectime);
    var eTitle = formatDate(gjData[gjData.length - 1].time * 1000);
    this.gjLayer.seMarker[_targetID]['e'] = L.marker([gjData[gjData.length - 1].lat, gjData[gjData.length - 1].lon], { icon: eicon, title: eTitle }).addTo(this.gjLayer.layerGroup);
    var marker1 = L.Marker.movingMarker.zt(newLanLats, this.options.playSpeed, {
      autostart: true
      , course: 0
      , speed: gjData[gjData.length - 1].attributes.speed
      , courses: courses
      , speeds: speeds
      , collectimes: collectimes
      , iconUrl: gjData[0].markerPath+"?sessionToken="+window.sessionToken
      , zIndexOffset: 100
      , title: gjData[gjData.length - 1].name
      , showTitle: true
      , labelPosition: 'topleft'
      , noRealtimeGjList: noRealtimeGjList
      , gjTimeMarker: this.gjLayer.gjTimeMarker[_targetID]
      , layerGroup: this.gjLayer.layerGroup
      , markerDrawJ: this.markerDrawJ
      , gjData: gjData
      , pupopOpenHander: this.pupopOpenHander
      , markerPopup: this.options.markerPopup
    }).addTo(this.gjLayer.layerGroup);

    /* marker1.on('click', function() {
       if (marker1.isRunning()) {
         marker1.pause();
       } else if(marker1.isEnded()){
         //_this.resumeGjPlayCtx(gjData[0].attributes._targetID);
         //window.map.removeLayer(marker1);
         //marker1.off('click');
       } else{
         marker1.start();
       }
     });*/
    this.gjLayer.movingMarker[_targetID] = marker1;
    this.gjLayer.shipOne = marker1
  }
});

L.realtimeGj.zt = function (url, layername, targetList, startTime, endTime, options) {
  return new L.REALTIMEGJ.ZT(url, layername, targetList, startTime, endTime, options);
};

window.doXHRBySync = function (url, callback) {
  var httpXml = window.createXMLHttpRequest();
  httpXml.open('get', url, false);
  httpXml.send(null);
  var data = JSON.parse(httpXml.responseText);
  if (callback) {
    callback(data);
  }
}

window.doXHRByWgySync = function (url, callback) {
  var httpXml = window.createXMLHttpRequest();
  httpXml.open('get', url, false);
  httpXml.setRequestHeader("sessionToken",window.sessionToken)
  httpXml.send(null);
  var data = JSON.parse(httpXml.responseText);
  if (callback) {
    callback(data);
  }
}