Comments (5)
Refer from
- https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
- https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/enumerateDevices
- bahmutov/ng-simple-webrtc#18
- https://stackoverflow.com/questions/41724545/select-rear-camera-on-android-device-jsartoolkit5
This is what I changed in searchForRearCamera()
function.
function searchForRearCamera() {
var deferred = new $.Deferred();
// MediaStreamTrack.getSources is deprecated https://www.chromestatus.com/feature/4765305641369600
// https://github.com/kdzwinel/JS-OCR-demo/issues/7
// use navigator.mediaDevices.enumerateDevices instead. https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/enumerateDevices
if (navigator.mediaDevices.getUserMedia) {
navigator.mediaDevices.enumerateDevices()
.then(function (sources) {
var rearCameraIds = sources.filter(function (source) {
return (source.kind === 'videoinput' && source.label.toLowerCase().indexOf('back') !== -1);
}).map(function (source) {
return source.deviceId;
});
if (rearCameraIds.length) {
deferred.resolve(rearCameraIds[0]);
} else {
deferred.resolve(null);
}
});
} else {
deferred.resolve(null);
}
return deferred.promise();
}
from js-ocr-demo.
Small front/back switch could be a nice addition in step one if anyone wants to take a stab at it.
from js-ocr-demo.
Has this been updated? On mobile I still only get the front facing camera when the rear camera is the useful one.
from js-ocr-demo.
@npsantini nope, but I agree that it'd be a really nice feature. Add it and I'll be happy to review and merge.
from js-ocr-demo.
I have given a shot and have completed it.
Change the following lines of code.
function setupVideo(rearCameraId) {
var deferred = new $.Deferred();
var videoSettings = {
video: {
optional: [
{
width: { min: pictureWidth }
},
{
height: { min: pictureHeight }
}
]
}
};
to
function setupVideo(rearCameraId) {
var deferred = new $.Deferred();
var front = false;
var videoSettings = {
audio: false,
video: {
width: 1920,
height: 1080,
facingMode: (front ? "user" : "environment")
}
};
//if rear camera is available - use it
if (rearCameraId) {
videoSettings.video.optional.push({
sourceId: rearCameraId
});
}
changing the above code will give you an image bug on ios safari(image upside down). so add the below line to fix up the bug but we need to put up a condition to check the environment of the webpage being opened i.e whether the page is opened on ios/android or windows platform.
the code to be added up
ctx.setTransform(1,0,0,-1,0,canvas.height);
tested on ios 11.0.1 iPhone xs max device.
I haven't tested out yet on android, if possible please kindly test it out on android and let me know.
from js-ocr-demo.
Related Issues (10)
- how to upload image? HOT 3
- i want make automation for pan verification HOT 1
- It's upside-down in Safari! HOT 1
- Unable to recognise text in different background colors
- Doesn't request Camera Permissions on Mobile HOT 4
- getUserMedia API needs HTTPS only HOT 14
- Replace OCRAD with tesseract.projectnaptha.com HOT 1
- FIY baidu-ocr-api HOT 1
- MediaStreamTrack.getSources is deprecated, update it to MediaDevices.enumerateDevices() HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from js-ocr-demo.