CODEWITHSUNDEEP
javascripthtmlimagecanvasloader
Aria
Aria

Reputation: 45

javascript upload an image in canvas

I try to upload and draw an image into a canvas. I have the html code for button and canvas and js code for onchange event. My code does not work and I do not have any errors to figure out what is going on.

Upvotes: 0

Views: 664

Answers (1)

hd84335
hd84335

Reputation: 9873

The fix is by simply including your scripts at the end of the body before the closing tag </body>.

Your html code will appear like this:

<html>
<body>
    <div id="buttonsDiv" >
        <input type="file" accept="image/*" title="Upload Image" class="normal-button" id="uploadBtn"/>            
    </div>
    <canvas id= "myImgCanvas" title="Drop an image here to upload" ></canvas>

    <script src="myFileName.js"></script>
</body>
</html>

Note that you must pay attention when you should/ should not include your scripts in the <head> tag vs including it at the end of the </body> tag. You can check this post for the best practice.

Upvotes: 1

Related Questions