"绘图"在HTML&中的图像之上使用Javascript [英] "Draw" on top of an image in HTML & Javascript

问题描述

我正在构建一个网络应用程序，用户可以通过光标在其上绘图来标记图像。我们将用户绘图并将其发送到服务器以转换为PNG或其他格式进行存储。

I am building a web-app that will users mark-up images by "drawing" on it with their cursor. We'll take the users drawings and send it to the server to be converted to PNG or some other format for storage.

我们需要此应用程序在桌面上工作 - 和平板电脑的浏览器，所以Flash，Java和& Silverlight出局了。我们想支持IE8 +，FF，Chrome和&苹果浏览器。是否有任何类型的Javascript库将提供某种形式的原始MS-Paint绘图功能，以便我可以将该数据发送到服务器？

We need this app to work on both desktop- and tablet-based browsers, so Flash, Java, & Silverlight are out. We want to support IE8+, FF, Chrome, & Safari. Is there any type of Javascript library that will offer up some form of primitive MS-Paint-like drawing capabilities so I can send that data to the server?

这问题是类似的，但我正在寻找一些编码有机，人类手势的东西，而不是把它们画出来。

This question is similar, but I'm looking for something that'd encode organic, human gestures, not draw them out.

（不，创造本土每个不同移动平台的应用程序都不在我们的核心竞争力或预算范围内，因此这不是一个可行的选择。）

(And no, creating native apps for each different mobile platform is not within our core competency or budget, so that's not a viable alternative).

推荐答案

你可以要么使用html canvas元素，要么使用像 Raphael 这样的SVG库，例如 http://ianli.com/sketchpad/ 是使用Raphael的图书馆。

You can either use the html canvas element or use SVG library like Raphael e.g. http://ianli.com/sketchpad/ is a library using Raphael.

这篇关于"绘图"在HTML&中的图像之上使用Javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！