1

I'm following this guide on editing imported svg's in draw.io but with no luck. I am not getting the style options after inserting the editableCssRules=.*; code on the svg itself.

Has anyone else experienced this? I have the latest version installed and have restarted my machine.

I'm expecting to see additional Fill options as the guide suggests.

enter image description here

Dannyboy
  • 197
  • 3
  • 12

3 Answers3

2

The option editableCssRules just does what it says: it makes the specified CSS classes editables; in your case by using editableCssRules=.*; you are using a Regex expression to make all CSS classes in the SVG editable.

You are not seeing any options appear after modifying the style because with all probability the SVG you are using does not contain any CSS classes.

You will need to edit your SVG file and add the CSS classes that you need and refer to them in the paths, like so:

 <style type="text/css">
    .st0{fill:#000000;} 
 </style> 
 <path class="st0" d="YOUR_PATH_HERE"/>

Now, in draw.io import the SVG again and after adding the editableCssRules=.*; option to the style you should be able to edit its color, like so:

EditableSVGColor

Nicola36631
  • 44
  • 7
0

If possible, please attach SVG image and add the whole SVG code (Ctrl+e) with inserted editableCssRules=.*; so I can see all the details.

Thanks,

Marija
  • 354
  • 1
  • 1
0

Same problem here.

Here is the whole SVG code as requested :

editableCssRules=.*;aspect=fixed;html=1;points=[];align=center;image;fontSize=12;image=img/lib/azure2/general/File.svg;imageBackground=default;sketch=0;

enter image description here

FLS
  • 1
  • 1