Hello.
Controlled at 640×480 size using Wisej.Web.Ext.Camera
If you paste the page, if you display the page in portrait orientation on your smartphone
The image size is displayed in the wrong ratio.
The image size is correct when the page is displayed in landscape orientation on the smartphone
It is displayed as a ratio.
Camera width and height by rotating the smartphone vertically and horizontally
I found that it is possible to display with the correct image size ratio by replacing
But where in Wisej.Web.Ext.Camera is the spinning event?
Please let me know if I should embed the program.
Hi Takao,
I will log an enhancement to add different scaling factors for the camera video based on the object-fit style attribute.
I assume you want a behavior like “Fill” that will let the video completely fill the container.
If this isn’t what you want or you have any questions, please let me know!
Best regards,
Levie
Can you please add a function ‘getPicture’ to wisej.web.ext.Camera.js
The current ‘getImage’ is limited by video stream at 640 x 480 ( I require higher capture resolution)
/**
* Returns the current frame from the camera video stream at 640 x 480 in base64.
*/
getImage: function () {
var ctx = this.__getCanvasContext();
if (ctx) {
ctx.filter = this.getVideoFilter();
//https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Taking_still_photos
// getMediaObject video” width=”640″ height=”480″
// capture a frame from the local video stream, however the resolution is only as good as the stream itself (in my case, 640 x 480).
ctx.drawImage(this._media.getMediaObject(), 0, 0, 640, 480); //this.canvas.width, this.canvas.height); <- Note: this just scales up
return this.canvas.toDataURL();
}
return null;
},
_________
Please Add a getPicture for camera native resolution capture e.g 1920×1080…
/**
* Returns a picture from the camera at higher resolution in base64.
* https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
*/
getPicture: function () {
/* use the Camera stream at higher rsolution */
// ..I dont know Js well enough to acomplish
//MediaDevices.getUserMedia()
//stream = await navigator.mediaDevices.getUserMedia(constraints);
//{
// audio: false,
// video: {
// width: { min: 1024, ideal: 1280, max: 1920 },
// height: { min: 576, ideal: 720, max: 1080 }
// }
//}
Levie (ITG)
Thank you
Object-fit properties on Wisej.Web.Ext.Camera
Correct image size after adding and testing
I was able to display at the ratio of.
Please login first to submit.