允许用户使用javascript/jquery编辑商场地图

这个场景就像我的网站（jQuery在asp.net 3.5之上）我有一个购物中心的静态地图（说 -
enter image description here ）
我希望允许用户添加/删除不同类型的标记（如“商店”，“洗手间”等），每个标识都有相关的名称。除了添加/删除这些兴趣点之外，不需要允许用户以任何方式编辑地图。
之后，用户可以搜索特定的名称或类型，并且应该在地图上高亮显示。允许用户使用javascript/jquery编辑商场地图

here提到了一些产品，如micello和navteq，这些对我来说似乎有些过火。
我认为this是正确的方向，但我需要一些更详细的说明。
任何意见将被审核。

来源

2011-07-24 J. Ed

你需要做的是将一个处理程序添加到图像的点击事件中，该处理程序将显示标记名称的输入，然后在填充输入后将标记添加到点击位置：这会给你一个想法（测试http://jsfiddle.net/Rqdv9/）

var storage = {} 
    $(document).ready(function() { 
    $("img#mallmap").click(function(e) { 
storage.posx = e.pageX; 
storage.posy = e.pageY; 
var nameinput = $("<input />"); 
nameinput.attr('type','text').appendTo('body'); 
nameinput.bind('blur',function() { 
if ($(this).val() != '') 
{ 
var markertext = $(this).val(); 
    nameinput.remove(); 
var marker = $("<div></div>"); 
marker.attr("class","marker").text(markertext).css('color','white').hide().appendTo('body'); 
marker.css({'position' : 'absolute','left' : storage.posx, 'top' : storage.posy}).show(); 
} 
}).hide().css({'position' : 'absolute','left' : storage.posx, 'top' : storage.posy}).show(); 
}) 
     });

这是一个非常简单的，我想你想收集更多的信息不仅仅是文本，所以你可以有一个显示在点击一个预先设计的动态表单，让他们为标记等选择图像，然后简单地为标记创建元素，然后如图所示添加它。

来源

2011-07-24 12:33:12

如果您需要重新使用它们，那么这些职位可以保存在数据库中。您可以将posX和posY保存到数据库中，只要您想要，就可以再次使用它们。您还可以保存额外的数据（img /信息/创建日期等）。 – Milaan

我最终使用了类似的东西，以及来自@Dheeraj Kumar的回答MobilyMap插件 –

这里有一个图我喜欢使用 - Mobily Maps

虽然它不允许你要找的功能，我相信它可以很容易地扩展。

来源

2011-07-24 12:14:41

这不是一个答案 –

这是真的有必要使用插件吗？

看起来好像只需要在地图上保存光标在地图上的位置就很容易了。

事情是这样的：

$('img').click(function(e) { 
    //some div is appearing letting you specify information about the spot 
    $.post('/url', {x: e.pageX, y: e.pageY, userData}); 
});

那不是更容易比加载插件做的工作适合你？

来源

2011-07-24 12:24:41

允许用户使用javascript/jquery编辑商场地图

回答

相关问题