Javascript - 使用项目选择构建可滚动地图的框架？

【问题标题】：Javascript - Which framework to build scrollable map with item selection?Javascript - 使用项目选择构建可滚动地图的框架？
【发布时间】：2012-02-04 22:36:40
【问题描述】：

我需要在移动设备网站上滚动一个大地图区域，并且能够在地图上选择 PNG 或矢量图像，如下所示：

最简单的方法是什么？ HTML5、jQuery、Sencha Touch 或 ?

【问题讨论】：

标签： jquery html sencha-touch html5-canvas

【解决方案1】：

使用 HTML5 画布，您可以像这样滚动：

JS：

var img = new Image();  
img.src = 'image.jpg'; 

var w = $(window).outerWidth();
var h = $(window).height();

var addit = -1;
var scrollSpeed = 10; 
var current = 0;

ctx = document.getElementById('canvas1').getContext('2d');

var init = setInterval(function() {
               current += addit;
               ctx.drawImage(img,current,0, w, h);
           }, scrollSpeed);

CSS：

body {
  overflow: hidden;
}
#canvas1 {
  position: absolute;
  height: 100%;
  width: auto;
  left: 0;
  top: 0;
}

HTML：

<canvas id="canvas1" width="1784px" height="534px"></canvas>

【讨论】：