New and Updated SVG Editor for Rhino - Available in Rhino 8.9

Just a quick update—looks like the SVG import function has been fixed in version 8.15! :+1:

2 Likes

Great!

1 Like

The button I play with is the original _RefitTrim.
RefitTrim

When I edit the button picture, the SVG Editor canvas shows the SVG blurred, and for me that’s confusing.

Like this:

Now I add elements, they look sharp (the 5 grey 2x2 lines):

The sharp 2x2 lines stay sharp after OK and restart Rhino.


When inspecting the original SVG, the upper left grey 2x2 shape is:

M 10.5,-31.5
V -33
h 1.488
v 1.5
z

I think h should be 1.5?

For a test, I change h to 1.5 using Inkscape and try again in Rhino SVG Editor.
But no, the blur is not due to the h value.


Last attempt:
I add a 2x2 rectangle using InkScape.
This is also blurred in Rhino SVG Editor:

1 Like

@CallumSykes ?

1 Like

Hello @Charles,

Apologies for the late reply, I got lost in conferences.

The SVG Editor currently has a few things it cannot 100% reliably deserialize (groups/defs/curves), when this happens it defaults to a background image (so it’ll look a little blurry).

I know curves are quite basic but I need to resolve how arcs render in eto first.

1 Like

I am creating a toolbar, is svg the recommended icon for Rhino8?

1 Like

Hi Jack -

Yes.
-wim

1 Like

Thanks:)

1 Like

Is it currently not possible to save svg in shading mode?

1 Like

Hi Jack -

That’s not possible, no.
-wim

1 Like

Hi Wim
I currently design in Rhino, save once as a png, then open it in svg editor and save.
Is that the only way to do it currently?

1 Like

Hi Jack -

It depends on what you put in that question.
The recommended way is to make a button in the svg editor.
-wim

1 Like

The svgeditor doesn’t allow details to be colored in…

1 Like

Hi Jack -

By default, the fill color is set to be 100% transparent. You can change that to have a fill color.

-wim

2 Likes

IMO, it is not necessary to use the button image editor. You can export vector graphics made in Rhino directly as an SVG. I would make your buttons such as you showed in your other post first with curves, then create your fills using hatches, and export the hatches as SVG.

I use a 48 x 48 template to do mine, have made dozens that way without any problem… You cannot however export a shaded view as vector graphics. However you can import a raster image file (PNG) made from a screenshot in the button image editor, it works fine here.

1 Like

I am not using curves to draw icons

I’m creating a command in RhinoCommon to draw a Diamond, executing that command, drawing the Diamond, and saving it as a png.

1 Like

Up to you how you do it, but if you want vector graphics, they have to be 2D curve-based. That is the principle.

1 Like

Hi @CallumSykes,

i’ve been creating a few svg icons recently and pasted them into the new editor successfully. Usually i do one toolbar full of icons, then assign commands and tooltip text. In the end, i save the icons and give them their respective names which i can just copy paste from the commands section of each button.

Once i finished a batch of icons, i’ve found that they do not display properly in windows explorer as icon and the preview pane stays empty. It took me a while to figure out the why.

To repeat the issue, please open this icon in the svg editor:

microsoft-excel-icon

In windows explorer it looks fine as icon and the preview pane is OK too:

If you open the file in a code editor, it has a single <svg> root node. Now choose SaveAs to save the svg file under a different name. It looks like this in explorer:

The icon is only partially shown and the preview pane stays empty. Once you open it in a code editor, there is a new nested <svg> node, below the root <svg> node.

Can this be avoided somehow so the original svg code stays untouched ? It seems that the version, viewBox and xmlns attributes are already part of the root node. So i don’t understand why it is added ?

btw. kind reminder: File > Close still does not work.

thanks,
c.

1 Like

Thanks for this nod, I got this fixed up.

The reason is to ensure it sizes correctly and also allows for adding things on top of SVGs that cannot yet be deserialized. What the SVG Editor does it perfectly valid SVG. I’m not sure why Windows has an issue with it.

If you don’t want an SVG that is changed in any way, could you use the original SVG pre-import? Or do you have SVGs you’ve modified in the SVG Editor that do not display in the Windows Preview correctly? I don’t have Windows 10, my windows 11 only has previews given by PowerToys and I get the image but wrapped in black.

Thanks @CallumSykes. I know it is valid, just trying to reduce the number of clicks and downstream steps required for my workflow. I’ve tried Powertoys too but it’s not worth the 300mb download. So i installed svg_see and cleared icon cache to to find out that practically every svg file i open or paste into the new svg editor gets an additional nested node which makes the preview go bad once saved. Maybe you should get rid of the extra node before saving if you added it ?

Yes, thats what i do. But it is less practical if you follow the workflow described in my previous post. I first create all icons, store them in toolbar buttons and then assign command names, tooltips etc. In the end i have to open the icon editor one time for every icon and then would like to export that icon with the name or command text defined in the button. I don’t name my icons when i capture them in Rhino. They are always written with the same name, the svg code is copied to the clipboard so i can just paste it into the editor. I do this around 10-20 times until i am happy with an icon.

The recent change you did to the editor to allow to paste is not optimal. I still have to first delete the content so i can paste into a fresh empty editor. If i use load instead of paste, i see that it first clears the editor and then shows the open file dialog. So once i have chosen the icon from a file, it is loaded but i have no way to compare with the previous one. It would be better if you replace the previous icon once the new icon was chosen and not when the open file dialog comes up. Then the change is visible to the user.

If you compare how things worked in Rhino 7 it is a regression. There you just hit the delete key and the content of the (image) editor was cleared. Positioning content was super easy by using the cursor keys, with automatic wrap. All this useful functionality is gone in the new svg editor in R8. Can we have this back in the new editor please ?

thanks,
c.