javascript - 图像中的可选区域/句子

Question

我有一本书的图像文件。我正在编写一个 Web 应用程序，用于加载书籍并一次显示一页。我想知道如何在页面中选择一个句子并显示一条消息。据我所知，它必须具有图像坐标。

请参阅http://epaper.dawn.com/其中新闻是可选择的。我只想在图像中选择句子并显示一些消息。我应该怎么做才能实现这个目标？谢谢。

Answer 1

您知道在哪里选择，或者换句话说，知道字符或句子在哪里吗？这本书有变化还是总是一样？如果光学字符识别不是解决方案，您需要拥有文本位置的完整信息，然后您只能添加例如其上方的透明文本可供选择，因为无法从光栅化图像中选择任何文本。

如果您拥有独立于图像的所有信息，您可以使用 HTML 和 CSS 将每个字符放置在原始图像的顶部。您需要将每个字符准确地放置在图像顶部的正确位置。

路上的龙是:

1. 您很可能需要依赖绝对定位，这需要繁琐的工作，并且在某些情况下可能会中断复制和粘贴，而接收端无法删除这些内容(复制通常会复制包含的样式)或
2. 您需要使用完全相同的字体，以及相同的间距、字偶间距、对齐方式、行高等 - 这本质上使得显示光栅图像的想法毫无用处，因为无论如何您都会拥有它的数字副本

您希望提供的选择选项越多，您拥有的字符、句子、段落、页面的替代方案越多，它就会变得越困难。