Added a new system to draw lines in visual console when element have an image

This commit is contained in:
Arturo Gonzalez 2017-05-09 17:29:17 +02:00
parent eb1dafe807
commit 6f40069aa9
3 changed files with 26 additions and 8 deletions

View File

@ -1497,13 +1497,11 @@ function set_static_graph_status(idElement, image, status) {
set_static_graph_status(idElement, image, data); set_static_graph_status(idElement, image, data);
if($('#'+idElement+' table').css('float') == 'right' || $('#'+idElement+ ' table').css('float') == 'left'){ if($('#'+idElement+' table').css('float') == 'right' || $('#'+idElement+ ' table').css('float') == 'left'){
$('#'+idElement+ ' img').css('margin-top', parseInt($('#'+idElement).css('height'))/2 - parseInt($('#'+idElement+ ' img').css('height'))/2); $('#'+idElement+ ' img').css('margin-top', parseInt($('#'+idElement).css('height'))/2 - parseInt($('#'+idElement+ ' img').css('height'))/2);
} }
else{ else{
$('#'+idElement+ ' img').css('margin-left',parseInt($('#'+idElement).css('width'))/2 - parseInt($('#'+idElement+ ' img').css('width'))/2); $('#'+idElement+ ' img').css('margin-left', parseInt($('#'+idElement).css('width'))/2 - parseInt($('#'+idElement+ ' img').css('width'))/2);
} }
} }
}); });

View File

@ -1182,7 +1182,9 @@ function visual_map_print_item($mode = "read", $layoutData,
else if($layoutData['label_position']=='right'){ else if($layoutData['label_position']=='right'){
$imgpos = 'float:left'; $imgpos = 'float:left';
} }
$varsize = getimagesize($img); $varsize = getimagesize($img);
if ($width == 0 || $height == 0) { if ($width == 0 || $height == 0) {
if($varsize[0] > 150 || $varsize[1] > 150){ if($varsize[0] > 150 || $varsize[1] > 150){
echo html_print_image($img, true, echo html_print_image($img, true,

View File

@ -37,17 +37,32 @@ function draw_line (line, id_div) {
have_node_begin_img = $('#' + line['node_begin'] + " img").length; have_node_begin_img = $('#' + line['node_begin'] + " img").length;
have_node_end_img = $('#' + line['node_end'] + " img").length; have_node_end_img = $('#' + line['node_end'] + " img").length;
if (have_node_begin_img) {
var img_pos_begin = $('#' + line['node_begin'] + " img").position();
var img_margin_left_begin = $('#' + line['node_begin'] + " img").css("margin-left");
var img_margin_left_begin_aux = img_margin_left_begin.split("px");
img_margin_left_begin = parseFloat(img_margin_left_begin_aux[0]);
}
if (have_node_end_img) {
var img_pos_end = $('#' + line['node_end'] + " img").position();
var img_margin_left_end = $('#' + line['node_end'] + " img").css("margin-left");
var img_margin_left_end_aux = img_margin_left_end.split("px");
img_margin_left_end = parseFloat(img_margin_left_end_aux[0]);
}
if (line['x1']) { if (line['x1']) {
x1 = line['x']; x1 = line['x'];
} }
else { else {
if (have_node_begin_img) { if (have_node_begin_img) {
width = $('#' + line['node_begin'] + " img").width(); width = $('#' + line['node_begin'] + " img").width();
x1 = parseInt($('#' + line['node_begin']).css (selector + 'left')) + (width / 2) + img_pos_begin.left + img_margin_left_begin;
} }
else { else {
width = $('#' + line['node_begin']).width(); width = $('#' + line['node_begin']).width();
x1 = parseInt($('#' + line['node_begin']).css (selector + 'left')) + (width / 2);
} }
x1 = parseInt($('#' + line['node_begin']).css (selector + 'left')) + (width / 2);
} }
if (line['y1']) { if (line['y1']) {
@ -56,11 +71,12 @@ function draw_line (line, id_div) {
else { else {
if (have_node_begin_img) { if (have_node_begin_img) {
height = parseInt($('#' + line['node_begin'] + " img").css('height')); height = parseInt($('#' + line['node_begin'] + " img").css('height'));
y1 = parseInt($('#' + line['node_begin']).css (selector + 'top')) + (height / 2) + img_pos_begin.top;
} }
else { else {
height = $('#' + line['node_begin']).height(); height = $('#' + line['node_begin']).height();
y1 = parseInt($('#' + line['node_begin']).css (selector + 'top')) + (height / 2);
} }
y1 = parseInt($('#' + line['node_begin']).css (selector + 'top')) + (height / 2);
} }
if (line['x2']) { if (line['x2']) {
@ -69,11 +85,12 @@ function draw_line (line, id_div) {
else { else {
if (have_node_end_img) { if (have_node_end_img) {
width = $('#' + line['node_end'] + " img").width(); width = $('#' + line['node_end'] + " img").width();
x2 = parseInt($('#' + line['node_end']).css (selector + 'left')) + (width / 2) + img_pos_end.left + img_margin_left_end;
} }
else { else {
width = $('#' + line['node_end']).width(); width = $('#' + line['node_end']).width();
x2 = parseInt($('#' + line['node_end']).css (selector + 'left')) + (width / 2);
} }
x2 = parseInt($('#' + line['node_end']).css (selector + 'left')) + (width / 2);
} }
if (line['y2']) { if (line['y2']) {
@ -82,11 +99,12 @@ function draw_line (line, id_div) {
else { else {
if (have_node_end_img) { if (have_node_end_img) {
height = parseInt($('#' + line['node_end'] + " img").css('height')); height = parseInt($('#' + line['node_end'] + " img").css('height'));
y2 = parseInt($('#' + line['node_end']).css (selector + 'top')) + (height / 2) + img_pos_end.top;
} }
else { else {
height = $('#' + line['node_end']).height(); height = $('#' + line['node_end']).height();
y2 = parseInt($('#' + line['node_end']).css (selector + 'top')) + (height / 2);
} }
y2 = parseInt($('#' + line['node_end']).css (selector + 'top')) + (height / 2);
} }