Double lines when importing SVGs

“I use an online tool to convert JPEG or image files to SVG files. When I look at them on my iPhone or iPad in the file browser they have solid lines but when I add them into Joto app the solid line becomes a white space with a border round it. How do i stop this?”

Most SVGs you download will have this double line, because as you see from your example, there is a variation in stroke width and actually the lines are filled shapes, which is why you see Joto drawing the outline of these areas.

There isn’t a simple answer but you can try the following…

  1. If add the term “single line” to a google search for SVGs you’ll find files without fill areas.
  2. You can use a program such as Inkscape or Illustrator then you have the ability to either remove the double lines yourself
  3. or you can Inkscape or Illustrators image tracing features that have a stroke option rather than fill option. It will do its best to find the single stroke you’re looking for, but its actually a lot more complex than it seems.
  4. This online vectorizer has a centerline trace feature, and you can get some good results, but perhaps also a feel for how it probably won’t do what you expect… https://online.rapidresizer.com/tracer.php

It’s definitely something we’d like to offer in the app, as we are looking at a photo to sketch feature.