如何在JavaScript中实现地图？

Question

我想知道，这将是把这个最简单的方法：

{x: 0, y: 0, image: 'map_00_00.png', 
x: 50, y: 0, image: 'map_01_00.png', 
x: 50, y: 50, image: 'map_01_01.png'} 

变得像一个谷歌地图。我想留在jQuery中。你会用一些插件来拖动吗？或只是与一些简单的事件？

我想最简单的方法是一次加载所有图像，它们与CSS定位，并添加一些拖到显示视窗的隐蔽部位。

不过我对别人的想法很好奇。

Answer 1

所以我砍死解决这个早晨，它是非常简单的。

1. 一个div位于[0,0]并具有100％的宽度和高度。
2. 里面是另一个div，它是绝对定位的，最初位于[0，0]，但这个将随着我们的拖动而移动。此外，一切都在这一个。
3. 你不能使用jQuery的Draggable实现。事情是，你不想拖动第2号本身，因为你会拖动它:-)

所以我实现了我自己的拖放，它接收顶部div上的事件并移动基础之一。结帐source code！

Answer 2

最简单的方法可能只是通过谷歌地图API的custom map type添加到谷歌地图。看看ImageMapType哪些可能适合你。

Answer 3

退房的OpenLayers项目。这是一个开源的地图界面实现（与谷歌地图非常类似）。你可以从那里得到一些想法。