Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on Mar 9, 2021. It is now read-only.
This repository was archived by the owner on Mar 9, 2021. It is now read-only.

Unable to create SVG elements (Element vs SVGElement) #17

@sdarnell

Description

@sdarnell

I'm trying to create SVG elements and I'm struggling to figure out how it is meant to work.
There are three main problems.

Firstly Document.CreateElementNS("http://www.w3.org/2000/svg", "svg") works, but returns an Element, which I can't easily convert to an SVGSVGElement (which extends SVGGraphicsElement, SVGElement, and XmlElement). The Element.As<T>() method has a type constraint of Element.
Similarly, some of the other methods such as GetElementById() mean that even if the SVG element exists, you can't get it back as the right type.

I have a hack for this first issue, which essentially does what the As() does.

The second issue is a follow on of the above. How do I create sub nodes of the SVG? In JS you would just use document.createElementNS() again. The reason I mention it separately, is that in JS some SVG related objects have createXXX() methods on the SVGSVGElement.

The third aspect is that even when you have created, say, an SVGRectElement, the properties are read only, so you can't set the width/height,x,y,rx,ry. Limiting the usefulness of these classes.
The DOM interface : https://developer.mozilla.org/en-US/docs/Web/API/SVGRectElement also says the properties are readonly.
So how am I meant to set attributes of the SVGElement?

Ultimately, I guess that I'm just misunderstanding how to drive the interface.
So if there any examples of creating an element and some simple shapes inside that you could point me at, that would be a great help.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions