Canvas - How to zoom in and out of image

Posted on 2014-08-14
Medium Priority
Last Modified: 2014-08-18
I have canvas with an image. How can zoom in and out? maybe pan too?

   // Load Image
            var cnv = document.getElementById('cnv');
            var ctx = cnv.getContext("2d");
            var img = new Image();
            img.onload = function ()
                ctx.drawImage(this, 0, 0);
                console.log('image loaded');
            img.src = 'clipart_21.gif';
Question by:JElster
1 Comment
LVL 34

Accepted Solution

Big Monty earned 2000 total points
ID: 40261607
you want to look into the scale() function

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
Suggested Courses

809 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question