diff --git a/src/app/cartography/map/helpers/svg-to-drawing-converter.spec.ts b/src/app/cartography/map/helpers/svg-to-drawing-converter.spec.ts index ca53d8de..1e59863d 100644 --- a/src/app/cartography/map/helpers/svg-to-drawing-converter.spec.ts +++ b/src/app/cartography/map/helpers/svg-to-drawing-converter.spec.ts @@ -20,7 +20,7 @@ describe('SvgToDrawingHelper', () => { expect(() => svgToDrawingConverter.convert("")).toThrowError(Error); }); - it('should parse text drawing', () => { + it('should parse width and height if defined', () => { const svg = '' + '' + 'Line' + diff --git a/src/app/cartography/map/helpers/svg-to-drawing-converter/text-converter.spec.ts b/src/app/cartography/map/helpers/svg-to-drawing-converter/text-converter.spec.ts new file mode 100644 index 00000000..464fa7c9 --- /dev/null +++ b/src/app/cartography/map/helpers/svg-to-drawing-converter/text-converter.spec.ts @@ -0,0 +1,26 @@ +import { TextConverter } from "./text-converter"; + + +describe('SvgToDrawingHelper', () => { + let textConverter: TextConverter; + + beforeEach(() => { + textConverter = new TextConverter(); + }); + + it('should parse attributes', () => { + const node = document.createElement("text"); + node.setAttribute("fill", "#00000"); + node.setAttribute("fill-opacity", "1.0"); + node.setAttribute("font-family", "TypeWriter"); + node.setAttribute("font-size", "10.0"); + node.setAttribute("font-weight", "bold"); + + const drawing = textConverter.convert(node); + expect(drawing.fill).toEqual("#00000"); + expect(drawing.fill_opacity).toEqual(1.0); + expect(drawing.font_family).toEqual("TypeWriter"); + expect(drawing.font_size).toEqual(10.0); + expect(drawing.font_weight).toEqual("bold"); + }); +}); diff --git a/src/app/cartography/map/helpers/svg-to-drawing-converter/text-converter.ts b/src/app/cartography/map/helpers/svg-to-drawing-converter/text-converter.ts index 8c0bdc6e..e73cb3b2 100644 --- a/src/app/cartography/map/helpers/svg-to-drawing-converter/text-converter.ts +++ b/src/app/cartography/map/helpers/svg-to-drawing-converter/text-converter.ts @@ -1,15 +1,36 @@ import { SvgConverter } from "./svg-converter"; -import { DrawingElement } from "../../../shared/models/drawings/drawing-element"; import { TextElement } from "../../../shared/models/drawings/text-element"; export class TextConverter implements SvgConverter { - convert(node: Node): DrawingElement { + convert(node: Node): TextElement { const drawing = new TextElement(); + const fill = node.attributes.getNamedItem('fill'); if (fill) { drawing.fill = fill.value; } + + const fill_opacity = node.attributes.getNamedItem('fill-opacity'); + if (fill_opacity) { + drawing.fill_opacity = +fill_opacity.value; + } + + const font_family = node.attributes.getNamedItem('font-family'); + if (font_family) { + drawing.font_family = font_family.value; + } + + const font_size = node.attributes.getNamedItem('font-size'); + if (font_size) { + drawing.font_size = +font_size.value; + } + + const font_weight = node.attributes.getNamedItem('font-weight'); + if (font_weight) { + drawing.font_weight = font_weight.value; + } + return drawing; } } diff --git a/src/app/cartography/shared/models/drawings/text-element.ts b/src/app/cartography/shared/models/drawings/text-element.ts index df17e650..cbf2d7cc 100644 --- a/src/app/cartography/shared/models/drawings/text-element.ts +++ b/src/app/cartography/shared/models/drawings/text-element.ts @@ -5,8 +5,8 @@ export class TextElement implements DrawingElement { height: number; width: number; fill: string; - fill_opacity: string; + fill_opacity: number; font_family: string; - font_size: string; - font_weight: number; + font_size: number; + font_weight: string; }