ExternalVendorCode/gns3-web-ui
1
0
Fork 0
mirror of https://github.com/GNS3/gns3-web-ui.git synced 2025-01-31 08:25:35 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Draw a line

Browse Source
This commit is contained in:
ziajka 2017-12-04 11:38:08 +01:00
parent 03a55d88d2
commit c0ee39428f
2 changed files with 8 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
src/app/cartography/shared/widgets/drawing-line.widget.ts
View File

@ -16,12 +16,8 @@ export class DrawingLineWidget {
this.drawingLine.end = new Point(x, y); this.drawingLine.end = new Point(x, y);
const over = function(this, d, i) { const over = function(this, d, i) {
// const e = event;
// const dom = select('g.canvas').node();
const node = self.selection.select<SVGGElement>('g.canvas').node(); const node = self.selection.select<SVGGElement>('g.canvas').node();
const coordinates = mouse(node); const coordinates = mouse(node);
// console.log(e);
console.log(d, i);
self.drawingLine.end.x = coordinates[0]; self.drawingLine.end.x = coordinates[0];
self.drawingLine.end.y = coordinates[1]; self.drawingLine.end.y = coordinates[1];
self.draw(); self.draw();
@ -31,15 +27,6 @@ export class DrawingLineWidget {
this.draw(); this.draw();
} }
// private handleMouseOver(d, i) {
// const e = event;
// console.log(e);
// console.log(d, i);
// this.drawingLine.end.x = e.clientX;
// this.drawingLine.end.y = e.clientY;
// this.draw();
// }
public update(x: number, y: number) { public update(x: number, y: number) {
this.drawingLine.end = new Point(x, y); this.drawingLine.end = new Point(x, y);
} }
@ -50,7 +37,10 @@ export class DrawingLineWidget {
public connect(selection: SVGSelection) { public connect(selection: SVGSelection) {
this.selection = selection; this.selection = selection;
// this.selection.append<SVGGElement>('g').classed("drawing-line-tool"); const canvas = this.selection.select<SVGGElement>("g.canvas");
if (!canvas.select<SVGGElement>("g.drawing-line-tool").node()) {
canvas.append<SVGGElement>('g').attr("class", "drawing-line-tool");
}
} }
public draw() { public draw() {
@ -61,27 +51,9 @@ export class DrawingLineWidget {
const value_line = line(); const value_line = line();
// const canvas = this.selection.select<SVGGElement>('g.drawing-line-tool'); const drawing_line_tool = this.selection.select<SVGGElement>('g.drawing-line-tool');
//
// const tool = canvas
// .selectAll<SVGPathElement, DrawingLine>('path')
// .data(link_data);
//
// const enter = tool
// .enter()
// // .append<SVGPathElement>('g.drawing-line')
// .append<SVGPathElement>('path')
//
// // enter.classed("drawing-line");
//
//
// tool
// .merge(enter)
// .attr('d', value_line)
// .attr('stroke', '#000')
// .attr('stroke-width', '2');
const tool = this.selection const tool = drawing_line_tool
.selectAll<SVGGElement, DrawingLine>('path') .selectAll<SVGGElement, DrawingLine>('path')
.data(link_data); .data(link_data);
@ -95,22 +67,5 @@ export class DrawingLineWidget {
.attr('stroke', '#000') .attr('stroke', '#000')
.attr('stroke-width', '2'); .attr('stroke-width', '2');
// const tool = this.selection
// .selectAll<SVGGElement, DrawingLine>('g.drawing-line')
// .data(link_data);
//
// const enter = tool
// .enter()
// .append<SVGGElement>('g.drawing-line')
// .append<SVGPathElement>('path');
//
// tool
// .merge(enter)
// .select<SVGPathElement>('path')
// .attr('d', value_line)
// .attr('stroke', '#000')
// .attr('stroke-width', '2');
} }
} }

3
src/app/project-map/project-map.component.ts
View File

@ -270,8 +270,7 @@ export class ProjectMapComponent implements OnInit {
const node: Node = event.node; const node: Node = event.node;
const port: Port = event.port; const port: Port = event.port;
console.log(node); this.mapChild.graphLayout.getDrawingLineTool().start(node.x + node.width / 2., node.y + node.height / 2.);
this.mapChild.graphLayout.getDrawingLineTool().start(node.x, node.y);
} }
} }