# How to find contour vertices in JS? Editing/Understanging FindContours Points in JS

I want to draw a small circle in each vertex of the largest contour. I successfully found the largest contour but how to find the highest points on it?

I saw this example and this is exactly what I want to do but the answer is for c++. How to do this in JS? I've tried to write in JS but no success. Here is the simplified code that I wrote

const contours = new cv.MatVector();
const hierarchy = new cv.Mat();
cv.findContours(src, contours, hierarchy, cv.RETR_LIST, cv.CHAIN_APPROX_SIMPLE);

const contoursToDraw = new cv.MatVector();

for (let i = 0; i < contoursSize; ++i) {
const cnt = contours.get(i);

const cntSize = cnt.size().width * target.size().height;
for (let j = 0; j < cntSize; j++)
{
const [x, y] = cnt.charPtr(j); //cnt[j] -> ?
const vertex = { x, y };
console.log('vertex', vertex);
cv.putText(cnt,'some text', vertex, cv.FONT_HERSHEY_SIMPLEX,1, [255, 0, 255, 255]);
cv.circle(cnt, vertex, 3, [0, 255, 0, 255], cv.FILLED);

}
contoursToDraw.push_back(cnt);
}


Then drawing contours on image and showing image.

What is the equivalent of ctr[i][j] in javascript? In general, if we have some Mat object

const imgElement = document.querySelector('#imageSrc');


edit retag close merge delete

1

can't completely answer, but contours are usually lists of int32 points, so your cnt.charPtr(j) looks wrong

1

After your comment, I've tried intPtr instead of charPtr

const [x, y] = cnt.intPtr(j);


and now it's work, thank you!! Is there a way to find how much these points are far from the vertical and horizontal edges?

^^ i'm glad to hear that !

how much these points are far from the vertical and horizontal edges?

the edges of what ? the image borders ? isn't that already in the coords ? e.g. dist to the bottom is img.rows-y

Yes, I mean from the image borders and again you are right img.rows-y is what I need, thanks!!