mirror of
https://github.com/pandorafms/pandorafms.git
synced 2025-07-29 16:55:05 +02:00
Re rotate the title of interfaces into the arrows in some cases (it is buggy.)
This commit is contained in:
parent
ee431b369d
commit
c8a54582f8
@ -705,17 +705,22 @@ NetworkmapController.prototype.arrow_by_pieces_AMMA = function (target, arrow_da
|
|||||||
var arrow_tail_title_b = arrow_tail_title.node().getBBox();
|
var arrow_tail_title_b = arrow_tail_title.node().getBBox();
|
||||||
var arrow_tail_title_height =
|
var arrow_tail_title_height =
|
||||||
(arrow_tail_title_b['height'] + arrow_tail_title_b['y']);
|
(arrow_tail_title_b['height'] + arrow_tail_title_b['y']);
|
||||||
|
var arrow_tail_title_width =
|
||||||
|
(arrow_tail_title_b['width'] + arrow_tail_title_b['x']);
|
||||||
|
|
||||||
transform = d3.transform();
|
transform = d3.transform();
|
||||||
|
|
||||||
var x = -10 + (arrow_body_width * scale) - arrow_tail_width - radius_from;
|
var x = -10 + (arrow_body_width * scale) - arrow_tail_width - radius_from;
|
||||||
var y = 0 + (arrow_body_height / 2 - arrow_head_title_height / 2);
|
var y = 0 + (arrow_body_height / 2 - arrow_head_title_height / 2);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
transform.translate[0] = x;
|
transform.translate[0] = x;
|
||||||
transform.translate[1] = y;
|
transform.translate[1] = y;
|
||||||
|
|
||||||
arrow_tail_title.attr("transform", transform.toString());
|
arrow_tail_title.attr("transform", transform.toString());
|
||||||
|
|
||||||
|
self.re_rotate_interface_title(arrow_data);
|
||||||
|
|
||||||
/*---------------------------------------------*/
|
/*---------------------------------------------*/
|
||||||
/*------- Show the result in one time ---------*/
|
/*------- Show the result in one time ---------*/
|
||||||
/*---------------------------------------------*/
|
/*---------------------------------------------*/
|
||||||
@ -724,6 +729,76 @@ NetworkmapController.prototype.arrow_by_pieces_AMMA = function (target, arrow_da
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
NetworkmapController.prototype.re_rotate_interface_title = function(arrow_data) {
|
||||||
|
var id_node_to = "node_" + arrow_data['to']['graph_id'];
|
||||||
|
var id_node_from = "node_" + arrow_data['from']['graph_id'];
|
||||||
|
|
||||||
|
var c_elem2 = get_center_element(self._target +" #" + id_node_to);
|
||||||
|
var c_elem1 = get_center_element(self._target +" #" + id_node_from);
|
||||||
|
var angle = get_angle_of_line(c_elem1, c_elem2);
|
||||||
|
if (angle < 0) angle = 360 + angle;
|
||||||
|
|
||||||
|
// The angles in our SVG
|
||||||
|
/*
|
||||||
|
* \ 270º /
|
||||||
|
* \ | /
|
||||||
|
* \ | /
|
||||||
|
* \ | /
|
||||||
|
* \ | /
|
||||||
|
* 225º ( \|/ ) 315º
|
||||||
|
* 180º ------------+--------------- 0º
|
||||||
|
* 135º ( /|\ ) 45º
|
||||||
|
* / | \
|
||||||
|
* / | \
|
||||||
|
* / | \
|
||||||
|
* / | \
|
||||||
|
* / | \
|
||||||
|
* / | \
|
||||||
|
* 90º
|
||||||
|
*/
|
||||||
|
|
||||||
|
var rotate;
|
||||||
|
if (angle >= 0 && angle <= 90)
|
||||||
|
rotate = false;
|
||||||
|
if (angle > 90 && angle <= 180)
|
||||||
|
rotate = true;
|
||||||
|
if (angle > 180 && angle <= 270)
|
||||||
|
rotate = true;
|
||||||
|
if (angle > 270 && angle <= 360)
|
||||||
|
rotate = false;
|
||||||
|
|
||||||
|
console.log(arrow_data['graph_id'], angle, rotate);
|
||||||
|
|
||||||
|
if (rotate) {
|
||||||
|
var arrow_layout = d3.select(self._target +" #arrow_" + arrow_data['graph_id']);
|
||||||
|
var arrow_tail_title = arrow_layout.select(".tail_title");
|
||||||
|
var arrow_tail_title_text = arrow_tail_title.select("text");
|
||||||
|
var arrow_tail_title_b = arrow_tail_title.node().getBBox();
|
||||||
|
|
||||||
|
var transform = d3.transform();
|
||||||
|
|
||||||
|
var center_tail_x = arrow_tail_title_b['width'] / 2 + arrow_tail_title_b['x'];
|
||||||
|
var center_tail_y = arrow_tail_title_b['height'] / 2 + arrow_tail_title_b['y'];
|
||||||
|
|
||||||
|
transform.rotate = "180 " + center_tail_x + " " + center_tail_y;
|
||||||
|
arrow_tail_title_text.attr("transform", transform.toString());
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
var arrow_head_title = arrow_layout.select(".head_title");
|
||||||
|
var arrow_head_title_text = arrow_head_title.select("text");
|
||||||
|
var arrow_head_title_b = arrow_head_title.node().getBBox();
|
||||||
|
|
||||||
|
transform = d3.transform();
|
||||||
|
|
||||||
|
var center_head_x = arrow_head_title_b['width'] / 2 + arrow_head_title_b['x'];
|
||||||
|
var center_head_y = arrow_head_title_b['height'] / 2 + arrow_head_title_b['y'];
|
||||||
|
|
||||||
|
transform.rotate = "180 " + center_head_x + " " + center_head_y;
|
||||||
|
arrow_head_title_text.attr("transform", transform.toString());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
NetworkmapController.prototype.update_interfaces_status = function (arrow_data) {
|
NetworkmapController.prototype.update_interfaces_status = function (arrow_data) {
|
||||||
var self = this;
|
var self = this;
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user