允许用户编辑/添加/移动图像中的项目 [英] Allowing user to edit / add / move items in an image

问题描述

这就是我想要做的:
我有一张图片，比方说一个房间.这将是静态图像.

Here's what I'm looking to do:
I have an image, let's say of a room. This is going to be a static image.

我希望用户能够执行以下操作:
1.添加一组图像，例如椅子，桌子等.
2.移动图像上已经存在的项目.
3.编辑附加在图像上的文本.

I want the user to be able to do the following:
1. add a set of images, like a chair, desk, etc.
2. move items which are already on the image.
3. edit text attached to an image.

我还需要将此图像存储在服务器上，以便其他用户可以看到更新.

I need this image to be stored on the server, as well, so other users can see the updates.

有什么想法吗? TIA.

Any ideas? TIA.

编辑
我想基本上拥有一个Google Maps类型的界面，用户可以从给定的集合中添加/编辑/移动项目，而不是只读的.因此，例如，我想让他们拿起椅子"图像并将其滑动到椅子实际所在位置的房间图像上.我已经看过JQuery中的零碎工作，但是还没有找到一个很好的例子.希望有道理.

Edit
I want to basically have a google maps type interface, where instead of being read only, users can add / edit / move items from a given set. So, for example, I want to let them pick up a "chair" image and slide it onto the image of the room wherever the chair actually is. I've seen bits and pieces done in JQuery, but havevn't found a good example. Hope that makes sense.

Edit2
找到了与我要找的东西相似的东西.万一其他人需要做这样的事情，我正在查看 OpenLayers ，它在一个JS框架.

Edit2
Found something along the lines of what I was looking for. In case anyone else needs to do something like this, I'm looking at OpenLayers, which mimics GoogleMaps in a JS Framework.

推荐答案

您可以通过在IE上使用透明的png hack和服务器上对24位png s by most modern browsers. Store positions in database. Store png的本机支持来实现.

You could do this by using the transparent png hack on IE and native support of 24 bit pngs by most modern browsers. Store positions in database. Store pngs on the server.

这篇关于允许用户编辑/添加/移动图像中的项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！