epub 电子书排版问题 #141

rainrdx · 2022-10-09T19:42:35Z

首先感谢作者一直坚持开发这个。有了epub生成很多书籍都很完美了。我看了一下有两个小问题供作者参考。

都以这本书
忧患：边事、党争与北宋政治为例。查看第二章，惊悸：庆历增币与宋夏和议

问题一：HTML Escape
第二章开篇有一幅地图。地图下的Caption是PingFang SC。似乎Unescape没有处理好，‘变成了&#39。

问题二：加粗
第二章第二节，西夏使者也来了这里。有这么一段
蹊跷的是，这次李元昊还提出了一个诡异要求，要将“兀卒”这一称号改为“吾祖”。这意味着，以后宋朝以皇帝名义颁发给西夏国主的诏书中，要称对方为“吾祖”。元昊提出更改的理由是什么呢？文献中没有直接记载，但从欧阳修的回应中可以窥见端倪：“今自元昊以下，名称、官号皆用本国。若蕃语‘兀卒’，华言‘吾祖’，则今贼中每事自用蕃礼，安得惟于此号，独用华言，而不称‘兀卒’？” 《长编》卷142，仁宗庆历三年七月癸巳，第3409—3410页。所谓“蕃语‘兀卒’，华言‘吾祖’”，是说党项语“兀卒”，翻译为汉语即“吾祖”。欧阳修当然不懂党项语，此说从何而来？从“若”一字看，这应当就是西夏提出更改的官方理由。欧阳修对这一解释并不满意，对其动机深表怀疑，因为西夏政权所用种种名号、官称，全都来自本民族语言，为何独独于国主尊称，一定要用汉语意译？
其中
若蕃语‘兀卒’，华言‘吾祖’
独用华言
这两处在网页阅读器里是加粗的。但是在电子书中没有。

举一个斜体的例子。
以这本书有所不为的反叛者：批判、怀疑与想象力
有所不为的反叛者一章为例

The Scientist as Rebel
The Historian as Rebel

两个地方的书名都应该是斜体。

举一个字下加点表示着重的例子，以海边的卡夫卡这本书为例。第三章有这么一段：

“我也有个差不多和你同龄的弟弟。”她忽然想起似的说，“倒是因故很久没见了……对了，是的，你很像很像那孩子。没给人这么说过？”

•••

“那孩子？”

•••

“在那支乐队里唱歌来着，那孩子。在车上看见时我就一直那样想，但名字想不出来。想得很认真，脑袋差点儿想出窟窿，可就是不行。你也有这种情况吧——快要想出来了却想不出来。过去没给人说过长得像谁？”

••

这一段中加点的数量是正确的，但是没有加偏移。应该分别在“那孩子” “那孩子”和“那支”三处下加点。

目前没有看到其他复杂的排版例子比如说粗斜体，下划线，波浪线，框框等的例子。如果看到了会提供给作者。

写完了这个Issue发现还有一些问题
例子书是东晋门阀政治这一本，以释“王与马共天下”一章为例。

首先每章开头第一页是一个图文章首页。其中的页面深色背景在抓取的时候似乎丢失了。

类似的排版问题在海边的卡夫卡中也有。比如说每章的首页也有图文章首页。比如说第三章开头。鱼的图案和第三章应该在背景图的中上方，但是偏移完全没有，鱼，“第三章”，背景图是分别显示的。

然后是尾注。在释“王与马共天下”一章中[1] [2]这些点击了都是会跳到章末的注释。但是抓取以后直接就没了链接。

不好意思提交好多Bug。总之十分十分感谢作者！

The text was updated successfully, but these errors were encountered:

yann0917 · 2022-10-10T02:32:49Z

这里特别说明一下：

我开发的时候，是按某本书抓取数据写的，里面的排版格式可能没有包含那么多，就没考虑进来；
抓取到的 svg 数据，只处理了 <text> <image> 标签，也就是基本的文本和图片。像边框，代码段的灰色背景在<rect> <path> 为了请求完整的文本，请求参数width 和 height 写的很大，导致定位不到要写到什么地方，暂时没处理
字体是 FZFangSong-Z02 PingFang SC Source Code Pro ，如果本地有，生成 epub 的时候会用到，本地没有的话默认的宋体。字体的问题，后续会改进。
尾注这个我没看到，暂时没处理。

总之关于电子书的排版细节会逐渐优化的，不可能一开始就把所有的情况考虑到。

rainrdx · 2022-10-10T02:50:07Z

这里特别说明一下：

我开发的时候，是按某本书抓取数据写的，里面的排版格式可能没有包含那么多，就没考虑进来；

抓取到的 svg 数据，只处理了 <text> <image> 标签，也就是基本的文本和图片。像边框，代码段的灰色背景在<rect> <path> 为了请求完整的文本，请求参数width 和 height 写的很大，导致定位不到要写到什么地方，暂时没处理

