/polygonize

A fun tool to create geometric low poly art images

Primary LanguageJavaScript

polygonize

Quickstart

Install with Bower

bower install polygonize --save

Load the script files

<script type="text/javascript" src="./bower_components/delaunay-fast/delaunay.js"></script>
<script type="text/javascript" src="./bower_components/polygonize/dist/polygonize.js"></script>

API

  Polygonize({
    src: src,
    cellSize: 10,
    progress: function (progress) {
      console.log(progress + '%');
    },
    onSuccess: function(canvas) {
      const canvasContainer = document.getElementById('canvas-container')
      canvasContainer.innerHTML = '';
      canvasContainer.appendChild(canvas);
    }
  });
  • src (string): any acceptable image url or data url (must be CORS enabled)
  • cellSize (int): grid cell size in pixels
  • progress (function(int)): a callback function that will be called when image processing updates
  • onSuccess (function(canvasElem)): a callback function that will be called when processing is done successfully
  • onError (function()): a callback function that will be called when processing fails

Dependencies

Examples

Development

clone and repository and then

    npm install && bower install && npm start

Gulp server will start on port 8888

TODO

  • Intensive JavaScript computations blocks the single thread

Issues ?

If you found any issues or if you have any ideas to improve this tool please don't hesitate to create a new issue on github.