I'm would like to load a jpeg image to a canvas from a binary array (currently trying with an Uint8Array). I've been looking all over the net for a solution but all I could find is converting the array to base64 and then loading the image which is not very efficient.
Here is my code used for loading the image:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<canvas id="MainImage" width="756" height="600">Your browser doesn't support html5</canvas>
<script type="text/javascript">
_Request = new XMLHttpRequest();
var url = "http://localhost/AAA/S.jpg";
try {
_Request.onreadystatechange = function() {
if (_Request.readyState == 4 && _Request.status == 200) {
var downloadedBuffer = _Request.response;
if (downloadedBuffer) {
var binaryByteArr = new Uint8Array(downloadedBuffer);
}
}
_Request.open('GET', url, true);
_Request.responseType = 'arraybuffer';
_Request.send();
} catch (e) {
}
</script>
</body>
</html>
I would like to load this processed array of the image to a canvas.
This is just a sample, my original code receives a binary array with multiple jpeg images in a single array so other methods wont work.
Any help would be appreciated
See Question&Answers more detail:
os 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
