Contours.ts

Extract contours & shapes from an image, for browsers and node.js.


!CI


Features

$3

$3

How to use

$3

#### using pckage manager:

``bash
npm i contours.ts
`

Or

#### add to your webpage:

`html

`

Or

#### download manually:

Contours.ts

$3

#### Input Type

ContourFinder expects image data (multi-channel image data is suported) in following format:

`ts
/*
const imageData: {
data: number[] | Uint8ClampedArray
width: number
height: number
} = {
data: [0,0,0],
width: 1,
height: 1
}
*/
`

#### Get Contours

`ts
import { ContourFinder } from 'contours.ts'
const { contours } = new ContourFinder(imageData, {
blur: true, // blurs the image data
threshold: 85, // threshold image data
})

console.log(contours)

/*
logs:
[
[{x: 0, y: 0}, {x: 1, y: 0}], // contour
[{x: 0, y: 0}, {x: 1, y: 1}, {x: 2, y: 2}, {x: 3, y: 3}] // another contour
]
*/
`

#### Simplify Contours

`ts
import { ContourFinder } from 'contours.ts'
// simplify contours using Ramer–Douglas–Peucker algorithm
const { contours } = new ContourFinder(imageData).simplify(epsilon)

console.log(contours)

/*
logs:
[
[{x: 0, y: 0}, {x: 1, y: 0}], // contour
[{x: 0, y: 0}, {x: 3, y: 3}] // another contour
]
*/
`

#### Approximate Shapes

`ts
import { ContourFinder } from 'contours.ts'
// Or approximate contours to shapes
const { contours, shapeCollection } = new ContourFinder(imageData).approximate()

console.log(shapeCollection)

/*
logs:
[
{
points: [[{x: 0, y: 0}]],
lines: [[{x: 0, y: 0}, {x: 3, y: 3}]],
triangles: [],
squares: [
[{ x: 0, y: 0 },
{ x: 5, y: 0 },
{ x: 5, y: 5 },
{ x: 0, y: 5 },]
],
recangles: [],
circles: [],
polygons: [],
}
]
*/
`

Contributions

Contirbutions are welcome, code is heavily commented and tests are defined using jest

License

Distributed under the MIT License. See LICENSE` for more information.

Contact

Muhammad Ubaid Raza - @mubaidr - mubaidr@gmail.com

Acknowledgements

This project is heavily inspired by the these:

- benfoxall/contours
- dkendal/moore-neighbor_contour_tracer

Contributors ✨

Thanks goes to these wonderful people (emoji key):

Ben Foxall 💻

This project follows the all-contributors specification. Contributions of any kind welcome!