"use script"; //开发环境建议开启严格模式
|
|
//对应widget.js中MyWidget实例化后的对象
|
var thisWidget;
|
|
function initWidgetView(_thisWidget) {
|
thisWidget = _thisWidget;
|
|
DatePicker("#appDateHourStart", '#appDateHourEnd');
|
$("#appDateHourStart").datetimepicker("setDate", new Date(thisWidget.appDateHourStart));
|
$('#appDateHourEnd').datetimepicker('setDate', new Date(thisWidget.appDateHourEnd));
|
|
|
$("#btnStartDH")
|
.off("click")
|
.on("click", function () {
|
if ($("#btnStartDHText").text() == "开始回放") {
|
thisWidget.startDH();
|
$("#btnStartDHText").text("停止回放");
|
$("#checkbox_sjgs").show();
|
} else {
|
$("#btnStartDHText").text("开始回放");
|
thisWidget.pauseReplay();
|
}
|
});
|
|
$("#btnSuspendDH")
|
.off("click")
|
.on("click", function () {
|
if ($("#btnSuspendDHText").text() == "暂停回放") {
|
thisWidget.pauseReplay();
|
$("#btnSuspendDHText").text("继续回放");
|
$("#checkbox_sjgs").show();
|
} else {
|
$("#btnSuspendDHText").text("暂停回放");
|
thisWidget.ContinueReplay();
|
}
|
});
|
|
$("#checkbox_sjgs")
|
.off("click")
|
.on("click", function () {
|
var checked = $(this).prop("checked");
|
if (checked) {
|
thisWidget.startGS();
|
} else {
|
thisWidget.removeTrack();
|
}
|
});
|
|
|
//开始查询轨迹
|
$("#startQueryTaxiData").click(function () {
|
haoutil.loading.show();
|
$.getJSON(thisWidget.nodejs_url_predix + "dataapi/Bdata?bid=get_1004_single_path&siteid=" + thisWidget.taxi_sn, {
|
datatime1: thisWidget.appDateHourStart,
|
datatime2: thisWidget.appDateHourEnd
|
}, (result) => {
|
haoutil.loading.hide();
|
thisWidget.clearReplayLayers();
|
if (result.data.result.length > 0) {
|
thisWidget.setSingleTaxiReplayData(result.data.result);
|
var points = [];
|
for (var i = 0, len = result.data.result.length; i < len; i++) {
|
let item = result.data.result[i];
|
points[points.length] = [item["lon"], item["lat"]];
|
}
|
thisWidget.addTaxiReplayGraphic(points);
|
$("#route_box").show();
|
} else {
|
haoutil.msg("无查询记录，请更换查询条件！");
|
}
|
});
|
});
|
}
|
|
|
function refreshDetailTable(tmpattr) {
|
|
$("#indexTaxiContent").empty();
|
var _tr = "<tr><td>1</td><td>code</td><td>" + tmpattr.code + "</td><td>/</td></tr>"
|
$("#indexTaxiContent").append(_tr);
|
_tr = "<tr><td>3</td><td>datatime</td><td>" + tmpattr.datatime + "</td><td>/</td></tr>"
|
$("#indexTaxiContent").append(_tr);
|
var tmp_index = 3;
|
for (var p in tmpattr) {//遍历json对象的每个key/value对,p为key
|
if (p !== 'code' && p !== 'datatime') {
|
_tr = "<tr><td>" + tmp_index + "</td><td>" + p + "</td><td>" + tmpattr[p] + "</td><td>" + getUnitByqindex(p) + "</td></tr>"
|
$("#indexTaxiContent").append(_tr);
|
tmp_index++;
|
}
|
}
|
}
|
|
function getUnitByqindex(qindex) {
|
qindex = qindex.toUpperCase();
|
if (qindex == 'PM25' || qindex == 'PM10' || qindex == 'NO' || qindex == 'NO2' || qindex == 'NOX' || qindex == 'SO2') {
|
return 'μg/m³';
|
} else if (qindex == 'CO') {
|
return 'mg/m³';
|
} else if (qindex == 'SPEED') {
|
return 'km/h';
|
} else {
|
return '/';
|
}
|
}
|
|
function resetStartQueryTaxiDataText(taxi) {
|
$("#startQueryTaxiDataText").text("查询(" + taxi + ")");
|
$("#route_box").hide();
|
}
|
|
function DatePicker(beginSelector, endSelector) {
|
$(beginSelector).datetimepicker(
|
{
|
bootcssVer: 3, //bootstrap-datetimepicker＋bootstrap v3，但这个插件使用的时候，并没有和V3相匹配，仍然调用的是bootstrap V2的图标 把bootcssVer的值直接设为3，否则datetimepicker不会显示出上、下个月的箭头
|
format: 'yyyy-mm-dd hh:ii:00',
|
minView: 'day',//设置时间选择为年月日 去掉时分秒选择
|
todayBtn: true, //如果此值为true 或 "linked"，则在日期时间选择器组件的底部显示一个 "Today" 按钮用以选择当前日期。如果是true的话，"Today" 按钮仅仅将视图转到当天的日期，如果是"linked"，当天日期将会被选中。
|
clearBtn: true,
|
language: 'zh-CN',
|
autoclose: true, //当选择一个日期之后是否立即关闭此日期时间选择器。
|
keyboardNavigation: true, //是否允许通过方向键改变日期。
|
forceParse: true, //当选择器关闭的时候，是否强制解析输入框中的值。
|
initialDate: new Date(),
|
todayHighlight: 1, //如果为true, 高亮当前日期
|
endDate: new Date()
|
}).on('changeDate', function (ev) {
|
if (ev.date) {
|
$(endSelector).datetimepicker('setStartDate', new Date(ev.date.valueOf()))
|
} else {
|
$(endSelector).datetimepicker('setStartDate', null);
|
}
|
thisWidget.appDateHourStart = $(beginSelector).val();
|
})
|
$(endSelector).datetimepicker(
|
{
|
bootcssVer: 3, //bootstrap-datetimepicker＋bootstrap v3，但这个插件使用的时候，并没有和V3相匹配，仍然调用的是bootstrap V2的图标 把bootcssVer的值直接设为3，否则datetimepicker不会显示出上、下个月的箭头
|
format: 'yyyy-mm-dd hh:ii:00',
|
todayBtn: true, //如果此值为true 或 "linked"，则在日期时间选择器组件的底部显示一个 "Today" 按钮用以选择当前日期。如果是true的话，"Today" 按钮仅仅将视图转到当天的日期，如果是"linked"，当天日期将会被选中。
|
clearBtn: true,
|
language: 'zh-CN',
|
autoclose: true, //当选择一个日期之后是否立即关闭此日期时间选择器。
|
keyboardNavigation: true, //是否允许通过方向键改变日期。
|
forceParse: true, //当选择器关闭的时候，是否强制解析输入框中的值。
|
initialDate: new Date(),
|
todayHighlight: 1, //如果为true, 高亮当前日期
|
endDate: new Date()
|
}).on('changeDate', function (ev) {
|
thisWidget.appDateHourEnd = $(endSelector).val();
|
})
|
}
|
