# [GSoC 19] Vectorization of bitmaps #930

Merged
merged 143 commits into from Aug 31, 2019
+6,268 −27

Member

# Google Summer of Code 2019 - Report

Student: Ankit Kumar Dwivedi (@ankit-kumar-dwivedi )
Mentor: Konstantin Dmitriev (@morevnaproject ), Artem Konoplin (@ice)
Project: Vectorization of Bitmaps

Link to feature repository/branch -> https://github.com/ankit-kumar-dwivedi/synfig/tree/vectorization

## Overview

Created a Convert-to-Vector Feature that allows converting bitmap images into vector graphics. This is done by porting vectorization algorithm from OpenToonz animation package.

Now it is possible to right click on Image Layer and select "Convert to Vectors..." command.

Figure - Convert-to-vector command in menu

Clicking on it opens a vectorizer settings dialog where you can set

• Threshold - sets the value of the darkest pixels to be taken into account to detect lines to be converted to vector
• Acurracy - sets how much the vector stroke will follow the shape of the original drawing lines. High values create more precise strokes but makes them more complex.
• Despeckling - ignores during the conversion small areas generated by the image noise; the higher the value, the larger the areas ignored.
• Max thickness - sets the maximum vector stroke thickness; if this value is low very thick lines will be converted in two centerline strokes defining the line outline; if this value is high, they will be converted in a single centerline stroke.

Figure - Vectorizer settings dialog with input parameters

## Implementation details

### Algorithm Overview

Vectorization process consist of the following steps: :

1. Polygonization — Extracts a polygonal, minimal yet faithful representation of image contours.

2. Skeletonization — the process of skeletonization reduces all objects in an image to lines, without changing the essential structure of the image.

3. Convert to strokes — convert the sequence into strokes. I used Hermite curves for the stroke creation however bezier curve is most common.

### Code Overview

1. vectorizersettings - Dialog box to take input configuration for further process. All the inputs are then passed to vectorization action.
2. vectorization action - It checks if all params are correct and pass the layer along with configuration to vectorizer.
3. polygonizerclasses.h - This header contains all the common class definition that is used in subsequent steps and the prototype of all functions being used in centerlinevectorizer
4. vectorizerparameter.h - It contain the VectorizerConfiguration class and parameters definitions
5. centerlinevectorizer - This contains series of functions that are part of centerline vectorization
• centerlinepolygonizer - This used the pixel data to extracts a polygonal, minimal yet faithful representation of image contours
• centerlineskeletonizer - skeletonization reduces all objects in an image to lines, without changing the essential structure of the image. The output of this step is a list of unrelated skeletons
• organizeGraphs - The raw skeleton data obtained from Skeletonizer class need to be grouped in joints and sequences before proceeding further.
• centerlinetostrokes - Converts each forward or single Sequence of the image in its corresponding Stroke using outline layer in synfig. If the max thickness is zero then outline vectorization happen otherwise centerlines are created. centerlinetostrokes return a list of outline layers which are added to synfig as they are returned back to vectorization action.

## Demonstration

Demonstration video

Output example 1

Output example 2

## TODO

It would be nice to have a progressbar displayed while vectorization process is running. There are also some other minor issues that do not affect main functionality, you can see full list of them here - https://github.com/synfig/synfig/milestone/5.

## Blog posts

How I got selected for GSoC 2019 with Synfig

My GSoC journey with Synfig (part 1)

My GSoC journey with Synfig (part 2)

## Acknowledgement

I gratefully acknowledge the assistance of my mentors and synfig team for what they did in the project while facing a time and space difference. I have gained a lot as it is my first time working with professional developers, open-source community and an established software program. The experiences and challenges I have been given in the project are profound for my growth and future development. I will keep contributing to the synfig and the fantastic community behind this great project.

### Jose-Moreno commented Aug 21, 2019

 Congratulations! can't wait to see more of your contributions. The community surely needs more people that care about the software and for sure it is always an investment for your own growth as a developer to tackle different kinds of problems. Good luck with your studies and your own professional software development career! 😄

Member

### morevnaproject commented Aug 31, 2019

 @ankit-kumar-dwivedi Please rebase your branch on top of the latest `master` branch and I will merge your changes.
