My question says it all. Here's my code that uploaded the image into the canvas element and I want it to be draggable like maps are in Google maps. Eventually I am going to want to zoom in and out.
Is this even possible in Canvas yet? In a lot of my searches I've seen that Canvas still has limitations so we should get that questioned answered first.
If anyone can find me simply javascript code that would be best. I am eventually transitioning this to an app and I would like to cut back on the load time with simpler JS.
If anyone has really good canvas.html5.javascript sources for ios development I would really appreciate that also. This is my first project and as per usual I have bit off more that I can chew. Thanks!
<!doctype html> <head> <meta charset="utf-8"> <title>Capstone Test</title> <link rel="stylesheet" type="text/css" href="style.css" /> <!-- iPad icon for app --!> <link rel="apple-touch-icon" href="#" /> <link rel="apple-touch-icon-precomposed" href="#"/> <!-- Controls page scaling --> <meta name="viewport" content="user-scalable=yes, width=device-width" /> <script src="NKit.js" type="text/javascript" charset="utf-8"></script> <script> window.onload = function(){ var canvas = document.getElementById("myCanvas"); var context = canvas.getContext("2d"); var destX = 0; var destY = 0; var imageObj = new Image(); imageObj.onload = function(){ context.drawImage(imageObj, destX, destY); }; imageObj.src = "westeros.png"; </script> </head> <body> <div class="container"> <section class="left"> <canvas id="myCanvas" height=1024 width=360> </canvas> </section> </div>
Thanks!
