ExternalVendorCode/gns3-web-ui
1
0
Fork 0
mirror of https://github.com/GNS3/gns3-web-ui.git synced 2025-01-20 03:36:46 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix for node grid

Browse Source
This commit is contained in:
piotrpekala7 2020-06-17 17:17:51 +02:00
parent 2fd1bb2358
commit 1a8701d845
3 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/cartography/components/d3-map/d3-map.component.html
View File

@ -7,7 +7,7 @@
</defs>
<defs>
<pattern id="gridNode" attr.width="{{project.grid_size}}" attr.height="{{project.grid_size}}" patternUnits="userSpaceOnUse">
<pattern attr.x="{{nodeGridX}}" attr.y="{{nodeGridY}}" id="gridNode" attr.width="{{project.grid_size}}" attr.height="{{project.grid_size}}" patternUnits="userSpaceOnUse">
<path attr.d="M {{project.grid_size}} 0 L 0 0 0 {{project.grid_size}}" fill="none" stroke="DarkSlateGray" attr.stroke-width="{{gridVisibility}}"/>
</pattern>
</defs>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

10
src/app/cartography/components/d3-map/d3-map.component.ts
View File

@ -64,6 +64,9 @@ export class D3MapComponent implements OnInit, OnChanges, OnDestroy {
};
public gridVisibility: number = 0;
public nodeGridX: number = 0;
public nodeGridY: number = 0;
constructor(
private graphDataManager: GraphDataManager,
public context: Context,
@ -189,6 +192,8 @@ export class D3MapComponent implements OnInit, OnChanges, OnDestroy {
}
private redraw() {
this.updateGrid();
this.graphDataManager.setNodes(this.nodes);
this.graphDataManager.setLinks(this.links);
this.graphDataManager.setDrawings(this.drawings);
@ -198,6 +203,11 @@ export class D3MapComponent implements OnInit, OnChanges, OnDestroy {
this.mapSettingsService.mapRenderedEmitter.emit(true);
}
updateGrid() {
this.nodeGridX = (this.project.scene_width/2 - (Math.floor(this.project.scene_width/2 / this.project.grid_size) * this.project.grid_size));
this.nodeGridY = (this.project.scene_height/2 - (Math.floor(this.project.scene_height/2 / this.project.grid_size) * this.project.grid_size));
}
@HostListener('window:resize', ['$event'])
onResize(event) {
this.changeLayout();

4
src/app/services/node.service.ts
View File

@ -72,8 +72,8 @@ export class NodeService {
xPosition = Math.round((xPosition + node.width/2) / project.grid_size) * project.grid_size;
yPosition = Math.round((yPosition + node.height/2) / project.grid_size) * project.grid_size;
xPosition = Math.round(xPosition - node.width/2) - ((project.scene_width - (Math.floor(project.scene_width / project.grid_size) * project.grid_size)) / 2);
yPosition = Math.round(yPosition - node.height/2) - ((project.scene_height - (Math.floor(project.scene_height / project.grid_size) * project.grid_size)) / 2);
xPosition = Math.round(xPosition - node.width/2);
yPosition = Math.round(yPosition - node.height/2);
}
return this.httpServer.put<Node>(server, `/projects/${node.project_id}/nodes/${node.node_id}`, {