User Tools

Site Tools


cs:svg_icons

This is an old revision of the document!


go back

What is page about

The .svg format allows to store a picture keeping its vectors information. Here we speak how to make .svg files starting from the cad program Qcad. The process is simple, but there are few subtleties one has to be aware about.

The final objective is to have a .svg file of the original Qcad drawing where each Qcad unit is a Svg pixel.

Qcad

In this page we assume your drawing uses the millimeters as unit of measure for millimeters are the unit Inkscape assumes.

Create a “drawing area” starting from the origin (coordinate 0,0) and going top right. When drawing there is the first consideration to keep track of: Inkscape will scale the drawing assuming 96 pixels for inch. This bizarre number has origin in the typography and has been decided by the World Wide Web Consortium for CSS; for us it means that line thickness must be scaled.

  25.4/96 = 0.2645833333333333

So if you want a 2-pixel thick line you have to select 0.53 (twice the previous number rounded) thickness. Apparently the .dxf format is aware of this as the usual thickness are available. Besides, Qcad allows arbitrary thicknesses for polylines if needed.

Before the next step you probably want to remove or hide the drawing area rectangle.

Inkscape

Inkscape can open .dxf formats, but it asks for the scaling factor. Use the one from the CSS of 96 pixels for inch. Immediately save your work as .svg file, otherwise you risk to save as .dxf adding unwanted effect to the Qcad file.

In Document Properties (File menu, or Shift + Ctrl + d allows to set up the correct document size. Resize page to content is a good start.

Aside to convert to .svg Inkscape is for coloring or other less technical steps.

svgcleaner

Svgcleaner is a little program to minimize you .svg file. This step is the last thing to do before using the .svg file on the web; the result file is just for display. To edit keeps the previous two. You can even manually edit the resulting file to adjust strange numbers.

cs/svg_icons.1590456072.txt.gz · Last modified: 2020/05/26 01:21 by paolo_bolzoni