I am looking at a large document that has a great deal of redundant information. For example, I have hexagons that by default have not difference between one another except for position, but, I can not find a way to share all the attributes except for the transform ie
I would like to have a grid that has thousands of objects, not just hexagons, that except for one or two elements, are identical, but Inkscape wants to use full definitions, making my SVG files hit >1GB in size before I even get to the details. Is there a guide or setting to have Inkscape properly optimize things instead of repeating the same setting 100k times?
I am attempting to make as simple a series of attributes as possible, thus the question about setting up a single css or style entry and then referring to it instead of duplicating all the information over and over for each item.
I am doing this for text, paths, gradients etc.
Does anyone have a link to a document for properly using styles/css within inkscape using the current version? I have found how to's for earlier versions that no longer apply.
@inklinea Thank You so much, this is exactly what I needed to find. Now All I need is for Inkscape to support multiple processors better - large files are really a pain when only one CPU is being used.
I am looking at a large document that has a great deal of redundant information.
For example, I have hexagons that by default have not difference between one another except for position, but, I can not find a way to share all the attributes except for the transform ie
<path
id="NewEmptyHex"
sodipodi:type="star"
style="fill:none;stroke:#7b7979;stroke-width:1;stroke-opacity:1"
inkscape:flatsided="true"
sodipodi:sides="6"
sodipodi:cx="0"
sodipodi:cy="0"
sodipodi:r1="55.935318"
sodipodi:r2="48.441406"
sodipodi:arg1="0"
sodipodi:arg2="200"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 264.78793,441.09677 -27.96766,48.44141 h -55.93531 l -27.96766,-48.44141 27.96766,-48.44141 55.93531,0 z"
transform="matrix(0,0,0,0.26458333,0,0)"
inkscape:transform-center-y="-1.4703226e-06" />
vs
<path
id="NewEmptyHex-1"
transform="matrix(0,0,0,0.26458333,0,0)"
/>
I would like to have a grid that has thousands of objects, not just hexagons, that except for one or two elements, are identical, but Inkscape wants to use full definitions, making my SVG files hit >1GB in size before I even get to the details.
Is there a guide or setting to have Inkscape properly optimize things instead of repeating the same setting 100k times?
I wonder how thousands of hexagons end up to 1GB file size. Can you possibly benefit from the use of clones instead of duplicates?
1,658,880 hexagons, as a base drawing, each hexagon is but one element. There is text, different backgrounds etc.
I can write it all without using id's, sodipodi settings etc, ie raw SVG but at that point, inkscape is irrelevant.
I am trying to figure out how to use CSS and styles within the tool itself.
If you are dealing with such at large number of objects.
It is essential to make sure each object is as simple as possible.
I have attached an example of how simple a hexagon can be. ( also before you clone )
It was generated using https://inkscape.org/~inklinea/%E2%98%85polygon-side
I am attempting to make as simple a series of attributes as possible, thus the question about setting up a single css or style entry and then referring to it instead of duplicating all the information over and over for each item.
I am doing this for text, paths, gradients etc.
Does anyone have a link to a document for properly using styles/css within inkscape using the current version? I have found how to's for earlier versions that no longer apply.
Yes, it's completely possible to make reusable copies of an object and then apply css styles to each object separately.
In svg this is done with the <use> element ( these are called clones in Inkscape )
Here is a video by doctormo ( very concise 1m42s ) which shows how clones can have different styles from the original object.
https://www.youtube.com/watch?v=lfBg-3jTLwA
In the video, the inline style fill is removed from the original object, and each clone given its own fill colour.
This would also work for classes too ( I have attached a file which shows clones with class based fills )
That means that you can have clones which would be as simple as:
<use
x="0"
y="0"
xlink:href="#path830"
id="use867"
transform="translate(-1.6782025,10.878816)"
width="100%"
height="100%"
class="blue" />
And you can choose to apply an inline style, a class or multiple classes to an object.
Just be aware of https://www.w3schools.com/css/css_specificity.asp
It's possible to create some strange combinations.
I have attached a screenshot of the selectors and css panel. Object>Selectors and CSS
you could also try tu use svg optimizes
https://github.com/svg/svgo-gui
@inklinea Thank You so much, this is exactly what I needed to find.
Now All I need is for Inkscape to support multiple processors better - large files are really a pain when only one CPU is being used.