HTML5 canvas drawImage () not drawing large images in Firefox
If I try to run the code on localhost. This doesn't show the image with mozilla firefox, but other browsers. If I try to load upload with few images
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<canvas id="containerScaled"></canvas>
<script>
$(document).ready(function() {
var canvasScaled = document.getElementById("containerScaled");
var ctxScaled = canvasScaled.getContext("2d");
var imageWidth = 500;
var imageHeight = 500;
img = new Image();
img.onload = function() {
ctxScaled.drawImage(img, 0, 0, imageWidth, imageHeight);
};
img.src = 'http://upload.wikimedia.org/wikipedia/commons/3/3f/Fronalpstock_big.jpg'
});
</script>
+3
source to share
1 answer
This is how it looks in this context:
$(document).ready(function() {
var canvasScaled = document.getElementById("containerScaled");
var ctxScaled = canvasScaled.getContext("2d");
var imageWidth = 500;
var imageHeight = 500;
img = new Image();
img.onload = function() {
ctxScaled.drawImage(img, 0, 0, imageWidth, imageHeight);
};
img.src = 'http://upload.wikimedia.org/wikipedia/commons/3/3f/Fronalpstock_big.jpg'
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<canvas id="containerScaled"></canvas>
0
source to share