# geometrizejs

> Geometrize JavaScript API. Generated from geometrize-haxe library directly. Zero dependencies. No implementation, just typings. For node.js and browsers.

Latest version **0.0.19** (published 2021-04-02) · MIT license · 0 weekly downloads

## Install

```sh
npm install geometrizejs
pnpm add geometrizejs
yarn add geometrizejs
bun add geometrizejs
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.19 |
| Published | 2021-04-02 |
| First published | 2019-06-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 140.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 20 |
| Author | Sebastian Gurin |
| Maintainers | cancerberosgx |
| Keywords | geometrize, JavaScript, browser, Node.js, API, image, TypeScript |

## Links

- npm: https://www.npmjs.com/package/geometrizejs
- Repository: https://github.com/cancerberoSgx/geometrizejs
- Homepage: https://www.npmjs.com/package/geometrizejs
- Issues: https://github.com/cancerberoSgx/geometrizejs
- npm.io page: https://npm.io/package/geometrizejs

## Alternatives

- [@opentelemetry/exporter-zipkin](https://npm.io/package/@opentelemetry/exporter-zipkin.md) — 14.8M weekly downloads
- [pusher-js](https://npm.io/package/pusher-js.md) — 2.0M weekly downloads
- [browserify](https://npm.io/package/browserify.md) — 1.7M weekly downloads
- [sqs-consumer](https://npm.io/package/sqs-consumer.md) — 1.7M weekly downloads
- [@sanity/eventsource](https://npm.io/package/@sanity/eventsource.md) — 930.8K weekly downloads

## Recent versions

- 0.0.19 (latest) — 2021-04-02
- 0.0.18 — 2019-10-22
- 0.0.17 — 2019-07-12
- 0.0.16 — 2019-07-11
- 0.0.15 — 2019-07-10
- 0.0.14 — 2019-07-10
- 0.0.13 — 2019-07-10
- 0.0.12 — 2019-06-30
- 0.0.11 — 2019-06-26
- 0.0.10 — 2019-06-24
- 0.0.9 — 2019-06-24
- 0.0.8 — 2019-06-21
- 0.0.7 — 2019-06-21
- 0.0.6 — 2019-06-21
- 0.0.5 — 2019-06-21
- … 1 more at https://npm.io/package/geometrizejs/versions

## README

# geometrizejs

See the [playground](https://cancerberosgx.github.io/demos/geometrizejs-playground/) to understand what's this is all about.

## Contents

<!-- toc -->

- [Summary](#summary)
- [Usage](#usage)
  * [Render SVG](#render-svg)
  * [Render bitmap](#render-bitmap)
- [Render JSON](#render-json)
- [API docs](#api-docs)
- [Build geometrize.js](#build-geometrizejs)
- [TODO / Roadmap](#todo--roadmap)
- [Extras / ideas](#extras--ideas)
- [Complex / not important:](#complex--not-important)

<!-- tocstop -->

## Summary

 * [geometrize](https://www.geometrize.co.uk/) JavaScript API. Original idea is from [primitive](https://github.com/fogleman/primitive).
 * Generated directly from [official geometrize-haxe](https://github.com/Tw1ddle/geometrize-haxe) code.
 * For node.js and browsers.
 * TypeScript typings.
 * Zero dependencies.
 * No implementation, just typings for generated JavaScript library.
 * [Repository](https://github.com/cancerberoSgx/geometrizejs).
 * [playground](https://cancerberosgx.github.io/demos/geometrizejs-playground/).
 
## Usage

Note that this library is just types for [official geometrize-haxe](https://github.com/Tw1ddle/geometrize-haxe) so it doesn't support any image read/write and the API could seems low level. 

Checkout **[geometrizejs-extra](https://github.com/cancerberoSgx/geometrizejs/tree/master/geometrizejs-extra)** which provides an **easy to use** API and supports several image formats both in node and browser. 

```sh
npm install --save geometrizejs
```

This example uses [jimp](TODO) to load images which supports formats both in node.js and browsers. Nevertheless any library can be used, such as [pngjs](TODO).

## Examples

### Render SVG

```js
import Jimp from 'jimp'
import { Bitmap, ImageRunner, ShapeTypes, SvgExporter } from 'geometrizejs'

