# Discussions about Region of Interests (ROI)
```javascript=
const data = readFileSync('color.png');
const color = decode(data);
const grey = color.grey();
const mask = grey.threshold();
/*
* A roiManager will create internally a Int16Array with
* consecutive positive values for white ROIs and consecutive
* negative values for black ROIs
*/
import {fromMask} from 'image-js/RoiManager';
const roiManager = fromMask(mask);
const options = {
minSurface: 100, // number of pixels default: 0
maxSurface: 200, // number of pixels, default Number.POSITIVE infinity
kind: BLACK, WHITE, BW, // default BW
}
const rois = roiManager.getRois(options); // options allow to filter
/*
ROI contains the following property:
- roi.map
- roi.id
- roi.column
- roi.row
- roi.width
- roi.height
- roi.surface
*/
for (const roi of rois) {
console.log(roi.getMBR(), roi.getFeretDiameters());
}
for (const roi of rois) {
color.extract(roi.getMask(), {
row: roi.row, column: roi.column // we set the origin of the mask
})
}
// make ROI straight
/*
In the current implementation we don't track the relative position and the (all?) parent images (which make sense at a memory point of view but could WeakMap be a solution ?)
*/
// we need the relative position of the masks
const masks = roiManager.getMasks(options);
const result = color.paintMasks(masks, options);
```
## What is the difference between a Mask and a ROI ?
https://github.com/image-js/image-js/blob/e73f59606218f274bbace969ae48af3bbe1d8b2a/src/image/roi/Roi.js#L26-L37
A roi does not contain any data but mainly computed characteristics (width, height, surface, perimeter, mbr, feretDiameters, ...) based on the ID of the roi (positive or negative value)
The roi has his relative position to the mask.