Googleマップ機能のようにドラッグ可能なキャンバスにアップロードされた画像を作る方法は？

私の質問はそれをすべて言っています。キャンバス要素に画像をアップロードしたコードがあります。マップがGoogleマップに表示されているようにドラッグ可能にしたいと考えています。最終的に私はズームインとズームアウトしたいと思っています。Googleマップ機能のようにドラッグ可能なキャンバスにアップロードされた画像を作る方法は？

これはCanvasでもまだ可能ですか？私の多くの検索でキャンバスにはまだ限界があることが分かりましたので、まず質問に回答する必要があります。

誰かが私を見つけることができる場合は、最高のjavascriptコードを探してください。私は最終的にこれをアプリケーションに移行しており、より簡単なJSで読み込み時間を削減したいと考えています。

誰かが本当にiOS開発用のcanvas.html5.javascriptソースを持っていれば、それも本当に感謝しています。これは私の最初のプロジェクトです。いつものように、私は噛むことができます。ありがとう！

<!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>

ありがとう！

出典

2012-03-31 Carey Brown