123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722 |
- <!DOCTYPE html>
- <html class="x-admin-sm">
- <head>
- <meta charset="UTF-8">
- <meta name="renderer" content="webkit">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="viewport"
- content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
- <link rel="shortcut icon" href="https://osscold.baozhida.cn/favicon.ico">
- <link rel="bookmark" href="https://osscold.baozhida.cn/favicon.ico">
- <link rel="stylesheet" href="https://osscold.baozhida.cn/css/font.css">
- <link rel="stylesheet" href="https://osscold.baozhida.cn/css/xadmin.css">
- <script src="https://osscold.baozhida.cn/js/jquery.min.js"></script>
- <script src="https://osscold.baozhida.cn/js/jquery.cookie.min.js"></script>
- <script src="https://osscold.baozhida.cn/lib/layui/layui.js" charset="utf-8"></script>
- <script src="https://osscold.baozhida.cn/js/echarts.js" charset="utf-8"></script>
- <script type="text/javascript" src="https://osscold.baozhida.cn/js/xadmin.js"></script>
- </head>
- <body>
- <div class="x-nav">
- <span class="layui-breadcrumb">
- <a href="">首页</a>
- <a><cite>宝智达</cite></a>
- </span>
- <a class="layui-btn layui-btn-normal" style="line-height:1.6em;margin-top:3px;float:right"
- onclick="location.reload()" title="刷新">
- <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
- </a>
- </div>
- <div class="layui-fluid">
- <div class="layui-row">
- <!-- // 传感器 选择-->
- <div class="layui-col-md4">
- <div class="layui-card">
- <div class="layui-card-body ">
- <form class="layui-form layui-col-space5" οnsubmit="return false;">
- <div class="layui-input-inline layui-show-xs-block">
- <input value="" type="text" id="D_T_sn" name="D_T_sn" placeholder="请输入 SN"
- autocomplete="off"
- class="layui-input"></div>
- <div class="layui-input-inline layui-show-xs-block">
- <input value="" type="text" id="D_Name" name="D_Name" placeholder="请输入 传感器名称"
- autocomplete="off"
- class="layui-input"></div>
- <div class="layui-input-inline layui-show-xs-block">
- <select id="Class_1" name="Class_1">
- <option value=0>所有分类</option>
- {{range $index, $elem := .Class_List}}
- <option value={{$elem.Id}}>{{$elem.T_name}}
- </option>
- {{end}}
- </select>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="get_DeviceSensor_list(0)">
- <i class="layui-icon"></i></div>
- </div>
- </form>
- <hr>
- </div>
- <div class="layui-card-body " style="margin-top: -20px">
- <div id="DeviceSensor_list" style="width: 98%; overflow: hidden;">
- <div style="color: #1E9FFF;text-align: center;font-size: 15px;margin-top: 150px">加载中...</div>
- <!-- <div class="layui-col"-->
- <!-- style="height: 52px;background-color: #fafafa;border-radius:5px;padding-top: 2px;">-->
- <!-- <img style="float: left;width: 50px;margin: 0px 10px" src="https://osscold.baozhida.cn/images/温湿度传感器-1.png"-->
- <!-- height="50"-->
- <!-- width="40"/>-->
- <!-- <div style="float: left;">-->
- <!-- <div style="margin-top: 4px;font-size: 14px">士大夫撒地方递四方速递</div>-->
- <!-- <div style="margin-top: -3px;font-size: 12px">SN:KF20210510143443 [1]</div>-->
- <!-- </div>-->
- <!-- <div class="layui-card-header"-->
- <!-- style="float: right;padding-left: 0px;padding-top: 6px;color: #1E9FFF">-->
- <!-- 》-->
- <!-- </div>-->
- <!-- </div>-->
- </div>
- </div>
- <div class="layui-card-body ">
- <div style="height: 70px">
- <div class="layui-card-body ">
- <div class="page">
- <div id="DeviceSensor_list_Pages">
- <!-- <a class="prev" href=""><<</a>-->
- <!-- <a class="num" href="">1222</a>-->
- <!-- <span class="current">111</span>-->
- <!-- <a class="num" href="">444</a>-->
- <!-- <a class="next" href="">>></a>-->
- </div>
- </div>
- <div style="color: #1E9FFF;text-align: center" id="DeviceSensor_list_Pages_x"></div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <!-- // 传感器 选择-->
- <div class="layui-col-md8">
- <div class="layui-card">
- <div class="layui-card-body ">
- <form class="layui-form layui-col-space5" οnsubmit="return false;">
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="quick_1()">
- <i class="layui-icon">今天</i>
- </div>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="quick_2()">
- <i class="layui-icon">近一周</i>
- </div>
- </div>
- <div class="layui-input-inline layui-show-xs-block">
- <div class="layui-btn layui-btn-normal"
- onclick="quick_3()">
- <i class="layui-icon">近两周</i>
- </div>
- </div>
- <!-- <div class="layui-input-inline layui-show-xs-block">-->
- <!-- <div class="layui-btn layui-btn-normal"-->
- <!-- onclick="quick_4()">-->
- <!-- <i class="layui-icon">近一季度</i>-->
- <!-- </div>-->
- <!-- </div>-->
- <div class="layui-input-inline layui-show-xs-block">
- 时间:
- </div>
- <div class="layui-inline layui-show-xs-block">
- <input class="layui-input" autocomplete="off" placeholder="开始日" name="Time_start" id="Time_start" lay-key="1"></div>
- <div class="layui-inline layui-show-xs-block">
- <input class="layui-input" autocomplete="off" placeholder="截止日" name="Time_end" id="Time_end" lay-key="2"></div>
- <!-- <div class="layui-input-inline layui-show-xs-block">-->
- <!-- <div class="layui-btn layui-btn-normal"-->
- <!-- onclick="get_DeviceSensor_data(0)">-->
- <!-- <i class="layui-icon"></i>-->
- <!-- </div>-->
- <!-- </div>-->
- </form>
- <hr>
- </div>
- <div class="layui-card-body " >
- <div id="container" style="width: 100%;height:735px;"></div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </body>
- <script>
- //获取GET
- function getPar(par) {
- //获取当前URL
- var local_url = document.location.href;
- //获取要取得的get参数位置
- var get = local_url.indexOf(par + "=")
- ;
- if (get == -1) {
- return false;
- }
- //截取字符串
- //截取字符串
- var get_par = local_url.slice(par.length + get + 1);
- //判断截取后的字符串是否还有其他get参数
- var nextPar = get_par.indexOf("&")
- ;
- if (nextPar != -1) {
- get_par = get_par.slice(0, nextPar);
- }
- return get_par;
- }
- layui.use(['laydate', 'form'],
- function () {
- var laydate = layui.laydate;
- // //执行一个laydate实例
- // laydate.render({
- // elem: '#Time_start' //指定元素
- // ,type: 'datetime'
- // });
- //
- // //执行一个laydate实例
- // laydate.render({
- // elem: '#Time_end' //指定元素
- // ,type: 'datetime'
- // });
- });
- var T_name = ""
- var T_sn = ""
- var T_class_id = 0
- var T_id = 0
- var T_sn_T_id = ""
- var Time_start = ""
- var Time_end = ""
- var DeviceSensor_lite = []
- var DeviceSensor_data = []
- /// --------------- 传感器列表
- // 页面 加载完成后执行
- window.onload = function () {
- console.log("页面 加载完成后执行")
- quick_1()
- get_DeviceSensor_list(0)
- // var map = new AMap.Map('container', {
- // resizeEnable: true, //是否监控地图容器尺寸变化
- // zoom:11, //初始化地图层级
- // center: [116.397428, 39.90923] //初始化地图中心点
- // });
- }
- function ChangeDiv(e) {
- var divs = document.getElementsByClassName("ChangeDiv");
- var len = divs.length;
- for(var i=0;i<len;i++){
- divs[i].style.border = "1px solid #ffffff";
- }
- e.style.border = "1px solid #ed0000";
- }
- // 今天
- function quick_1() {
- var myDate = new Date();
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- console.log(y+"-"+m+"-"+d)
- Time_start = y+"-"+m+"-"+d + " 00:00:00"
- Time_end = y+"-"+m+"-"+d + " 23:59:59"
- $("#Time_start").val(Time_start)
- $("#Time_end").val(Time_end)
- get_DeviceSensor_data(0)
- }
- // 近一周
- function quick_2() {
- var myDate = new Date();
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- console.log(y+"-"+m+"-"+d)
- Time_end = y+"-"+m+"-"+d + " 23:59:59"
- $("#Time_end").val(Time_end)
- myDate=myDate.setDate(myDate.getDate() - 7);
- myDate=new Date(myDate);
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- Time_start = y+"-"+m+"-"+d + " 00:00:00"
- $("#Time_start").val(Time_start)
- get_DeviceSensor_data(0)
- }
- // 近一月
- function quick_3() {
- var myDate = new Date();
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- console.log(y+"-"+m+"-"+d)
- Time_end = y+"-"+m+"-"+d + " 23:59:59"
- $("#Time_end").val(Time_end)
- myDate=myDate.setDate(myDate.getDate() - 14);
- myDate=new Date(myDate);
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- Time_start = y+"-"+m+"-"+d + " 00:00:00"
- $("#Time_start").val(Time_start)
- get_DeviceSensor_data(0)
- }
- // 近一季度
- function quick_4() {
- var myDate = new Date();
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- console.log(y+"-"+m+"-"+d)
- Time_end = y+"-"+m+"-"+d + " 23:59:59"
- $("#Time_end").val(Time_end)
- myDate=myDate.setDate(myDate.getDate() - 30 * 3);
- myDate=new Date(myDate);
- y = myDate.getFullYear(); //获取当前年份(2位)
- m = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
- d = myDate.getDate(); //获取当前日(1-31)
- Time_start = y+"-"+m+"-"+d + " 00:00:00"
- $("#Time_start").val(Time_start)
- get_DeviceSensor_data(0)
- }
- function get_DeviceSensor_list(page) {
- T_sn = $("#D_T_sn").val();
- T_name = $("#D_Name").val();
- T_class_id = $("#Class_1").val();
- $.ajax({
- type: 'POST',
- url: 'Device_Sensor_List',//发送请求
- data: {
- User_tokey: $.cookie("User_tokey"),
- T_sn: T_sn,
- T_name: T_name,
- T_class_id: parseInt(T_class_id),
- page: page,
- SN_type: "YD",
- },
- success: function (result) {
- console.log(result)
- if (result.Code == 200) {
- $('#DeviceSensor_list').html("")
- $('#DeviceSensor_list_Pages').html("")
- $('#DeviceSensor_list_Pages_x').html("")
- DeviceSensor_lite = result.Data.DeviceSensor_lite
- if (DeviceSensor_lite.length == 0) {
- $('#DeviceSensor_list').html("<div style=\"color: #1E9FFF;text-align: center;font-size: 15px;margin-top: 150px\">没有设备</div>")
- return
- }
- Add_DeviceSensor_list(result.Data.DeviceSensor_lite) // 列表
- Add_DeviceSensor_list_Pages(result.Data.Pages) // 分页
- $('#DeviceSensor_list_Pages_x').append("页数:" + result.Data.Page + "/" + result.Data.Page_size + " 总数:" + result.Data.Num);
- } else {
- }
- }
- });
- return false
- }
- function Add_DeviceSensor_list(DS_lite) {
- for (let i = 0; i < DS_lite.length; i++) {
- if(T_id == 0){
- T_id = DS_lite[i].T_id;
- T_sn_T_id = DS_lite[i].T_sn;
- get_DeviceSensor_data(0)
- }
- $('#DeviceSensor_list').append("" +
- "<div class=\"layui-col ChangeDiv\" onclick=\"ChangeDiv(this); T_id = " + DS_lite[i].T_id + ";T_sn_T_id = '" + DS_lite[i].T_sn + "';get_DeviceSensor_data(0)\" \n" +
- " style=\"border: 1px solid #ffffff;height: 52px;background-color: #fafafa;border-radius:5px;padding-top: 2px;margin-top: 6px\">\n" +
- " <img style=\"float: left;width: 50px;margin: 0px 10px\" src=\"https://osscold.baozhida.cn/images/温湿度传感器-1.png\"\n" +
- " height=\"50\"\n" +
- " width=\"40\"/>\n" +
- " <div style=\"float: left;\">\n" +
- " <div style=\"margin-top: 4px;font-size: 14px;height: 24px;\">" + DS_lite[i].T_name + "</div>\n" +
- " <div style=\"margin-top: -3px;font-size: 12px\">SN:" + DS_lite[i].T_sn + " [" + DS_lite[i].T_id + "]</div>\n" +
- " </div>\n" +
- " <div class=\"layui-card-header\"\n" +
- " style=\"float: right;padding-left: 0px;padding-top: 6px;color: #1E9FFF\">\n" +
- " 》\n" +
- " </div>\n" +
- " </div>")
- }
- }
- function Add_DeviceSensor_list_Pages(Pages) {
- for (let i = 0; i < Pages.length; i++) {
- elem = Pages[i]
- switch (elem.A) {
- case 1:
- $('#DeviceSensor_list_Pages').append("<a class=\"prev\" onclick='get_DeviceSensor_list(" + elem.V + ")' ><<</a>\n");
- break;
- case 2:
- $('#DeviceSensor_list_Pages').append("<a class=\"num\" onclick='get_DeviceSensor_list(" + elem.V + ")' >" + elem.V + "</a>\n");
- break;
- case 3:
- $('#DeviceSensor_list_Pages').append("<span class=\"current\">" + elem.V + "</span>\n");
- break;
- case 4:
- $('#DeviceSensor_list_Pages').append("<a class=\"num\" onclick='get_DeviceSensor_list(" + elem.V + ")' >" + elem.V + "</a>\n");
- break;
- case 5:
- $('#DeviceSensor_list_Pages').append("<a class=\"next\" onclick='get_DeviceSensor_list(" + elem.V + ")' >>></a>\n");
- break;
- }
- }
- }
- function get_DeviceSensor_data(page) {
- if($("#Time_start").val().length > 0){
- Time_start = $("#Time_start").val();
- }else {
- Time_start = ""
- }
- if($("#Time_end").val().length > 0){
- Time_end = $("#Time_end").val();
- }else {
- Time_end = ""
- }
- $.ajax({
- type: 'POST',
- url: 'Device_Sensor_Data',//发送请求
- data: {
- User_tokey: $.cookie("User_tokey"),
- Time_start:Time_start,
- Time_end:Time_end,
- T_sn: T_sn_T_id,
- T_id: T_id,
- page: 0,
- page_z: 9000,
- },
- success: function (result) {
- console.log(result)
- if (result.Code == 200) {
- DeviceSensor_data = result.Data.DeviceSensor_data
- T_fhand(result.Data.DeviceSensor_data)
- } else {
- }
- }
- });
- return false
- }
- //// --------- 地图
- var graspRoad;
- function T_fhand(data) {
- var map = new AMap.Map('container', {
- resizeEnable: true,
- center: [104.101765,41.561402],
- zoom: 4
- });
- var lineArr = [
- // ['75.757904', '38.118117'],
- // ['117.375719', '24.598057']
- ];
- if(!data) {
- return
- }
- for (let i = 0; i < data.length; i++) {
- // 026.5610665,106.6644807
- if(data[i].T_site.length < 5){
- continue;
- }
- T_site_split = data[i].T_site.split(",")
- // 地理经纬度坐标
- var lon = parseFloat(T_site_split[1]);
- var lat = parseFloat(T_site_split[0]);
- // console.log(data,lon,lat)
- lineArr.unshift(new AMap.LngLat(lon,lat)) //unshift push
- }
- console.log("lineArr:",lineArr)
- if(!graspRoad) {
- graspRoad = new AMap.GraspRoad()
- }
- // 坐标转换
- AMap.convertFrom(lineArr, 'gps', function (status, result) {
- if (result.info === 'ok') {
- var path2 = result.locations;
- console.log("path2:",path2)
- var polyline = new AMap.Polyline({
- path: path2,
- isOutline: true,
- outlineColor: '#ffeeff',
- borderWeight: 3,
- strokeColor: "#3366FF",
- strokeOpacity: 1,
- strokeWeight: 6,
- // 折线样式还支持 'dashed'
- strokeStyle: "solid",
- // strokeStyle是dashed时有效
- strokeDasharray: [10, 5],
- lineJoin: 'round',
- lineCap: 'round',
- zIndex: 50,
- })
- // 创建一个 icon
- var endIcon = new AMap.Icon({
- size: new AMap.Size(25, 34),
- image: 'https://osscold.baozhida.cn/images/dir-marker.png',
- imageSize: new AMap.Size(135, 40),
- imageOffset: new AMap.Pixel(-95, -3)
- });
- // 将 icon 传入 marker
- var endMarker = new AMap.Marker({
- position: new AMap.LngLat(path2[path2.length-1].lng,path2[path2.length-1].lat),
- icon: endIcon,
- offset: new AMap.Pixel(-13, -30)
- });
- AMap.event.addListener(endMarker, 'click', function () {
- //创建信息窗口
- infoWindow = new AMap.InfoWindow({
- isCustom: true, //使用自定义窗体
- content: "<div style='height: 28px;background-color: "+style_s+";border: 1px solid #ccc;padding: 2px;float: contour'>" +
- "<div style='background-color: #69d1ff;position: absolute;top: -15px;left: 1px;padding: 0px 4px'>终点</div>" +
- "<span style='background-color: #FF9E9E;padding: 0px 2px;line-height'>温度:"+data[0].T_t+"</span>"+
- "<span style='background-color: #52FEEC;margin-left: 6px;padding: 0px 2px;line-height'>湿度:"+data[0].T_rh+"</span><br>"+
- "<span style='line-height'>"+data[0].T_time+"</span></div>",
- offset: new AMap.Pixel(0, -30)
- });
- //打开信息窗口
- infoWindow.open(map, [path2[path2.length-1].lng,path2[path2.length-1].lat]); //后面的参数指的是经纬度,在此显示窗口
- });
- // 创建一个 Icon
- var startIcon = new AMap.Icon({
- // 图标尺寸
- size: new AMap.Size(25, 34),
- // 图标的取图地址
- image: 'https://osscold.baozhida.cn/images/dir-marker.png',
- // 图标所用图片大小
- imageSize: new AMap.Size(135, 40),
- // 图标取图偏移量
- imageOffset: new AMap.Pixel(-9, -3)
- });
- // 创建一个 Icon
- var dianIcon = new AMap.Icon({
- // 图标的取图地址
- image: 'https://osscold.baozhida.cn/images/poi-marker-default.png',
- size: new AMap.Size(22, 28), //图标所处区域大小
- imageSize: new AMap.Size(22,28) //图标大小
- });
- // 将 icon 传入 marker
- var startMarker = new AMap.Marker({
- position: new AMap.LngLat(path2[0].lng,path2[0].lat),
- icon: startIcon,
- offset: new AMap.Pixel(-13, -30)
- });
- AMap.event.addListener(startMarker, 'click', function () {
- //创建信息窗口
- infoWindow = new AMap.InfoWindow({
- isCustom: true, //使用自定义窗体
- content: "<div style='height: 28px;background-color: "+style_s+";border: 1px solid #ccc;padding: 2px;float: contour'>" +
- "<div style='background-color: #69d1ff;position: absolute;top: -15px;left: 1px;padding: 0px 4px'>起点</div>" +
- "<span style='background-color: #FF9E9E;padding: 0px 2px;line-height'>温度:"+data[data.length - 1].T_t+"</span>"+
- "<span style='background-color: #52FEEC;margin-left: 6px;padding: 0px 2px;line-height'>湿度:"+data[data.length - 1].T_rh+"</span><br>"+
- "<span style='line-height'>"+data[data.length - 1].T_time+"</span></div>",
- offset: new AMap.Pixel(0, -30)
- });
- //打开信息窗口
- infoWindow.open(map, [path2[0].lng,path2[0].lat]); //后面的参数指的是经纬度,在此显示窗口
- });
- list_marker = []
- // 所有 标记点 信息
- for (let ix = 0; ix < path2.length; ix++) {
- if(ix == 0 || ix == path2.length - 1){
- continue
- }
- var marker = new AMap.Marker({
- position: new AMap.LngLat(path2[ix].lng,path2[ix].lat),
- icon: dianIcon,
- });
- list_marker.push(marker)
- ddid = data.length - ix - 1 // -
- style_s = "#ffffff"
- if(data[ddid].T_t < data[ddid].T_Tlower || data[ddid].T_rh < data[ddid].T_RHlower){
- style_s = "#ff7070"
- }
- if(data[ddid].T_t > data[ddid].T_Tupper || data[ddid].T_rh > data[ddid].T_RHupper){
- style_s = "#ff7070"
- }
- // label默认蓝框白底左上角显示,样式className为:amap-marker-label
- // marker.setLabel({
- // offset: new AMap.Pixel(10, 0), //设置文本标注偏移量
- // content: "<spen style='background: transparent;'>"+ddid+"</spen>", //设置文本标注内容
- // direction: 'center' //设置文本标注方位
- // });
- AMap.event.addListener(list_marker[list_marker.length - 1], 'click', function () {
- console.log("ix:",ix)
- ddid = data.length - ix - 1
- //创建信息窗口
- infoWindow = new AMap.InfoWindow({
- isCustom: true, //使用自定义窗体
- content: "<div style='height: 28px;background-color: "+style_s+";border: 1px solid #ccc;padding: 2px;float: contour'>" +
- "<div style='background-color: #69d1ff;position: absolute;top: -15px;left: 1px;padding: 0px 4px'>"+ddid+"</div>" +
- "<span style='background-color: #FF9E9E;padding: 0px 2px;line-height'>温度:"+data[ddid].T_t+"</span>"+
- "<span style='background-color: #52FEEC;margin-left: 6px;padding: 0px 2px;line-height'>湿度:"+data[ddid].T_rh+"</span><br>"+
- "<span style='line-height'>"+data[ddid].T_time+"</span></div>",
- offset: new AMap.Pixel(0, -30)
- });
- //打开信息窗口
- infoWindow.open(map, [path2[ix].lng,path2[ix].lat]); //后面的参数指的是经纬度,在此显示窗口
- });
- marker.setMap(map);
- }
- // 条纹
- var polyline1 = new AMap.Polyline({
- path:path2,
- strokeWeight:8,
- strokeOpacity:0.8,
- strokeColor:'#9991ea',
- showDir:true
- });
- polyline1.setMap(map);
- map.add([ startMarker, endMarker]);
- map.setFitView(null, false, [150, 60, 100, 60]);
- // 轨迹纠偏
- // map.getCenter();
- // if(!graspRoad) {
- // graspRoad = new AMap.GraspRoad()
- // }
- // var pathParam = []
- // for(var i=0;i<path2.length;i+=1){
- // pathParam.push({"x":path2[i].R,"y":path2[i].Q,"sp":1,"ag":1, "tm":1})
- // }
- // console.log("pathParam:",pathParam)
- // graspRoad.driving(pathParam,function(error,result) {
- // if (!error) {
- // var path3 = [];
- // var newPath = result.data.points;
- // console.log("newPath:",newPath)
- // for (var i = 0; i < newPath.length; i += 1) {
- // path3.push([newPath[i].x, newPath[i].y])
- // }
- // var newLine = new AMap.Polyline({
- // path: path3,
- // strokeWeight: 8,
- // strokeOpacity: 0.8,
- // strokeColor: '#0091ea',
- // showDir: true
- // })
- // map.add(newLine)
- // map.setFitView()
- // }else {
- // console.log(error)
- // }
- //
- // })
- //
- }
- });
- }
- </script>
- <script src="https://webapi.amap.com/maps?v=1.4.15&key=f41c8fbdd908f420f6babe5ab38bf574&callback=init&plugin=AMap.GraspRoad"></script>
- <style>
- .amap-marker-label{
- background: transparent;
- }
- .layui-card-body{
- line-height: 16px;
- }
- #container .amap-marker-label{border:0 none;white-space: nowrap; margin: 0px;padding: 0px}
- </style>
- </html>
|