[Frontend]系統監控 平面圖放大沒有呈現icon問題解決

This commit is contained in:
dev01 2022-11-17 22:14:46 +08:00
parent 5031dc90a8
commit 7db9a07af3

View File

@ -46,7 +46,7 @@
//}); //});
//currentData = selected_floor_objs[0].device; //currentData = selected_floor_objs[0].device;
currentData = $.map(devList, function (item) { currentData = $.map(devList, function (item) {
//資料處理 //資料處理
@ -142,14 +142,14 @@
if (svg == undefined || svg == null) { if (svg == undefined || svg == null) {
return; return;
} }
echarts.registerMap('floor_svg', { svg: svg }); echarts.registerMap('floor_svg', { svg: svg });
option = { option = {
// animationDurationUpdate: 1500, // animationDurationUpdate: 1500,
tooltip: { tooltip: {
formatter: function (params) { formatter: function (params) {
console.log("23",params) console.log("23", params)
if (params.data.device_node_guid != undefined && params.data.device_node_guid != null && params.data.device_node_guid != "") { if (params.data.device_node_guid != undefined && params.data.device_node_guid != null && params.data.device_node_guid != "") {
return `名稱:${params.data.device_node_full_name}<br> return `名稱:${params.data.device_node_full_name}<br>
Guid${params.data.device_node_guid}` Guid${params.data.device_node_guid}`
@ -295,7 +295,7 @@
var dataPoint = floChart.convertFromPixel({ geoIndex: 0 }, pixelPoint); var dataPoint = floChart.convertFromPixel({ geoIndex: 0 }, pixelPoint);
console.log(dataPoint); console.log(dataPoint);
temp_device_on_floor_map = [{ temp_device_on_floor_map = [{
device_guid: selected_temp_device.device_guid, device_guid: selected_temp_device.device_guid,
@ -307,7 +307,7 @@
}]; }];
// currentData.push([dataPoint[0], dataPoint[1], 1]); // currentData.push([dataPoint[0], dataPoint[1], 1]);
@ -364,7 +364,7 @@
}); });
} }
//訂閱設備的回傳值,並塞到全域變數 //訂閱設備的回傳值,並塞到全域變數
@ -406,8 +406,8 @@
// 重設平面圖設備資料 // 重設平面圖設備資料
function resetData() { function resetData() {
const scatter_symbol_convertData = function (data) { //正常、關閉排除CCVT(圓點) const scatter_symbol_convertData = function (data,zoom) { //正常、關閉排除CCVT(圓點)
let res = [], temp = []; let res = [], temp = [];
data.forEach(function (item, index) { data.forEach(function (item, index) {
if (global_emergency_alarm_device_number != undefined if (global_emergency_alarm_device_number != undefined
@ -529,7 +529,7 @@
} }
} }
} }
item.zoom = zoom;
temp.push(item); temp.push(item);
} }
} }
@ -564,7 +564,10 @@
if (item.selected) { if (item.selected) {
obj.symbolSize = 60 obj.symbolSize = 60
} }
console.log(item.zoom)
if (item.zoom > 8) {
obj.symbolSize = 10
}
res.push(obj); res.push(obj);
}); });
@ -573,35 +576,35 @@
const scatter_icon_convertData = function (data) { //正常、關閉(icon) const scatter_icon_convertData = function (data) { //正常、關閉(icon)
let res = [], temp = []; let res = [], temp = [];
data.forEach(function (item, index) { data.forEach(function (item, index) {
if (global_emergency_alarm_device_number != undefined if (global_emergency_alarm_device_number != undefined
&& global_emergency_alarm_device_number != null) { && global_emergency_alarm_device_number != null) {
if (global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) < 0 && item.device_system_category_layer3 != "C") { if (global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) < 0 && item.device_system_category_layer3 != "C") {
//如果有子節點,則只針對子節點操作 //如果有子節點,則只針對子節點操作
//if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) { if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
// item.device_nodes.forEach(function (item_node, item_node_index) { item.device_nodes.forEach(function (item_node, item_node_index) {
let item_node = {};
//添加父節點相關資訊 //添加父節點相關資訊
item_node.device_system_category_layer3 = item.device_system_category_layer3; item_node.device_system_category_layer3 = item.device_system_category_layer3;
item_node.device_normal_color = item.device_normal_color; item_node.device_normal_color = item.device_normal_color;
item_node.device_image_url = item.device_image_url; item_node.device_image = item.device_image;
temp.push(item_node); temp.push(item_node);
// }); });
//} else { } else {
// temp.push(item) temp.push(item)
//} }
} }
} }
}); });
// let temp = data.filter(function (item, index) { temp = data.filter(function (item, index) {
// if (global_emergency_alarm_device_number != undefined && global_emergency_alarm_device_number != null) { if (global_emergency_alarm_device_number != undefined && global_emergency_alarm_device_number != null) {
// return global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) < 0 && item.device_system_category_layer3 != "C"; return global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) < 0 && item.device_system_category_layer3 != "C";
// } else { } else {
// return []; return [];
// } }
// }); });
temp.map(function (item) { temp.map(function (item) {
@ -613,7 +616,7 @@
device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null, device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null,
device_system_category_layer3: item.device_system_category_layer3 ? item.device_system_category_layer3 : null, device_system_category_layer3: item.device_system_category_layer3 ? item.device_system_category_layer3 : null,
status: item.status, status: item.status,
symbol: 'image://' + item.device_image_url, symbol: 'image://' + baseImgUrl + "/upload/device_icon/" + item.device_image,
value: item.value, value: item.value,
deviceItems: item.deviceItems, deviceItems: item.deviceItems,
deviceURL: item.deviceURL deviceURL: item.deviceURL
@ -689,30 +692,30 @@
&& global_emergency_alarm_device_number != null) { && global_emergency_alarm_device_number != null) {
if (global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) > -1 && item.device_system_category_layer3 != "C") { if (global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) > -1 && item.device_system_category_layer3 != "C") {
//如果有子節點,則只針對子節點操作 //如果有子節點,則只針對子節點操作
//if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) { if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
// item.device_nodes.forEach(function (item_node, item_node_index) { item.device_nodes.forEach(function (item_node, item_node_index) {
let item_node = {};
//添加父節點相關資訊 //添加父節點相關資訊
item_node.device_system_category_layer3 = item.device_system_category_layer3; item_node.device_system_category_layer3 = item.device_system_category_layer3;
item_node.device_error_color = item.device_error_color; item_node.device_error_color = item.device_error_color;
item_node.device_image_url = item.device_image_url; item_node.device_image = item.device_image;
temp.push(item_node); temp.push(item_node);
// }); });
//} else { } else {
// temp.push(item) temp.push(item)
//} }
} }
} }
}); });
// if (global_emergency_alarm_device_number != undefined && global_emergency_alarm_device_number != null) { if (global_emergency_alarm_device_number != undefined && global_emergency_alarm_device_number != null) {
// temp = data.filter(function (item, index) { temp = data.filter(function (item, index) {
// return global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) > -1 && item.device_system_category_layer3 != "C"; return global_emergency_alarm_device_number.findIndex(x => x.device_number == item.device_number) > -1 && item.device_system_category_layer3 != "C";
// }); });
// } }
temp.map(function (item) { temp.map(function (item) {
var obj = { var obj = {
device_guid: item.device_guid, device_guid: item.device_guid,
device_number: item.device_number, device_number: item.device_number,
@ -721,7 +724,7 @@
device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null, device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null,
device_system_category_layer3: item.device_system_category_layer3 ? item.device_system_category_layer3 : null, device_system_category_layer3: item.device_system_category_layer3 ? item.device_system_category_layer3 : null,
status: item.status, status: item.status,
symbol: 'image://' + item.device_image_url, symbol: 'image://' + baseImgUrl + "/upload/device_icon/" + item.device_image,
value: item.value, value: item.value,
deviceItems: item.deviceItems, deviceItems: item.deviceItems,
deviceURL: item.deviceURL deviceURL: item.deviceURL
@ -785,11 +788,13 @@
}] }]
}); });
} else { } else {
floChart.setOption({ floChart.setOption({
series: [{ series: [{
symbolOffset: [10, 10], symbolOffset: [10, 10],
data: scatter_symbol_convertData(currentData) //正常、關閉(圓點)
data: scatter_symbol_convertData(currentData, zoom), //正常、關閉(圓點)
}, { }, {
data: scatter_icon_convertData(currentData) //正常、關閉(icon) data: scatter_icon_convertData(currentData) //正常、關閉(icon)
}, { }, {