Revision history [back]

Hello everyone, I'm trying to extract the bounding rectangles recognised through the analysis of a VideoCapture stream, This code works great and I can draw the clip to a canvas dom object on screen:

let rect = candidates[i]
let rectangleFailColor = [0, 0, 255, 255] let rectangleOKColor = [0, 255, 0, 255] let point1 = new cv.Point(rect.x, rect.y);
let point2 = new cv.Point(rect.x + rect.width, rect.y + rect.height);
cv.rectangle(src, point1, point2, rectangleOKColor, 2, cv.LINE_AA, 0);
let cut_dst = src.roi(rect);
cv.imshow('cutOutput', cut_dst);

However, what I really want is to use the "cut_dst" clip and turn it into a base64 string. I could do it in the DOM object but as this is a video stream processing, performance is important and using a DOM object is pretty performance demanding as I extract a lot of rectangles for every frame.

Hance, I've tried imencode since it's available in js, but I'm unable to find the data type to use for my target object. Instead I get the following error: "Cannot call imencode due to unbound types"

Looking into the official documentation, it seems to require a "Output buffer resized to fit the compressed image" but I have no clue as to how to instantiate such object in javascript. Hence I come to you seeking for wisdom as I've spent a good week looking for a solution and failed miserably.

Thanks a lot in advance

Hello everyone, I'm trying to extract the bounding rectangles recognised through the analysis of a VideoCapture stream, This code works great and I can draw the clip to a canvas dom object on screen:

However, what I really want is to use the "cut_dst" clip and turn it into a base64 string. I could do it in the DOM object but as this is a video stream processing, performance is important and using a DOM object is pretty performance demanding as I extract a lot of rectangles for every frame.

Hance, I've tried imencode since it's available in js, but I'm unable to find the data type to use for my target object. Instead I get the following error: "Cannot call imencode due to unbound types"

Looking into the official documentation, it seems to require a "Output buffer resized to fit the compressed image" but I have no clue as to how to instantiate such object in javascript. Hence I come to you seeking for wisdom as I've spent a good week looking for a solution and failed miserably.

Thanks a lot in advance

Hello everyone, I'm trying to extract the bounding rectangles recognised through the analysis of a VideoCapture stream, This code works great and I can draw the clip to a canvas dom object on screen:

 let rect = candidates[i]
 let rectangleFailColor = [0, 0, 255, 255]
 let rectangleOKColor = [0, 255, 0, 255]
 let point1 = new cv.Point(rect.x, rect.y);
 let point2 = new cv.Point(rect.x + rect.width, rect.y + rect.height);
 cv.rectangle(src, point1, point2,  rectangleOKColor, 2, cv.LINE_AA, 0);
 let cut_dst = src.roi(rect);
 let buff = new cv.UCharVector()
 let caca = cv.imencode('jpg',cut_dst,buff)

However, what I really want is to use the "cut_dst" clip and turn it into a base64 string. I could do it in the DOM object but as this is a video stream processing, performance is important and using a DOM object is pretty performance demanding as I extract a lot of rectangles for every frame.

Hance, I've tried imencode since it's available in js, but I'm unable to find the data type to use for my target object. Instead I get the following error: "Cannot ""Cannot call imencode due to unbound types"types: NSt3__26vectorIhNS_9allocatorIhEEEE""

Looking into the official documentation, it seems to require a "Output buffer resized to fit the compressed image" but I have no clue as to how to instantiate such object in javascript. Hence I come to you seeking for wisdom as I've spent a good week looking for a solution and failed miserably.

Thanks a lot in advance

Hello everyone, I'm trying to extract the bounding rectangles recognised through the analysis of a VideoCapture stream, This code works great and I can draw the clip to a canvas dom object on screen:

 let rect = candidates[i]
 let rectangleFailColor = [0, 0, 255, 255]
 let rectangleOKColor = [0, 255, 0, 255]
 let point1 = new cv.Point(rect.x, rect.y);
 let point2 = new cv.Point(rect.x + rect.width, rect.y + rect.height);
 cv.rectangle(src, point1, point2,  rectangleOKColor, 2, cv.LINE_AA, 0);
 let cut_dst = src.roi(rect);
 let buff = new cv.UCharVector()
 let caca = cv.imencode('jpg',cut_dst,buff)

However, what I really want is to use the "cut_dst" clip and turn it into a base64 string. I could do it in the DOM object but as this is a video stream processing, performance is important and using a DOM object is pretty performance demanding as I extract a lot of rectangles for every frame.

Hance, I've tried imencode since it's available in js, but I'm unable to find the data type to use for my target object. Instead I get the following error: ""Cannot call imencode due to unbound types: NSt3__26vectorIhNS_9allocatorIhEEEE""

Looking into the official documentation, it seems to require a "Output buffer resized to fit the compressed image" but I have no clue as to how to instantiate such object in javascript. Hence I come to you seeking for wisdom as I've spent a good week looking for a solution and failed miserably.

Thanks a lot in advance

let tempCanvas = document.createElement("canvas");
cv.imshow(tempCanvas,cut_dst)
let b64image = tempCanvas.toDataURL()
console.log(b64image)