You can easily add image content to canvas using a few simple commands built into the canvas API. It should be noted that you must wait until the image is fully loaded before you can operate it. The browser usually loads the image asynchronously while the page script is executing. If you try to render an image to the canvas before it is fully loaded, no image will be displayed. The following example will load an image of a tree bark texture as a tree trunk for use by the canvas. To ensure that the image is fully loaded before rendering , a callback method is provided here, that is, the subsequent code will only be executed when the image is loaded