KanjiVG SVG files to PNG?

[Toshiro Mifune]

Hi,

I used Perceptual Image Diff (http://pdiff.sourceforge.net/) to compare my kanji stroke order image set to those generated straight from Tim Eyre's KSO font (http://www.nihilist.org.uk/) to fish out all the remaining corrections I made, but due to my lack of documenting the changes over the years, I didn't (nor couldn't) forward them to Tim or KanjiVG yet. I found some that I'll open an issue for on GitHub later, but was thinking it might be a good idea to compare Tim's KSO font straight with KanjiVG, as this might result in other differences.

The thing is, I don't know how to convert KanjiVG's SVG files into pngs to exactly match the font. For example, https://github.com/KanjiVG/kanjivg/blob/2011d07290e5b4c258a724a91d3d8f93b25c83af/kanji/04fb5.svg should look exactly like https://raw.githubusercontent.com/mifunetoshiro/kanjium/master/images/kso_images/20405.png to not get any false positives from perceptualdiff. The font of Tim's KSO font stroke numbers seems to be Arial size 12 or 13 at an image resolution of 180x230, so this is what I'd like to output the SVGs as: 180x230 pngs with Arial 12 (or 13) stroke numbers.

So, how exactly do I do that? Thanks.

[Toshiro Mifune]

Well I got some progress, but I'm stuck and don't know how to continue. I found out it's really easy to convert svgs into pngs with SVG Rasterizer from the Batik library (https://xmlgraphics.apache.org/batik/tools/rasterizer.html). Before I did that, I had to use Find and Replace on Windows (https://findandreplace.codeplex.com/) to replace in all *.svg files:

width="109" height="109" viewBox="0 0 109 109">
to
width="180" height="230" viewBox="0 0 104 104">

and:
style="font-size:8;fill:#808080">
to
style="font-family:Arial;font-size:8px;fill:#000000">
(speaking of, shouldn't there be a "px" suffix there by default in the svg files?)

After inspecting a few generated pngs, I realized I would have to move them 4 pixels down to match to the images generated from the font exactly (which is easy with ImageMagick: mogrify *.png -page +0+4 -background none -flatten *.png), but after inspecting more of them, I realized their placement is random and I would have to move all kanji to a different x/y position, so I can't continue.

The problem seems to be the viewBox coordinates, which I don't know what to change them to to make the svgs match the generated images from the font. 104 104 seems to make the size match exactly, but some are moved more to the left, some more to the right, some up... Basically none match with their positioning to the font generated images, but their size is ok...

[Toshiro Mifune]

Ok, I decided to go ahead and check the images despite them not matching exactly. This resulted in too many false positives, so I was forced to limit the differences to a certain threshold (perceptualdiff pic1_a.png pic1_b.png -luminance 10 -threshold 4000), which resulted in 1,814 images that I had to check manually. It's possible some differences escaped due to this limit, but it can't be helped - I'm not going to manually compare 6,000+ images.

Anyway, I found 5 more mistakes in KanjiVG:
簫 number 16 should be above stroke 16, not below, same with 17
繩 swap 11 & 12
龝 swap 12 & 13
離 should be 19 strokes
黐 should be 23 strokes

I'll open an issue on GitHub tomorrow.

[ospalh]

Am Dienstag, 23. Dezember 2014 19:14:39 UTC+1 schrieb Toshiro Mifune:

The problem seems to be the viewBox coordinates, which I don't know what to change them to to make the svgs match the generated images from the font. 104 104 seems to make the size match exactly, but some are moved more to the left, some more to the right, some up... Basically none match with their positioning to the font generated images, but their size is ok...

Maybe do it by brute force: move all SVGs (where you haven’t found a very good match already) around to each offset position a few pixel away and pick the best match.
 

[Toshiro Mifune]

I believe that would have been too time consuming, waiting for the scripts to stop processing, compare to find best match, repeat... So I ended up manually comparing the rest of the images, which took me about 3 hours, and found 8 more mistakes in KanjiVG (and 17 in the KSO font which I'll mail to Tim now).

I'll post these on GitHub in the discussion I already opened before: https://github.com/KanjiVG/kanjivg/issues/99