本帖最后由 starmars 于 2020-8-13 05:32 编辑
VimVim 发表于 2020-8-13 01:26
完整看了楼主的所有讨论，发现原来的理解有误，重新梳理一下。
提出的需求是：“同时显示词典的两个页面！ ...
问题1：”虚拟大词表“ 比较适合按字母/读音序排列词典，而图片词典的类型多种多样，这个程序如何适应更多类型的图片词典？如何最大化降低误查率？普通的词典制作者能否搞定上述问题？
答：这种粗略匹配法，本来就是只适用于按字母顺序排列单词的英汉词典，其他不严格按顺序来的只能老老实实每页每个词头做OCR。但是，按字母顺序排列的词典可能占所有词典的99%都不止。在绝大多数情况下，如果你能忍受多花几秒钟的时间在页面上肉眼找到单词的位置，和忍受少量单词实际并不在该页面上（这是粗略匹配的缺点，误差率不在考虑范围内），就没有必要花那么多的时间去OCR每个单词，切图（或者获得每个单词解释所在页面的坐标信息）和进行繁杂的配套处理，没几个人有那么多精力的。粗略匹配法，真正需要的素材，仅仅是每页的扫描文件（往往超星都扫描好了），真正需要制作者手工制作的，仅仅是建立一张索引表，纸版词典有几页表中就有几行，表中每行对应一页写上该页的首单词（和/或末单词），而这个信息一般在词典每页顶部都有，只需OCR顶部这个信息即可。我做过一个测试，即使是完全不OCR，仅仅纯粹手工输入每页首单词（和/或末单词），一小时至少可以处理300页左右，一部词典的索引也就是半天功夫。其他的至于如何生成MDX对应的TXT文件，那是小工具根据索引表和虚拟词表自动生成了，而JS也是固定的写法对哪部词典都是相同的。编程上需要注意的是GoldenDict解析动态生成的图片地址前面必须加上一个Golden词典软件内部服务器地址前缀；另外就是如果有多部此工具制作出来的图片词典在词典软件中同时打开，要做到各自的JS和CSS相互不冲突（不同词典的JS/CSS在同时打开时相互冲突导致显示不正常，这是词典软件中很常见的现象，电脑版欧路尤其多）
问题2：”上百行JS程序“ 是指嵌入在词典中用于动态生成导航信息的js，还是指用于生成mdx词典的”通用软件
答：”上百行JS程序“ 是指嵌入在词典中用于动态生成导航信息的js（部分甚至全部导航信息也可以在MDX中写死，而不由JS动态生成/修改）；压缩mdx所需的txt文件另发布通用软件来生成（尽管这个软件不是必不可少的用简单的正则替换也能代替，但毕竟傻瓜式操作更好）
问题3：看到讨论中仅提到”欧路词典软件能做“，但很多人使用开源的GoldenDict或其他词典软件，程序是否兼容市面上主流的几款词典软件？
答：应该都可以兼容。我已经找到处理GoldenDict的办法了。GoldenDict解析动态生成的图片地址前面必须加上一个Golden词典软件内部服务器地址前缀。图片词典无非就是简单的HTML图片展示，导航信息和动态添加网页也是简单的小JS程序，不涉及复杂的HTML/CSS排版，所以应该会兼容任何平台的任何词典软件吧
问题4：这个程序是开源的吗？用户可扩展性如何？
答：生成MDX的小工具准备用C#编程。JS也很难不开源。如此简单的程序实在是不好意思说什么开源闭源了，没几行代码，任何有点编程基础的人都可以做，只是很多人没有意识到我说的同屏显示多页避免来回切换的重要性而已。希望我的工具出来后，制作一部新的图片词典唯一需要做的就是提供上述索引文件和每页扫描文件(请使用老马软件pdftoy将现有的词典pdf萃取出其中每页的图片pdftoy兼容性是最好的，并用ComicEnhancerPro处理图片)
本帖最后由 喬治兄 于 2020-8-13 08:40 编辑
starmars 发表于 2020-8-13 04:35
这个工具满足不了，因为它是精确匹配。我只求粗略匹配，没有必要（或者说是误导）在每个单词页面上展示该 ...
starmars 兄，在下個人觀點，粗略匹配的辭典真的不太好用，若多配一堆辭典上沒有的單字，找起來也是蠻麻煩的，權當成書簽知道是哪一頁就好，粗略定位也是很不準的，哪怕有座標值再處理也是一樣，因為數據的離散範圍是不變的，還是根据辭典對於您的價值再決定如何處理應該是會好一點，畢竟不是每本辭典都有很好的參考價值和實用性，用什方法處理或許權衡利弊之後再決定處理方式或許能節省些時間和體力，當然也取決于材料的性質留給你可處理的選項或許也不太多，也涉及到對於材料處理能力，希望把一本辭典處理到完美呈現當然是每位製作者想要的，但很多客觀和現實條件下也只能草草處理手上的材料.........{:4_105:}
很早之前就有Goldendict调用python代码实现模糊查询定位页面的帖子了，而且是通用的。
本帖最后由 VimVim 于 2020-8-13 08:17 编辑
starmars 发表于 2020-8-13 05:14
问题1：”虚拟大词表“ 比较适合按字母/读音序排列词典，而图片词典的类型多种多样，这个程序如何适应更多 ...
明白了，感谢解疑！
合适规模的”虚拟大词表“有时也不太好搞。当然，模糊匹配并非这个程序的最大亮点所在，无所谓了，大不了就来个精确索引。
亮点是那个JS：”导航控件可很方便地动态添加想要添加的前后相关页面“，而不影响其他词典查询结果的显示。
建议能够考虑如何让这个 JS 简易地部署于现有的各种制作工具链中，而不是仅能用于您自己的C#程序。毕竟解决这个痛点还是很合理的诉求，各方看到这个问题能解决，而且解决得很容易，那么想必大家会积极采用。注意目标用户是广大的非码农的词典制作者，太难了就搞不定了。
本帖最后由 VimVim 于 2020-8-13 08:20 编辑
chigre3 发表于 2020-8-13 08:06
很早之前就有Goldendict调用python代码实现模糊查询定位页面的帖子了，而且是通用的。 ...
C大可否将此秘技开源分享？否则大家只能重新造轮子。
chigre3 发表于 2020-8-13 08:06
很早之前就有Goldendict调用python代码实现模糊查询定位页面的帖子了，而且是通用的。 ...
Chigre 兄，您那篇用Python代碼實現模糊查詢定位應該是最佳解，雖沒用過也不太清楚運作方法，但如此的實現查詢應是最省時省力
chigre3 发表于 2020-8-13 08:06
很早之前就有Goldendict调用python代码实现模糊查询定位页面的帖子了，而且是通用的。 ...
请给帖子链接啊
VimVim 发表于 2020-8-13 08:08
明白了，感谢解疑！
合适规模的”虚拟大词表“有时也不太好搞。当然，模糊匹配并非这个程序的最大亮点所 ...
“JS：”导航控件可很方便地动态添加想要添加的前后相关页面“，而不影响其他词典查询结果的显示。”——
我目标是做出的小工具软件，不仅制作出新的图片词典加上这些导航控件，而且能改造旧的MDX解压后的TXT，完全傻瓜操作将此TXT文件拖入窗口即可完全智能地无人干预的修改其代码到加入此导航功能。
starmars 发表于 2020-8-13 12:38
“JS：”导航控件可很方便地动态添加想要添加的前后相关页面“，而不影响其他词典查询结果的显示。”—— ...
牛！期待发布！
本帖最后由 喬治兄 于 2020-8-13 14:50 编辑
starmars 发表于 2020-8-13 12:38
“JS：”导航控件可很方便地动态添加想要添加的前后相关页面“，而不影响其他词典查询结果的显示。”—— ...
老兄，加油，不要想太多，邊做邊改善，這樣你也會比較知道問題點怎樣解決會好一點，第一次就全壘打比較難......,不然就打個擦邊球，好歹，至少也摸到球了！夜店的咩也是如此，哈！哈哈哈！{:4_105:}
VimVim 发表于 2020-8-13 08:13
C大可否将此秘技开源分享？否则大家只能重新造轮子。
就是把输入的单词在使用replace为一定规则的纯a-z与大词表进行排序比较，找到相应的页码，直接显示zip或者目录下的png/tif/jpg等格式的图片。
本帖最后由 Jiangxi 于 2020-8-30 21:16 编辑
刚刚在GD上体验了一下楼主的15页实验版，的确解决了一个大问题。体验好多了。
此前用的图片词典，都是：
只要点击“下一页”，其它所有词典的查询结果都没有了，只显示这个“下一页”的内容。
而楼主这个，点击一下，下一页内容就“追加显示”出来了，其它的查询内容都还在，上下滑动仍可浏览。
{:4_101:}{:4_101:}{:4_101:}
本帖最后由 喬治兄 于 2020-8-30 21:57 编辑
starmars 发表于 2020-8-13 05:14
问题1：”虚拟大词表“ 比较适合按字母/读音序排列词典，而图片词典的类型多种多样，这个程序如何适应更多 ...可以考慮用這個
照著套用應該是 OK 的
https://www.w3schools.com/howto/ ... tryhow_js_slideshow
https://i.loli.net/2020/08/30/2wNyq4EKAGXtzY8.png
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {box-sizing: border-box}
body {font-family: Verdana, sans-serif; margin:0}
.mySlides {display: none}
img {vertical-align: middle;}
/* Slideshow container */
.slideshow-container {
max-width: 1000px;
position: relative;
margin: auto;
}
/* Next & previous buttons */
.prev, .next {
cursor: pointer;
position: absolute;
top: 50%;
width: auto;
padding: 16px;
margin-top: -22px;
color: white;
font-weight: bold;
font-size: 18px;
transition: 0.6s ease;
border-radius: 0 3px 3px 0;
user-select: none;
}
/* Position the "next button" to the right */
.next {
right: 0;
border-radius: 3px 0 0 3px;
}
/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
background-color: rgba(0,0,0,0.8);
}
/* Caption text */
.text {
color: #f2f2f2;
font-size: 15px;
padding: 8px 12px;
position: absolute;
bottom: 8px;
width: 100%;
text-align: center;
}
/* Number text (1/3 etc) */
.numbertext {
color: #f2f2f2;
font-size: 12px;
padding: 8px 12px;
position: absolute;
top: 0;
}
/* The dots/bullets/indicators */
.dot {
cursor: pointer;
height: 15px;
width: 15px;
margin: 0 2px;
background-color: #bbb;
border-radius: 50%;
display: inline-block;
transition: background-color 0.6s ease;
}
.active, .dot:hover {
background-color: #717171;
}
/* Fading animation */
.fade {
-webkit-animation-name: fade;
-webkit-animation-duration: 1.5s;
animation-name: fade;
animation-duration: 1.5s;
}
@-webkit-keyframes fade {
from {opacity: .4}
to {opacity: 1}
}
@keyframes fade {
from {opacity: .4}
to {opacity: 1}
}
/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
.prev, .next,.text {font-size: 11px}
}
</style>
</head>
<body>
<div class="slideshow-container">
<div class="mySlides fade">
<div class="numbertext">1 / 3</div>
<img src="img_nature_wide.jpg" style="width:100%">
<div class="text">Caption Text</div>
</div>
<div class="mySlides fade">
<div class="numbertext">2 / 3</div>
<img src="img_snow_wide.jpg" style="width:100%">
<div class="text">Caption Two</div>
</div>
<div class="mySlides fade">
<div class="numbertext">3 / 3</div>
<img src="img_mountains_wide.jpg" style="width:100%">
<div class="text">Caption Three</div>
</div>
<a class="prev">❮</a>
<a class="next">❯</a>
</div>
<br>
<div style="text-align:center">
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
</div>
<script>
var slideIndex = 1;
showSlides(slideIndex);
function plusSlides(n) {
showSlides(slideIndex += n);
}
function currentSlide(n) {
showSlides(slideIndex = n);
}
function showSlides(n) {
var i;
var slides = document.getElementsByClassName("mySlides");
var dots = document.getElementsByClassName("dot");
if (n > slides.length) {slideIndex = 1}
if (n < 1) {slideIndex = slides.length}
for (i = 0; i < slides.length; i++) {
slides.style.display = "none";
}
for (i = 0; i < dots.length; i++) {
dots.className = dots.className.replace(" active", "");
}
slides.style.display = "block";
dots.className += " active";
}
</script>
</body>
</html>
喬治兄 发表于 2020-8-30 21:52
可以考慮用這個
照著套用應該是 OK 的
您帖的这个程序是预先将所有图片都加载建立在DOM树中了，只是默认只显示某一个页面。如果需要看其他页面，在点击控制的时候再转向显示其他页面而隐藏刚才显示的页面。
这仍旧是一种静态处理方式，不是动态地将需要的页面只在有请求的时候才真正构建出来添加到DOM树中显示。
我最早就是按这种静态思维方式编程的：但是这样太费MDX体积了！
考虑一种极端情况，我查某个词的时候，在这个词所在的页面上点击上一页/下一页，显示出相邻页面之后继续在相邻页面上点击上一页/下一页, 就这样没完没了地点击上一页/下一页，最终将整部词典每一页都看个够 —— 为满足这个变态的目标，MDX必须制作成每个词头都要包含所有词典页面的信息！假设使用一个10万的虚拟词表，词典有2000页，压缩成MDX前的那个词典文本文件就需要2亿个页面信息。考虑到一个页面信息肯定不会只有一行HTML语句而是对应多行，那将是十几亿甚至几十亿行。我分析参照了一部图片词典《新时代英汉大词典》，观察了它的MDX语句行数和最后MDX文件的大小之间的关系，最后的结论是2000页的词典按上述这种作法的话，MDX将成几何级数的体积增长，最后会是几个GB甚至十几，几十个GB!
也许您会说，谁会查某个词就将顺带着整个词典页面浏览一遍呢？的确，这是极端。但不管怎样，这种静态方式是非常拙劣低效的，动态添加的方式远远好于它。
本帖最后由 喬治兄 于 2020-8-31 08:43 编辑
starmars 发表于 2020-8-31 08:07
您帖的这个程序是预先将所有图片都加载建立在DOM树中了，只是默认只显示某一个页面。如果需要看其他页面 ...
starmars 兄:
您说的那个需求的人太少了，不如研究一下这个，若是定位不从游标而来，而是座标是在 html 内，精确定位后放大一个范围，可否有解.....
https://www.w3schools.com/howto/ ... ryhow_js_image_zoom
喬治兄 发表于 2020-8-31 08:38
starmars 兄:
您说的那个需求的人太少了，不如研究一下这个，若是定位不从游标而来，而是座标是在 html 内 ...
我发现你这个链接的效果，如果不放大，而是按原始比例显示的话，正是现在的切图词典的效果，请问如何修改才能按原始比例显示呢？
本帖最后由 喬治兄 于 2020-8-31 09:09 编辑
wjl 发表于 2020-8-31 08:57
我发现你这个链接的效果，如果不放大，而是按原始比例显示的话，正是现在的切图词典的效果，请问如何修改 ...
wjl 兄:
試這兩個參數改成依樣應該就是你說的
這裏有成品可改來試試
【圖片索引】中文大辭典+部件檢索+放大鏡 (mdict only) v3
https://www.pdawiki.com/forum/thread-40920-1-1.html
.img-zoom-lens {
position: absolute;
border: 1px solid #d4d4d4;
/*set the size of the lens:*/
width: 40px;
height: 40px;
}
.img-zoom-result {
border: 1px solid #d4d4d4;
/*set the size of the result div:*/
width: 300px;
height: 300px;
}
喬治兄 发表于 2020-8-31 09:05
wjl 兄:
試這兩個參數改成依樣應該就是你說的
這裏有成品可改來試試
这放大镜看起来是CSS定义的，镜框大小写死了。还是要JS处理能够随时设置放大镜大小，且可记忆住无需修改CSS文件中的设置来得方便。CSS毕竟不如编程，JS编程是最具灵活性最强大的手段，没有之一。我看看这个放大镜JS脚本如何来弄。
starmars 发表于 2020-8-31 11:09
这放大镜看起来是CSS定义的，镜框大小写死了。还是要JS处理能够随时设置放大镜大小，且可记忆住无需修改C ...
用JS实现每个条目使用不同大小的镜框的话，需要将坐标信息写入HTML文件还是别的位置呀？
使用了一下，很不错啊！
我如果要在其他词典中使用，是否只要加入其中的js就可以了？
starmars 发表于 2020-8-13 05:14
问题1：”虚拟大词表“ 比较适合按字母/读音序排列词典，而图片词典的类型多种多样，这个程序如何适应更多 ...
starmars 兄，大概知道你要的方式了，原来你要弄的就像拉园桶型的卫生纸般的划到哪才出现到哪源源不绝，是吗？哈！哈哈哈哈哈！这是蹲太久后想出来的创意吗？哈！哈哈，也就是你所谓的动态连续式的拉出来，这和一张一张抽出，用途不是也一样的吗？{:4_105:}
本帖最后由 starmars 于 2020-8-31 18:07 编辑
VimVim 发表于 2020-8-31 12:45
使用了一下，很不错啊！
我如果要在其他词典中使用，是否只要加入其中的js就可以了？ ...
要用我的JS,很简单，我的MDX中词头要求是这样的：
</>
abort
<link rel="stylesheet" type="text/css" href="isbn9787560085555.css"/>
<div id="book_isbn9787560085555">
<div class="dict-entry-headword">abort</div>
<img src="0005.png">
</div>
<script type="text/javascript" src="isbn9787560085555.js"></script>
为避免同时打开多部图片词典时发生冲突（这在词典软件中相当常见），用了一个唯一的字符串标识符如“_isbn9787560085555”分配给特定的词库，每个词库标识符都互不相同。当你需要制作一部新图片词典，请将标识符替换成自己定义的就可以。我会推出一个C#编写的桌面小工具，全自动做这些事。具体细节我以后再发帖说明。
至于已经推出的旧图片版词典如何引入我这里的功能？
我正在修改JS，力争可以通吃各种旧版图片版MDX。也会推出WINDOWS小工具去修改旧MDX。
原MDX中如果用到了JS，将该JS文件替换成我的即可；但如果原MDX中根本没有用到JS，那只能修改MDX加进JS文件引用才可以。如果原图片版如果还有其他功能（不管是靠JS还是CSS实现的），比如每页有页码导航或者显示出了每页的单词甚至还有什么放大镜功能，如果不将这些原附加功能去掉的话，有较小的可能会和我的代码发生冲突造成显示出问题的。要想绝对不发生问题只能忍痛去掉以前的那些功能。不过在下认为了实现我现在这个JS中的瀑布流效果，其他那些功能本来用处就不大去掉也无妨。如果非要保留以前功能的基础上加上我的功能又要100%不出错，那只能一部部词典MDX个别地针对性地编程和测试了。
喬治兄 发表于 2020-8-31 13:45
starmars 兄，大概知道你要的方式了，原来你要弄的就像拉园桶型的卫生纸般的划到哪才出现到哪源源不绝， ...
大师兄您真幽默啊！
这个效果其实称为“瀑布流”效果啊，在内容繁杂超多，但并不需要一次全部提取立即展示，只有滚动滚动条到尽头了才追加展示，免得浪费带宽的时候是很常用的。在大型电子商务网站如京东淘宝中非常普通的应用。
klwo2 发表于 2020-8-12 11:59
多年前的《汉语大字典》图片版就是能显示跨页的呀，楼主哪儿来的【所有图片词典】？我前几天刚发的Taber's...
试用了，很好的上下添页功能！点赞！
starmars 发表于 2020-8-31 17:49
要用我的JS,很简单，我的MDX中词头要求是这样的：
词条中间的空格可以删除吗？
对于<a class="pageNum currentPage" href="entry://DCIE_0001">1</a>这样的跳转，如何引入你的JS功能呀？