SpreadJS导出PDF使用备选字体

收藏

本帖最后由 Ellia.Duan 于 2024-12-24 17:24 编辑

SpreadJS支持导出PDF ，但是只内置14种标准字体。除了这些字体外，其他自定义字体需要进行注册。像我们常用的宋体，楷体等字体，如果有使用，需要注册。

关于如何注册字体，可参考这篇文章。

如果一个工作簿/ sheet 中包括很多字体，但是不想一个一个注册字体，想保留一个备选字体，该怎么办呢？
下文将详细介绍GC.Spread.Sheets.PDF.PDFFontsManager.fallbackFont的用法。

一、前端注册
现在有一个font.js长这个样子：
image.png970089721.png

看上图，定义了一个fonts对象，其中“simhei.ttf”的值为一串base64格式的值。这个文件包括了"MTCORSVA.TTF“、”simkai.ttf“这两个字体库。

有了font.js的基础，我们就可以通过fonts对象获取到对应字体的值，来完成注册字体，以及备选字体。

function registerCustomFont(fontsObj) {
var fonts = {
normal: fontsObj["simkai.ttf"]
};
GC.Spread.Sheets.PDF.PDFFontsManager.registerFont('楷体', fonts);
}

复制代码

上述代码中，fontsObj即之前提到的fonts对象。
通过上述代码，调用registerFont完成了楷体的注册。

GC.Spread.Sheets.PDF.PDFFontsManager.fallbackFont = function (font) {
var fontInfoArray = font.split(' '), fontName = fontInfoArray[fontInfoArray.length - 1];
if (fontName === 'simkai') {
return fontsObj["simkai.ttf"]
}
return fontsObj["simsun.ttf"] //比如您的fontsObj有"simsun.ttf"属性，上面链接中下载的文件没有此ttf值
}

复制代码

上述代码中，通过fallbackFont 设置了备选字体，判断如果当前字体是楷体，则还是返回楷体，否则其他字体均导出为宋体。

这种用法很简单，但是font.js 这个js文件很大，如果每一个字体都要去转换base64值，那可太麻烦了。
那么，可以直接导入ttf文件吗？答案是可以的。

二、服务端注册

通过XMLHttpRequest，ajax，fetch ，还有现在框架中用的很火的axios 都可以导入一个ttf文件，然后在回调函数中，调用registerFont，fallbackFont 即可。
这里以XMLHttpRequest为例。

function registerServerFont(name, type, serverPath) {
var xhr = new XMLHttpRequest();
xhr.open('GET', serverPath, true);
xhr.responseType = 'blob';
xhr.onload = function (e) {
if (this.status == 200) {
// get binary data as a response
var blob = this.response;
//将Blob 对象转换成 ArrayBuffer
var reader = new FileReader();
reader.onload = function (e) {
var fontrrayBuffer = reader.result;
var fonts = GC.Spread.Sheets.PDF.PDFFontsManager.getFont(name) || {};
fonts[type] = fontrrayBuffer;
GC.Spread.Sheets.PDF.PDFFontsManager.registerFont(name, fonts);
_fonts[name] = fontrrayBuffer
}
reader.readAsArrayBuffer(blob);
}
};
xhr.send();
}

复制代码

上面的代码定义了registerServerFont方法，然后进行调用registerServerFont方法进行注册。代码如下：

registerServerFont('微软雅黑', 'normal', './msyh.ttf');

复制代码

调用的时候，参数为字体类型，以及本地静态ttf文件的路径。
当全部调用结束后，获取到_fonts对象
定义registerFallBackFont方法：

function registerFallBackFont() {
GC.Spread.Sheets.PDF.PDFFontsManager.fallbackFont = function (font) {
var fontInfoArray = font.split(' '), fontName = fontInfoArray[fontInfoArray.length - 1];
if (fontName === 'msyh') {
return _fonts['微软雅黑'];
}
return _fonts['宋体'];
}
}

复制代码

在上述代码中，进行了判断。如果是微软雅黑字体，则继续用为微软雅黑，其他字体则使用宋体导出。

最后，SpreadJS固然有兜底方案，但是更推荐使用GcExcel进行PDF的导出。其中GcExcel有备选字体的相关策略，可以参考此链接：

		自动登录	找回密码
密码			立即注册

SpreadJS导出PDF使用备选字体

0 个回复

SpreadJS 认证

SpreadJS 高级认证