字体是 FZFangSong-Z02 PingFang SC Source Code Pro ，如果本地有，生成 epub 的时候会用到，本地没有的话默认的宋体。字体的问题，后续会改进。

尾注这个我没看到，暂时没处理。

总之关于电子书的排版细节会逐渐优化的，不可能一开始就把所有的情况考虑到。

是的是的作者写就很感谢了。我就是看到一些bug注明一下，作者有心情看看就好。多谢！

rainrdx · 2022-10-10T03:06:34Z

测试了一下的确本地安装了字体就没问题了，似乎不是html escape的问题。感谢作者。

yann0917 · 2022-10-11T08:29:45Z

加粗、斜体已修复；
着重号，尾注跳转，文字放在背景图上，看到原因了，但是解析 svg 之后，因为只有文字，没法做特殊标记，暂时没想到解决办法。

rainrdx · 2022-10-11T10:52:26Z

@yann0917 太感谢作者修复这些了。谢谢谢谢。

rainrdx · 2022-10-11T12:28:15Z

@yann0917 看起来忧患这本书为例还是有个小bug (补注：试了一下别的电子书都有这个问题）
下面是错误代码

Error: parse utils.HtmlContent{Content:"<!DOCTYPE html>\n<html>\n<head>\n\t<meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n\t<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />\n\t<style>\n\t\t@font-face { font-family: \"FZFangSong-Z02\"; src:local(\"FZFangSong-Z02\"), url(\"https://imgcdn.umiwi.com/ttf/fangzhengfangsong_gbk.ttf\"); }\n\t\t@font-face { font-family: \"FZKai-Z03\"; src:local(\"FZKai-Z03\"), url(\"https://imgcdn.umiwi.com/ttf/fangzhengkaiti_gbk.ttf\"); }\n\t\t@font-face { font-family: \"PingFang SC\"; src:local(\"PingFang SC\"); }\n\t\t@font-face { font-family: \"Source Code Pro\"; src:local(\"Source Code Pro\"), url(\"https://imgcdn.umiwi.com/ttf/0315911806889993935644188722660020367983.ttf\"); }\n\t\ttable, tr, td, th, tbody, thead, tfoot {page-break-inside: avoid !important;}\n\t\timg { page-break-inside: avoid; max-width: 100% !important;}\n\t\timg.epub-footnote { padding-right:5px;}\n\t</style>\n</head>\n<body>\n</body>\n</html>", ChapterID:"cover.xhtml", PathInEpub:"/OEBPS/Text/cover.xhtml", TocLevel:0, TocHref:"", TocText:""} failed: Filename already used: cover.xhtml

看起来是代码里创建了封面以后再把原来的文件加进去有了冲突？顺便多一句，得到还挺奇怪的，有些书我看到封面文件还是不一样的名字。真的是感谢作者抽空处理。

yann0917 · 2022-10-11T13:57:08Z

@yann0917 看起来忧患这本书为例还是有个小bug (补注：试了一下别的电子书都有这个问题）下面是错误代码

Error: parse utils.HtmlContent{Content:"<!DOCTYPE html>\n<html>\n<head>\n\t<meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n\t<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />\n\t<style>\n\t\t@font-face { font-family: \"FZFangSong-Z02\"; src:local(\"FZFangSong-Z02\"), url(\"https://imgcdn.umiwi.com/ttf/fangzhengfangsong_gbk.ttf\"); }\n\t\t@font-face { font-family: \"FZKai-Z03\"; src:local(\"FZKai-Z03\"), url(\"https://imgcdn.umiwi.com/ttf/fangzhengkaiti_gbk.ttf\"); }\n\t\t@font-face { font-family: \"PingFang SC\"; src:local(\"PingFang SC\"); }\n\t\t@font-face { font-family: \"Source Code Pro\"; src:local(\"Source Code Pro\"), url(\"https://imgcdn.umiwi.com/ttf/0315911806889993935644188722660020367983.ttf\"); }\n\t\ttable, tr, td, th, tbody, thead, tfoot {page-break-inside: avoid !important;}\n\t\timg { page-break-inside: avoid; max-width: 100% !important;}\n\t\timg.epub-footnote { padding-right:5px;}\n\t</style>\n</head>\n<body>\n</body>\n</html>", ChapterID:"cover.xhtml", PathInEpub:"/OEBPS/Text/cover.xhtml", TocLevel:0, TocHref:"", TocText:""} failed: Filename already used: cover.xhtml

看起来是代码里创建了封面以后再把原来的文件加进去有了冲突？顺便多一句，得到还挺奇怪的，有些书我看到封面文件还是不一样的名字。真的是感谢作者抽空处理。

那倒不是这个原因，生成 epub 的这个库 github.com/bmaupin/go-epub，默认封面文件的名字是cover.xhtml , 获取的电子书封面名字刚好都是 cover.xhtml, 换一下不重复就好了。

rainrdx · 2022-10-12T22:19:14Z

@yann0917 谢谢作者修了封面文件的bug！看到作者在修文字对齐的内容。想提个小建议就是图片也有对齐问题。举个例子
五凉史（世间之盐系列）
版权信息这一章附有大量图片，全部都应该是居中的。

说实话这个完全不影响阅读。作者每天都在修bug都不好意思提issue了。就是记录一下供参考。

rainrdx · 2022-10-14T22:50:24Z

找到一个表格的例子。在此记录一下。不过处理表格本来就很麻烦，从SVG转也不知道有没有信息，加上作者用了大width/height来取完整的文本。我就假设太麻烦了所以也不麻烦作者看，就是记录一下：
成汉国史
第六章：成汉社会经济、文化与民族表6-1 表6-2 等

作者改了图片的对齐情况。不过有些图片没有style信息，导致加了

了以后图片显示不正确。我自己加了一个判断style是否为空就解决问题了。估计作者还在开发。开发完了以后我发个小PR就好。

yann0917 · 2022-10-15T01:27:52Z

找到一个表格的例子。在此记录一下。不过处理表格本来就很麻烦，从SVG转也不知道有没有信息，加上作者用了大width/height来取完整的文本。我就假设太麻烦了所以也不麻烦作者看，就是记录一下：成汉国史第六章：成汉社会经济、文化与民族表6-1 表6-2 等

作者改了图片的对齐情况。不过有些图片没有style信息，导致加了

了以后图片显示不正确。我自己加了一个判断style是否为空就解决问题了。估计作者还在开发。开发完了以后我发个小PR就好。

表格线段在<rect> 标签里，文字在<text> 标签里，源码是这样的，怎么解析成表格也是个问题：

<rect x="7581.000000" y="637.000000" width="12498.000000" height="1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="7581.000000" y="637.000000" width="12498.000000" height="1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="7581.000000" y="638.000000" width="1.000000" height="-1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="20078.000000" y="638.000000" width="1.000000" height="-1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="7581.000000" y="683.000000" width="12498.000000" height="1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="7581.000000" y="683.000000" width="12498.000000" height="1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="7581.000000" y="684.000000" width="1.000000" height="-1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="20078.000000" y="684.000000" width="1.000000" height="-1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="7581.000000" y="637.000000" width="1.000000" height="1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="7581.000000" y="683.000000" width="1.000000" height="1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="7581.000000" y="638.000000" width="1.000000" height="45.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="7581.000000" y="638.000000" width="1.000000" height="45.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="20078.000000" y="637.000000" width="1.000000" height="1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="20078.000000" y="683.000000" width="1.000000" height="1.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="20078.000000" y="638.000000" width="1.000000" height="45.000000" fill="transparent" stroke="rgb(73, 73, 73)" />
<rect x="20078.000000" y="638.000000" width="1.000000" height="45.000000" fill="transparent" stroke="rgb(73, 73, 73)" />



<text x="29.000000" y="527.000000" width="16.000031" top="510.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3216" len="3">类</text>
<text x="45.000031" y="527.000000" width="16.000031" top="510.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3219" len="3" newline="true">型</text>
<text x="7589.859375" y="527.000000" width="16.000031" top="510.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3247" len="3">田</text>
<text x="7605.859375" y="527.000000" width="16.000031" top="510.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3250" len="3" newline="true">租</text>
<text x="20086.843750" y="527.000000" width="16.000031" top="510.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3280" len="3">户</text>
<text x="20102.843750" y="527.000000" width="16.000031" top="510.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3283" len="3" newline="true">调</text>
<text x="29.000000" y="573.000000" width="16.000031" top="556.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3327" len="3">男</text>
<text x="45.000031" y="573.000000" width="16.000031" top="556.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3330" len="3" newline="true">丁</text>
<text x="7589.859375" y="573.000000" width="16.000031" top="556.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3358" len="3">三</text>
<text x="7605.859375" y="573.000000" width="16.000031" top="556.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3361" len="3" newline="true">斛</text>
<text x="20086.843750" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3396" len="3">绢</text>
<text x="20102.843750" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3399" len="3">数</text>
<text x="20118.843750" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3402" len="3">丈</text>
<text x="20134.843750" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3405" len="3">、</text>
<text x="20150.843750" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3408" len="3">绵</text>
<text x="20166.843750" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3411" len="3">数</text>
<text x="20182.843750" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3414" len="3" newline="true">两</text>
<text x="29.000000" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3463" len="3">女</text>
<text x="45.000031" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3466" len="3" newline="true">丁</text>
<text x="7589.859375" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3494" len="3">一</text>
<text x="7605.859375" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3497" len="3">斛</text>
<text x="7621.859375" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3500" len="3">五</text>
<text x="7637.859375" y="619.000000" width="16.000031" top="602.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3503" len="3" newline="true">斗</text>
<text x="29.000000" y="665.000000" width="16.000031" top="648.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3548" len="3">疾</text>
<text x="45.000031" y="665.000000" width="16.000031" top="648.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3551" len="3" newline="true">病</text>
<text x="7589.859375" y="665.000000" width="16.000031" top="648.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3588" len="3">七</text>
<text x="7605.859375" y="665.000000" width="16.000031" top="648.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3591" len="3">斗</text>
<text x="7621.859375" y="665.000000" width="16.000031" top="648.515625" height="22.000000" style="font-size:16px;font-family:'PingFang SC';" offset="3594" len="3" newline="true">半</text>

rainrdx · 2022-10-15T01:32:43Z

折腾rect这个太麻烦了就是记录一下。多谢作者一路开发。到现在已经基本没问题很好用了。

yann0917 · 2022-10-15T02:02:02Z

其实还有个办法，不解析 svg 了，直接嵌入 svg ,不过这样就得提前设置好 width,height , 按页下载而不是按章节下载了，否则还是会出现下载的内容不完整、行截断的情况。

下图，生成 epub 直接嵌入 svg 是可行的。

yann0917 · 2022-10-15T02:08:04Z

其实还有个办法，不解析 svg 了，直接嵌入 svg ,不过这样就得提前设置好 width,height , 按页下载而不是按章节下载了，否则还是会出现下载的内容不完整、行截断的情况。

下图，生成 epub 直接嵌入 svg 是可行的。

这样出现的问题是，整个页面是一张图片，注释都弹不出来。。

rainrdx · 2022-10-15T02:15:39Z

天哪多谢作者想。其实现在解析地已经基本上完美了，也很方便用。十分谢谢作者抽空了。

yann0917 · 2022-12-06T12:19:06Z

尾注跳转的问题已解决

yann0917 added the bug Something isn't working label Oct 10, 2022

yann0917 changed the title ~~epub 电子书的两个小问题~~ epub 电子书排版问题 Oct 10, 2022

yann0917 mentioned this issue Oct 11, 2022

🐛 fixe #144

Merged

yann0917 mentioned this issue Oct 12, 2022

电子书封面文件冲突 Filename already used: cover.xhtml #145

Closed

yann0917 self-assigned this Oct 13, 2022

This was referenced Dec 3, 2022

[1]格式的注释错行 #156

Open

抓取电子书时，无法捕获一段内的多种字体属性 #157

Closed

yann0917 mentioned this issue Jul 17, 2023

序号列表的第一行解析错位 #174

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

epub 电子书排版问题 #141

epub 电子书排版问题 #141

rainrdx commented Oct 9, 2022 •

edited

Loading

yann0917 commented Oct 10, 2022

rainrdx commented Oct 10, 2022

rainrdx commented Oct 10, 2022

yann0917 commented Oct 11, 2022 •

edited

Loading

rainrdx commented Oct 11, 2022

rainrdx commented Oct 11, 2022 •

edited

Loading

yann0917 commented Oct 11, 2022

rainrdx commented Oct 12, 2022 •

edited

Loading

rainrdx commented Oct 14, 2022

yann0917 commented Oct 15, 2022

rainrdx commented Oct 15, 2022

yann0917 commented Oct 15, 2022

yann0917 commented Oct 15, 2022

rainrdx commented Oct 15, 2022

yann0917 commented Dec 6, 2022

epub 电子书排版问题 #141

epub 电子书排版问题 #141

Comments

rainrdx commented Oct 9, 2022 • edited Loading

yann0917 commented Oct 10, 2022

rainrdx commented Oct 10, 2022

rainrdx commented Oct 10, 2022

yann0917 commented Oct 11, 2022 • edited Loading

rainrdx commented Oct 11, 2022

rainrdx commented Oct 11, 2022 • edited Loading

yann0917 commented Oct 11, 2022

rainrdx commented Oct 12, 2022 • edited Loading

rainrdx commented Oct 14, 2022

yann0917 commented Oct 15, 2022

rainrdx commented Oct 15, 2022

yann0917 commented Oct 15, 2022

yann0917 commented Oct 15, 2022

rainrdx commented Oct 15, 2022

yann0917 commented Dec 6, 2022

rainrdx commented Oct 9, 2022 •

edited

Loading

yann0917 commented Oct 11, 2022 •

edited

Loading

rainrdx commented Oct 11, 2022 •

edited

Loading

rainrdx commented Oct 12, 2022 •

edited

Loading