Using SVG in palette

GoJS
1

  1. Is it possible to use SVG files as my image for the items in the palette/diagram?

  2. If I have an SVG file with the following multiple paths, how do I set this geometry string as my geo property?

    <path d="M39.462,33h-3.379c0.07,0.269,0.141,1.119,0.151,1.178c0.286,1.635-0.734,2.468-1.797,2.822c-4.004,1.335-5.208-4-5.208-4
        H28v1v7h7v2h18h1v-2h6h1V22H47.581L39.462,33z M56,33h-9.386l4.1-6H56V33z"/>
    <path d="M57.5,45h-27c-2.209,0-4.5,1.291-4.5,3.5v4c0,2.209,2.291,4.5,4.5,4.5h27c2.209,0,3.5-2.291,3.5-4.5v-4
        C61,46.291,59.709,45,57.5,45z M57,53H30v-4h27V53z"/>
    <path d="M12.754,33.64c-0.118,0.284-0.275,0.545-0.48,0.764c-0.462,0.491-1.114,0.794-1.82,0.794c-0.228,0-0.455-0.032-0.676-0.094
        c-0.644-0.181-1.178-0.601-1.504-1.184c-0.276-0.491-0.365-1.047-0.281-1.595c0.016-0.102,0.026-0.205,0.055-0.306l0.145-0.381
        l-0.446,0.252c-1.637,0.925-3.586,2.953-3.58,7.365c0.009,7.208,6.752,8.369,6.82,8.381l0.359,0.057l1.691-3.327L12.754,33.64z"/>
    <polygon points="11.991,48.985 14.629,50.413 15.581,48.654 14.371,44.587     "/>
    <path d="M31.951,34.952c0.186,0.312,0.799,1.124,2.033,0.492c0.594-0.304,0.594-0.921,0.594-1.259C34.578,33.195,28,13.75,28,13.75
        l-4.345,4.663L31.951,34.952z"/>
    <path d="M26.41,5.028l0.002-0.358l-2.079-1.178l-0.412,0.233l-0.827,0.469l-0.75,0.425l-0.544,0.308l-3.533,2.001L9.192,30.822
        l-0.195,0.512c-0.095,0.344-0.047,0.748,0.149,1.098s0.517,0.602,0.902,0.71c0.784,0.221,1.634-0.264,1.85-1.037l0.031-0.065
        l0.042-0.089l10.53-14.885l0.331-0.468l0.331-0.468l3.212-4.54L26.41,5.028z M22.625,10.241c-0.823,0-1.491-0.667-1.491-1.491
        c0-0.823,0.667-1.491,1.491-1.491s1.491,0.667,1.491,1.491C24.116,9.573,23.448,10.241,22.625,10.241z"/>
2

I’ve sent you mail about this.

3

I would also like to know how to handle compound svg paths. Can you please share the details?

4

I suggest showing the SVG in a Picture. You’ll need to make sure that the SVG has a defined width and height, and you’ll need to make sure that the Picture has the same width and height, if you want it to show properly in all browsers. Of course you can scale the Picture if you want it to be bigger or smaller, including using a “Viewbox” Panel to do the scaling automatically.

Read more at GoJS Pictures -- Northwoods Software.

5

A post was split to a new topic: How to show SVG in items in Palette