https://github.com/und3f/vectorize-pixelart

Convert raster pixel art graphics to vector
https://github.com/und3f/vectorize-pixelart

pixel-art typesscript vectorization

Last synced: 14 days ago
JSON representation

Convert raster pixel art graphics to vector

• Host: GitHub
• URL: https://github.com/und3f/vectorize-pixelart
• Owner: und3f
• License: gpl-3.0
• Created: 2019-08-13T10:39:56.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-07-19T04:23:36.000Z (over 1 year ago)
• Last Synced: 2024-09-28T17:07:47.805Z (about 2 months ago)
• Topics: pixel-art, typesscript, vectorization
• Language: TypeScript
• Homepage: http://zasenko.name/vectorize-pixelart.html
• Size: 405 KB
• Stars: 37
• Watchers: 3
• Forks: 2
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
[![build-test](https://github.com/und3f/vectorize-pixelart/actions/workflows/main.yml/badge.svg)](https://github.com/und3f/vectorize-pixelart/actions/workflows/main.yml)

vectorize-pixelart

==================

Convert raster pixel art graphics to vector.

# Installation

    $ npm install vectorize-pixelart

# CLI usage

You may vectorize PNG image to SVG using next command:

    $ vectorize-pixelart input.png output.svg

Also EPS output is supported:

    $ vectorize-pixelart input.png output.eps

# Online web usage

The package has been build with a [Browserify](browserify.org) version and

available online:

http://zasenko.name/vectorize-pixelart.html

Main limitation of the web version is that browser has issues when processing

large SVG files. As there are no control over image displaying some resulting

SVG might cause browser hang.

# API

Please check [vectorize-pixelart.js](src/vectorize-pixelart.ts) code.

So, basic usage is next:

1. Read raster image.

2. Trace image

```js

var fs  = require('fs'),

    PNG = require('pngjs').PNG,

    ContourTracing = require('vectorize-pixelart/contour-tracing'),

    paUtils = require('vectorize-pixelart/utils');

// PNGImageData provides transparent pixel retrieving/comparasion interface

let image = new paUtils.PNGImageData(PNG.sync.read(fs.readFileSync('in.png')));

// Vector composer

let composer = new paUtils.SVG(image.height, image.width);

process.stdout.write(composer.header());

let tracer = new ContourTracing(image);

tracer.traceContours((contour, pixel) => {

    // Output next traced contour

    process.stdout.write(composer.path(contour, pixel));

})

process.stdout.write(composer.footer());

```

## Class: ContourTracing

Trace contours of a given `image`.

### new ContourTracing(image)

Object image should contain `height` and `width` information. Also it should

provide `function comparePixels(y1, x1, y2, x2) { }` and `function getPixel(y1,

x1)`. See `PNGImageData`.

### ContourTracing.traceContours(callback)

Traces contours of a given image and return next contour to callback. The

callback gets one argument `(contour)` that contains array of contour points 

`[y, x]`.

# Copyright

Copyright (C) 2019-2022 Sergii Zasenko

This program is free software: you can redistribute it and/or modify

it under the terms of the GNU General Public License as published by

the Free Software Foundation, either version 3 of the License, or

(at your option) any later version.

This program is distributed in the hope that it will be useful,

but WITHOUT ANY WARRANTY; without even the implied warranty of

MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the

GNU General Public License for more details.

You should have received a copy of the GNU General Public License

along with this program.  If not, see .