ExternalVendorCode/gns3-web-ui
1
0
Fork 0
mirror of https://github.com/GNS3/gns3-web-ui.git synced 2024-12-30 01:38:50 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Resolve no border style issue

Browse Source
This commit is contained in:
Rajnikant Lodhi 2022-08-27 00:30:34 +05:30
parent 02bd105b86
commit 3fa923a9d1
2 changed files with 16 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/app/cartography/converters/map/map-drawing-to-svg-converter.ts
View File

@ -14,25 +14,11 @@ export class MapDrawingToSvgConverter implements Converter<MapDrawing, string> {
let elem = ``;
if (mapDrawing.element instanceof RectElement) {
elem = `<rect fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" height=\"${
mapDrawing.element.height
}\" width=\"${mapDrawing.element.width}\" stroke=\"${mapDrawing.element.stroke}\" stroke-width=\"${
mapDrawing.element.stroke_width
}\" stroke-dasharray=\"${mapDrawing.element.stroke_dasharray ?? 'none'}\" />`;
elem = `${mapDrawing.element.stroke_dasharray == '' ? `<rect fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" height=\"${mapDrawing.element.height}\" width=\"${mapDrawing.element.width}\"/>` :`<rect fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" height=\"${mapDrawing.element.height}\" width=\"${mapDrawing.element.width}\" stroke=\"${mapDrawing.element.stroke}\" stroke-width=\"${mapDrawing.element.stroke_width}\" stroke-dasharray=\"${mapDrawing.element.stroke_dasharray}\" />`}`;
} else if (mapDrawing.element instanceof EllipseElement) {
elem = `<ellipse fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" cx=\"${
mapDrawing.element.cx
}\" cy=\"${mapDrawing.element.cy}\" rx=\"${mapDrawing.element.rx}\" ry=\"${mapDrawing.element.ry}\" stroke=\"${
mapDrawing.element.stroke
}\" stroke-width=\"${mapDrawing.element.stroke_width}\" stroke-dasharray=\"${
mapDrawing.element.stroke_dasharray ?? 'none'
}\" />`;
elem = `${mapDrawing.element.stroke_dasharray == '' ? `<ellipse fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" cx=\"${mapDrawing.element.cx}\" cy=\"${mapDrawing.element.cy}\" rx=\"${mapDrawing.element.rx}\" ry=\"${mapDrawing.element.ry}\"/>` :`<ellipse fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" cx=\"${mapDrawing.element.cx}\" cy=\"${mapDrawing.element.cy}\" rx=\"${mapDrawing.element.rx}\" ry=\"${mapDrawing.element.ry}\" stroke=\"${mapDrawing.element.stroke}\" stroke-width=\"${mapDrawing.element.stroke_width}\" stroke-dasharray=\"${mapDrawing.element.stroke_dasharray}\" />`}`;
} else if (mapDrawing.element instanceof LineElement) {
elem = `<line stroke=\"${mapDrawing.element.stroke}\" stroke-width=\"${mapDrawing.element.stroke_width}\" x1=\"${
mapDrawing.element.x1
}\" x2=\"${mapDrawing.element.x2}\" y1=\"${mapDrawing.element.y1}\" y2=\"${
mapDrawing.element.y2
}\" stroke-dasharray=\"${mapDrawing.element.stroke_dasharray ?? 'none'}\" />`;
elem = `<line stroke=\"${mapDrawing.element.stroke}\" stroke-width=\"${mapDrawing.element.stroke_width}\" x1=\"${mapDrawing.element.x1}\" x2=\"${mapDrawing.element.x2}\" y1=\"${mapDrawing.element.y1}\" y2=\"${mapDrawing.element.y2}\" stroke-dasharray=\"${mapDrawing.element.stroke_dasharray ?? 'none'}\" />`;
} else if (mapDrawing.element instanceof TextElement) {
elem = `<text fill=\"${mapDrawing.element.fill}\" fill-opacity=\"1.0\" font-family=\"${mapDrawing.element.font_family}\" font-size=\"${mapDrawing.element.font_size}\" font-weight=\"${mapDrawing.element.font_weight}\">${mapDrawing.element.text}</text>`;
} else return '';

34
src/app/components/project-map/drawings-editors/style-editor/style-editor.component.ts
View File

@ -59,27 +59,13 @@ export class StyleEditorDialogComponent implements OnInit {
this.element = new ElementData();
if (this.drawing.element instanceof RectElement || this.drawing.element instanceof EllipseElement) {
this.element.fill = this.drawing.element.fill;
this.element.stroke = this.drawing.element.stroke;
let dasharray_value =
this.drawing.element.stroke_dasharray ??
this.drawing.element.stroke_width ??
(this.drawing.element.stroke_width == undefined || this.drawing.element.stroke_width == 0 ? '' : 'none');
this.borderTypes.map((_) => {
if (_.qt == dasharray_value || _.value == dasharray_value) {
dasharray_find_value = _.value;
}
});
this.element.stroke_dasharray = dasharray_find_value;
this.element.stroke = this.drawing.element.stroke;
console.log(this.drawing.element.stroke_dasharray, this.drawing.element.stroke_width)
this.element.stroke_dasharray = (this.drawing.element.stroke_dasharray == undefined && this.drawing.element.stroke_width == undefined ) ? '': this.drawing.element.stroke_dasharray ?? 'none' ;
this.element.stroke_width = this.drawing.element.stroke_width;
} else if (this.drawing.element instanceof LineElement) {
this.element.stroke = this.drawing.element.stroke;
let dasharray_value = this.drawing.element.stroke_dasharray;
this.borderTypes.map((_) => {
if (_.qt == dasharray_value || _.value == dasharray_value) {
dasharray_find_value = _.value;
}
});
this.element.stroke_dasharray = dasharray_find_value ?? 'none';
this.element.stroke_dasharray = (this.drawing.element.stroke_dasharray == undefined && this.drawing.element.stroke_width == undefined ) ? '': this.drawing.element.stroke_dasharray ?? 'none' ;
this.element.stroke_width = this.drawing.element.stroke_width;
}
@ -104,13 +90,19 @@ export class StyleEditorDialogComponent implements OnInit {
if (this.drawing.element instanceof RectElement || this.drawing.element instanceof EllipseElement) {
this.drawing.element.fill = this.element.fill;
this.drawing.element.stroke = this.element.stroke;
this.drawing.element.stroke = this.element.stroke ?? "#000000";
this.drawing.element.stroke_dasharray = this.element.stroke_dasharray;
this.drawing.element.stroke_width = this.element.stroke_width;
} else if (this.drawing.element instanceof LineElement) {
if (this.element.stroke_dasharray != '') {
this.drawing.element.stroke = this.element.stroke ?? "#000000";
this.drawing.element.stroke_dasharray = this.element.stroke_dasharray === '' ? 'none' : this.element.stroke_dasharray;
this.drawing.element.stroke_width = this.element.stroke_width === 0 ? 2 : this.element.stroke_width;
} else {
this.toasterService.warning(`No border style line element not supported`);
}
this.drawing.element.stroke = this.element.stroke;
this.drawing.element.stroke_dasharray =
this.element.stroke_dasharray === '' ? 'none' : this.element.stroke_dasharray;
this.drawing.element.stroke_dasharray = this.element.stroke_dasharray;
this.drawing.element.stroke_width = this.element.stroke_width === 0 ? 2 : this.element.stroke_width;
}
let mapDrawing = this.drawingToMapDrawingConverter.convert(this.drawing);