---
title: "HTML5 Canvas - How to draw rectangle over image in canvas"
description: "HTML5 Canvas - How to draw rectangle over image in canvas"
author: "Anonymous User"
published: 2014-12-31
updated: 2014-12-31
canonical: https://www.mindstick.com/forum/12832/html5-canvas-how-to-draw-rectangle-over-image-in-canvas
category: ".net"
tags: ["jquery", "javascript", "html", "html5", "html5 canvas"]
reading_time: 2 minutes
---
# HTML5 Canvas - How to draw rectangle over image in canvas
I need to draw [image](https://www.mindstick.com/articles/23551/an-investigate-distinctive-seafood-restaurant-for-your-image-stamp-character) without using img from onload [function](https://www.mindstick.com/articles/13001/multi-statement-table-valued-user-defined-function-in-sql-server) which is like this:\
```
var imagePaper = new Image(); imagePaper.onload = function(){ context.drawImage(imagePaper,100, 20, 500,500); }; imagePaper.src = "images/main_timerand3papers.png";}
```
But I want to able draw rectangle over canvas using simply attaching img src above canvas,just as:\
```
Canvas:
But I'm unable to draw line over img in canvas,either img is drawing or shape is hiding behind. This is my [full](https://www.mindstick.com/articles/12893/experience-the-full-power-of-suitecrm) [code](https://yourviews.mindstick.com/view/85458/alan-turing-the-mastermind-behind-cracking-the-enigma-code-during-world-war-ii):
```
Playing YouTube video on HTML5 canvas Canvas:
```
## Replies
### Reply by Anonymous User
Because you are not waiting for the image to load first. In your script add an window.onload()\
```
```
What is happening is it's trying to draw the image before it loaded, doing window.onload will call the code once the entire document is loaded (such as images). Otherwise it may display no image or draw it out of line.
---
Original Source: https://www.mindstick.com/forum/12832/html5-canvas-how-to-draw-rectangle-over-image-in-canvas
Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.