(async () => {
  // load png/jpeg/gif,bmp/tiff image from url, file path or Buffer using jimp:
  const image = await Jimp.read('test/assets/logo.png')
  const bitmap = Bitmap.createFromByteArray(image.bitmap.width, 
    image.bitmap.height, image.bitmap.data)
  const runner = new ImageRunner(bitmap)
  const options = {
    shapeTypes: [ShapeTypes.CIRCLE, ShapeTypes.TRIANGLE],
    candidateShapesPerStep: 50,
    shapeMutationsPerStep: 100,
    alpha: 128
  }
  const iterations = 500
  const svgData = []
  for (let i = 0; i < iterations; i++) {
    svgData.push(SvgExporter.exportShapes(runner.step(options)))
  }
  const svg = SvgExporter.getSvgPrelude() + 
    SvgExporter.getSvgNodeOpen(bitmap.width, bitmap.height) + 
    svgData.join('\n') + 
    SvgExporter.getSvgNodeClose()

  // in node.js:
  writeFileSync('output.svg', svg)

  // in the browser:
  document.getElementById('svg-container').innerHTML = svg
})()
```

### Render bitmap

```js
import Jimp from 'jimp'
import { Bitmap, ImageRunner, ShapeTypes } from 'geometrizejs'

(async () => {
  // load png/jpeg/gif,bmp/tiff image from url, file path or Buffer using jimp:
   const image = await Jimp.read('test/assets/logo.png')
  const bitmap = Bitmap.createFromByteArray(image.bitmap.width, 
    image.bitmap.height, image.bitmap.data)
  const runner = new ImageRunner(bitmap)
  const options = {
    shapeTypes: [ShapeTypes.TRIANGLE],
    candidateShapesPerStep: 50,
    shapeMutationsPerStep: 100,
    alpha: 128
  }
  const iterations = 2000
  for (let i = 0; i < iterations; i++) {
    const r = runner.step(options)
  }
  const bytes = runner.getImageData().getBytes().b
  const out = new Jimp({ 
    width: image.bitmap.width, 
    height: image.bitmap.height,
    data: bytes
  })
  // in node.js we could write it to file
  await out.writeAync('tmp/bitmap/logo.png')

  // in the browser we could write it to a <img> element as data url
  document.getElementById('target-image').src = await out.getBase64Async()
})()
```

## Render JSON

Getting the shapes as JSON can be used to render them using other technology or processing / analyse them:

```js
import Jimp from 'jimp'
import { Bitmap, ImageRunner, ShapeTypes } from 'geometrizejs'

(async () => {
  const image = await Jimp.read('test/assets/logo.png')
  const bitmap = Bitmap.createFromByteArray(image.bitmap.width, 
    image.bitmap.height, image.bitmap.data)
  const runner = new ImageRunner(bitmap)
  const options = {
    shapeTypes: [ShapeTypes.CIRCLE],
    candidateShapesPerStep: 50,
    shapeMutationsPerStep: 100,
    alpha: 128
  }
  const iterations = 200
  const shapes = []
  for (let i = 0;i < iterations;i++) {
    shapes.push(...JSON.parse(ShapeJsonExporter.exportShapes(runner.step(options))))
  }
  // shapes is an array of objects serializable with JSON.stringify() 
})()
```

## API docs

TODO

## Build geometrize.js

```sh
git clone --recurse-submodules https://github.com/cancerberoSgx/geometrizejs.git
cd geometrizejs
sh generate-geometrize-js.sh
```

That should re-generate `geometrizejs/src/geometrize.js`.


## ImageRunnerOptions

 * `shapeTypes: Array<ShapeTypes>`: The types of shapes to use when generating the image.
 * `alpha: number`: The opacity of the shapes (0-255).
 * `candidateShapesPerStep: number`: The number of candidate shapes to try per model step.
 * `shapeMutationsPerStep: number`: The number of times to mutate each candidate shape.

## TODO / Roadmap
- [ ] research wasm build using haxe
- [ ] browser tests
- [x] support bitmap-regions branch
- [x] sourcemaps https://haxe.org/manual/debugging-source-map.html
- [x] bitmap output tests
- [x] JSON output tests
 
### Extras / ideas 

The following are features not supported by haxe implementation. If implemented it will be in a separate project so this project keeps being zero-implementation:
- [ ] performance tests. use different options and input image sizes and generate timings and output image diffs (as numbers - for example using imagemagick) - so we can better understand how options/image size/output quality relationships are. See https://github.com/Tw1ddle/geometrize-haxe-web/issues/3#issuecomment-504424092
- performance on haxe lib: 
  * explicit option to not copy buffers
  * https://stackoverflow.com/a/16679447/1179379 - seems transforming u8int to u32int array is faster to extract colors ? maybe even in haxe
  * use Uint8ClampedArray ? 
- [x] Be able to change options while the iteration is still running
- [x] be able to change iterations value ( while is running)
- [ ] Be able to pause an iteration and serialize its state (options and model, current iteration, iterations value) so later, in another process, we can load it and resume it (even increase iterations value)
- [x] implement quadratic blezier curves based on https://github.com/Tw1ddle/geometrize-lib/blob/be14f7bf0d183faa03127c6500c6194877b3ee3d/geometrize/geometrize/rasterizer/rasterizer.cpp#L308 ?

---
_Source: https://npm.io/package/geometrizejs · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._