There is a set (group) of svg icons, some of which are in the form of - stroke (line thickness) of the object. And some are already in the correct form - vector outline. The visual difference between the forms is presented in the attached image. For example, the corresponding operation in Adobe Illustrator for svg elements is performed using the menu item Object – Path - Outline Stroke.
In the archive, a set of svg icons is presented as an example, which need to be brought to the correct form.
Script functionality:
The functionality of the script is to comprehensively analyze all svg icons in a specific directory (folder), identify those that are in the form of - stroke (line thickness) and bring them to the correct form - vector outline. This form is necessary for the further creation of an icon font. If this approach is labor-intensive, meaning identifying only those icons that need to be processed, then the script should process all icons. However, the optimal option would be to identify only those that need to be processed.
Requirements for the script:
- The script must bring svg icons to the correct form – vector outline.
- The script must not deform the elements of the svg icon and the svg icon as a whole after processing. That is, it must retain its original shape after processing. Note: the svg icon may consist of several elements, and all these elements are grouped.
- After processing, the svg icon must open in graphic and online editors and can be edited and modified. That is, the svg must not be presented as a corrupted file after the script processing.
Implementation methods:
Method #1 (Implementation using Python):
Method #1 - Implement the corresponding script using Python. The script can be presented as a file script.py and work directly from the folder with input data (svg icons). The script can be executed using VsCode by entering the command through the built-in terminal – python script.py.
Method #2 - I also consider the option of implementing the script using Python with a user interface. In this case, the script can work from any directory after installation. The interface will provide functionality for: a line to open a browse window and subsequently select a specific path to the folder with svg icons; a button to start the script and perform its actions.
For both proposed methods, after processing the svg elements, if these methods imply that the script will analyze all svg files and identify only those files that need to be processed and accordingly will be processed, then upon completion of the processing operation, a log file should be generated in the *.txt file with a list of svg icons that were directly processed.
Method #2 (Implementation using JavaScript) THE MOST OPTIMAL OPTION:
This option is considered the most optimal because there is an existing template engine for VsCode, which is developed based on the Vite system. This template engine already has functionality for creating icon fonts provided that the svg icons are presented in the correct form. This functionality is implemented using the solution https://github.com/nfroidure/svgicons2svgfont
On Git, there are several solutions that allow bringing svg icons to the correct form https://github.com/search?q=outline%20stroke%20svg&type=repositories ATTENTION: some of these solutions are presented as examples and are not intended and not considered as mandatory methods for implementation, if these solutions do not work stably or do not perform their functions correctly.
The goal of Method #2 is to implement the functionality described in the terms of reference and to integrate it into the existing functionality of the template engine, which will allow the team to comprehensively analyze, process svg icons, and create an icon font based on them.
Please respond for discussion from specialists who have thoroughly familiarized themselves with the terms of reference and are confident in implementation with proposed reasonable prices.
If necessary, I will answer additional questions.
