Skip to content

Question: the best way to include and manipulate external svg? #48

@somebody32

Description

@somebody32

I'm evaluating using rune.js in my project and for now it looks amazing! Thanks for creating it.

The only "blocker" I've found is trying to include and manipulate attributes of an external SVG, for example that one:

<svg xmlns="http://www.w3.org/2000/svg" width="88" height="24" viewBox="0 0 88 24"><path d="M10 0l30 15 2 1V2.18A10 10 0 0 0 41.76 0H39.7a8 8 0 0 1 .3 2.18v10.58L14.47 0H10zm31.76 24a10 10 0 0 0-5.29-6.76L4 1 2 0v13.82a10 10 0 0 0 5.53 8.94L10 24h4.47l-6.05-3.02A8 8 0 0 1 4 13.82V3.24l31.58 15.78A8 8 0 0 1 39.7 24h2.06zM78 24l2.47-1.24A10 10 0 0 0 86 13.82V0l-2 1-32.47 16.24A10 10 0 0 0 46.24 24h2.06a8 8 0 0 1 4.12-4.98L84 3.24v10.58a8 8 0 0 1-4.42 7.16L73.53 24H78zm0-24L48 15l-2 1V2.18A10 10 0 0 1 46.24 0h2.06a8 8 0 0 0-.3 2.18v10.58L73.53 0H78z"/></svg>

I've tried 2 ways:

  • using SVG plugin, but it fails to parse that SVG (I believe because of the arcs)
  • creating Rune.Node, but then I can't call fill, stroke or any other method on that node

Is there anything I'm overlooking? Thanks in advance!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions