JavaScript、文本注释和想法
我很好奇听到其他人对我已经思考了一段时间的问题的意见。
本质上，我想向用户呈现一个文本文档，并允许他/她选择文本并对其进行注释。具体到注释，我的目标是实现以下目标：
- 允许用户进行文本选择，对其进行注释，然后保存选择和注释以供以后参考
- （UI） 支持表示重叠注释。例如，如果字符串其中：“这是我的示例测试句子的测试句子”，则用户 1 可能具有“是我的示例的测试句子”的注释，而用户 2 可能具有“用于我的示例”的注释。
- 考虑文档文本发生更改的情况。如果可能的话，注释将被更新。
从技术角度来看，您将如何解决这个问题？
我的一些想法是：
- 使用 javascript 范围并将注释存储为一对整数，例如：(document_start_char, document_end_char)。将这一对保存在数据库中。
- 或者，使用 JS 获取所选文本并将全文保存在数据库中。 （不知道我将如何进行重叠注释）
- 通过应用 css 样式来突出显示文本，然后使重叠的注释“堆栈”变暗来表示重叠注释。最小的注释必须始终位于“堆栈”的顶部。
您的想法或需要改进的地方是什么？我到底如何才能支持文档文本的更新而不破坏所有注释？
I am very curious to hear input from others on a problem I've been contemplating for some time now.
Essentially I would like to present a user with a text document and allow him/her to make selections of text and annotate it. Specific to the annotations I aim to achieve the following:
- Allow users to make a text selection, annotate it, then save the selection and annotation for reference later
- (UI) Support representing overlapped annotations. For example if the string where: "This is the test sentence for my example test sentence", user1 might have an annotation on "is the test sentence for my example" and user2 might have an annotation on "for my example".
- Account for a situations where the document's text changes. The annotations would to be updated, if possible.
How would you tackle this from a technical perspective?
Some ideas I've had are:
- Use javascript ranges and store an annotation as a pair of integers something like: (document_start_char, document_end_char). Save this pair in the db.
- Alternatively, using JS get the text selected and actually save the full text in the db. (not sure how i would then do overlapping annotations)
- Represent overlapped annotations by applying a css style to highlight the text then darken the "stack" of annotations where they overlap. Smallest annotation would always have to be on the top of the "stack".
What are your thoughts or areas of improvement? How the heck could i support a document's text being updated without breaking all the annotations?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
我正在研究同样的问题，我个人赞成远离自己的问题，而倾向于使用现有的开源库，例如 注释器。
I'm researching this same question and personally I favor staying away from rolling my own, in favor of an existing open source library like Annotator.
http://mark.koli.ch/2009/09/use-javascript-and-jquery-to-get-user-selected-text.html（404响应）http:// /mark.koli.ch/2009/09/05/get-selected-text-javascript.html-（404 响应）获取所选文本非常简单。存储它（或其起点/终点）也是一个笑话。但是你的第三点呢？如果文本发生变化怎么办？
如果文本发生更改，原始文本和您存储的原始选择坐标将不等于当前修改的文本。您应该了解文本文档中存在的注释，以便每次更改时，都应该更新或删除引用该特定更改文本的注释（也许在快速比较之前和之后的文本之后：有一些缺少单词？或者只是纠正了一些单词？），但这似乎确实是一项艰巨的任务。
我认为将整个文本注释存储在数据库中是至关重要的，以避免它被更改和注释丢失。这样您仍然可以获得注释的完整文本。那么你还应该使用一种排序标志来指示注释的起始字符，如果文本发生变化，你可以计算变化之前的文档文本和变化之后的文档文本的字符差异，并通过这种方式找到原始注释的新起点（假设文档文本的注释部分未更改）。
将文本文档分成尽可能多的段落也应该有所帮助，这样您就可以将文档的不同部分分开并逐一进行处理。
现在我真的很想看到它完成！ :)
http://mark.koli.ch/2009/09/use-javascript-and-jquery-to-get-user-selected-text.html(404 response)http://mark.koli.ch/2009/09/05/get-selected-text-javascript.html- (404 response)Getting the selected text is really easy. Storing it (or its starting/ending points) is also a joke. But what about your point number 3? What if the text changes?
If the text changes, both the original text and the original selection coordinates you stored won't equal the current modified text. You should be aware of the annotations present in the text document, so that everytime it changes, the annotations referencing to that particular piece of changed text should be updated, or deleted (maybe after a quick comparison between the before and after text: are some words missing? or just some words have been corrected?), but this seems really a struggling task.
I think storing the entire text annotation in a db is essential, to avoid it being changed and the annotation lost. This way you will still have the complete text you annotated. Then you should also use a sort of flag to indicate the start character of the annotation, and if the text changes, you could calculate the difference in characters from the document text before the change, and the one after it, and find this way the new starting point of the original annotation (assuming the annotation part of the document text has't changed).
Dividing the text document in as many paragraphs as possible should also help, this way you could separate different pieces of the document and work on one by one.
Now I would really like to see it done! :)