``` Add dialogs/vectorizer files ```
``` f063098 ```
``` Add "convert to vector" option ```
``` c1ad301 ```
``` Added vectorizerpopup and some fixes ```
``` e8b88d5 ```
``` Renamed filename to vectorizersettings ```
``` 1bc957f ```
``` Changed label alignment to right side ```
``` 7a08523 ```
``` Added centerlinepolygonizer.cpp and polygonizerclasses.h ```
``` 20f5381 ```
``` added vectorizerparameters.h ```
``` 179f14a ```
``` Added the method for vectorizerconfiguration ```
`centerlineconfiguration and newoutlineconfiguration added`
``` c955dd1 ```
``` made changes for configuration ```
``` eb66ec0 ```
``` changes in makefile for vectorizer classes ```
``` 908ccd3 ```
``` applied synfig template ```
``` ba802f5 ```
``` added handle to layer_bitmap(only for group layer) ```
``` a2ee615 ```
``` Added signature map ```
`Todo: Replace the pixel related functions`
``` 33d37bd ```
``` Added all functions ```
`TODO: replace pixel functions`
``` 4ea44f7 ```
``` Error ```
``` 8085c82 ```
``` Added centerlinevectorizer related files ```
``` 0944d7e ```
``` changed headers ```
``` 989a097 ```
``` fix error due to lowercase ```
``` 59194c0 ```
``` Fixed issue occuring on # include ```
```removed the cpp and include only .h files also remove not needed included to remove redeclaration error
PS: Building works now!```
``` 7c1f394 ```
``` Remove pixel RGB debug output ```
``` b9878f0 ```
``` Added pixel related functions ```
``` bc55593 ```
``` Add debug lines ```
``` 5c15fac ```
``` Init the skeletonizer ```
``` c67741b ```
``` fix wrong result and crash ```
``` c703dc0 ```
``` Fix #909 ```
``` 4114f21 ```
``` Do not modify width and check if non zero ```
``` 11c0e55 ```
``` Possible fix for ouline width and removed multiple function call and … ```
`…for loop for speed improvements`
``` 1c747f8 ```
``` fixed placement of result ```
``` 5121250 ```
``` fix #912 ```
``` d23c273 ```
``` comment fix: remove unused dead code from comment ```
``` b593111 ```
``` makefile modifications for last commit ```
``` 0bab3f2 ```
``` Fix result outside of switch(when inside layer clicked) ```
`Added bool insideswitch`
``` 95f559c ```
``` Added move_depth to move till appropriate depth ```
`fix:#912`
``` 8c166eb ```
``` miscellaneous comment and debug improvements ```
``` 03a08be ```
``` fix error related to depth ```
``` 949420f ```
``` Removed references to non-implemented features fix:#920 ```
``` fb4c7f0 ```
``` fix #920 ```
``` c69daf8 ```
``` init progress bar ```
``` f71999d ```
``` added default height of progressbar ```
``` 777dbdf ```
``` fix margin and add text ```
``` 0017a26 ```
``` added onemoment but not correctly working ```
``` ef3a584 ```
``` added set_progress() ```
``` 708a572 ```
``` fix set_progress() declaration ```
``` 2268e35 ```
``` attempt to make onemoment ```
``` b1d2223 ```
``` fix result scaling in accordance with canvas properties ```
``` ea2fa4b ```
``` fixed #925 ```
``` 6a3e323 ```
``` fix no output when max thickness is zero ```
``` ae40dba ```
``` removed global my_layer_bitmap,insideSwitch and reference_layer ```
``` 16a7cf8 ```

Member Author

### ankit-kumar-dwivedi commented Aug 31, 2019

 Done :)

### morevnaproject merged commit `04b1a8c` into synfig:master Aug 31, 2019 3 checks passed

#### 3 checks passed

Travis CI - Pull Request Build Passed
Details
continuous-integration/appveyor/pr AppVeyor build succeeded
Details
continuous-integration/travis-ci/pr The Travis CI build passed
Details
Member

### morevnaproject commented Sep 1, 2019

 @ankit-kumar-dwivedi Merged into master now. Congratulations!!! ^__^