Veqtor is an SVG parser/renderer that uses qnanopainter as a render backend to allow for simple access and manipulation of SVG elements at runtime.

The lack of painting components in the QML language led me to create an SVG renderer component with complete access to its elements.

If you liked, please consider giving a star 🌟.

Full documentation can be found in the docs directory.

Simple use is as follows: set the src attribute to an SVG string or a file address, and you're done.

Veqtor { src: '<svg><path d="m10,10l30,30,l20,20z"/></svg>'; }

It is also possible to initialize SVG elements based on their id.
For example, if you have elmId as the path's element id, you can access that element using the elmId property; updating elmId properties will also change the path element's attributes.

Veqtor {
    property var elmId: { "d": "m 20 0l.5-10" }
    src: '<svg><path id="elmId" d="m10,10l30,30,l20,20z"/></svg>';
}

Path may also be accessed using the veqtor's document property.
Which means that if I call the foo function in the code below, it will modify the path fill property.

Veqtor {
    id: veq
    src: '<svg><path id="elmId" d="m10,10l30,30,l20,20z"/></svg>';
}

function foo() {
    veq.document.pathId.fill = 'red';
}

• Clone the repository.

  git clone "https://github.com/SMR76/veqtor.git"

• Include Veqtor.pri file. _{see example-1}
  

  include("path/to/Veqtor.pri")

• Import the Veqtor module. _{see example-1}
  

  import Veqtor 0.1

Setting external CSS and implementing all elements are future plans.

Please file an issue on issues page if you have any problems.