跳到内容
  • 福昕首页
  • 开发中心
  • SDK文档资料
  • 插件商店
  • 福昕首页
  • 开发中心
  • SDK文档资料
  • 插件商店
申请试用
  • 企业自动化
    • Compressor
  • 福昕CloudAPI
  • 福昕PDF SDK 软件开发工具包
    • 福昕PDF SDK(ActiveX)
    • 福昕PDF SDK(桌面/服务器)
    • 福昕PDF SDK(Plug-in)
    • 福昕 PDF SDK(安卓)
    • 福昕PDF SDK(iOS)
    • 福昕PDF SDK(Web)
  • 福昕管理控制台
    • 公有云
    • 私有云
    • 通用情况
  • 福昕阅读器
    • RMS插件
  • 福昕高级编辑器
    • AI助手
    • Mac版本
      • 常规问题
    • Windows版本
      • 表单
      • ECM集成
      • 互联PDF
      • 企业管理指南
      • 保护
      • 内容编辑
      • 创建PDF
      • 压缩
      • 图章
      • 安装与卸载
      • 常见问题
      • 打印
      • 注释/评论
      • 福昕插件
      • 翻译助手
      • 翻译助手教程
      • 试用与激活
      • 转换
      • 页面管理
    • 教育用户
      • 论文查重
      • 论文畅
      • 操作指南
    • 网页版
      • Foxit eSign
      • 电子签章
    • 订阅
    • 资源
  • 福昕高级编辑器Linux版本
  • 福船图纸管理系统
  • 福昕PDF SDK 软件开发工具包 > 福昕PDF SDK(Web)
  • 标签:
  • JavaScript,PDFUI,PDF教程,列表,前端开发,替换,电子图章

PDFUI 图章列表自定义教程:替换内置图章的两种方法

  • 福昕知识库
  • 2026-04-01

本文介绍 PDFUI 图章列表的两种自定义方法:一是在实例化时移除内置的“数字图章”组件,二是通过 initAnnotationIcons 接口重置整个图章列表数据。

方法一:移除内置的“数字图章”组件

在实例化 PDFUI 对象时,通过 fragments 参数移除组件名称为 create-digital-stamp-list 的数字图章组件。示例代码如下:

var Events = UIExtension.PDFViewCtrl.Events;
var pdfui = new UIExtension.PDFUI({
viewerOptions: {
libPath: ‘../../../lib’,
jr: {
readyWorker: readyWorker
},
},
renderTo: ‘#pdf-ui’,
appearance: UIExtension.appearances.adaptive,
fragments: [{
target: ‘create-digital-stamp-list’,
action: UIExtension.UIConsts.FRAGMENT_ACTION.REMOVE
}],
addons: UIExtension.PDFViewCtrl.DeviceInfo.isMobile ?
‘../../../lib/uix-addons/allInOne.mobile.js’ : ‘../../../lib/uix-addons/allInOne.js’
});

方法二:重置图章列表信息

图章文件类型支持 bmp、jpg、jpeg、png、tif、tiff 和 pdf。对于 tif、tiff 和 pdf 类型,还需提供相同前缀的 svg 文件以便在图章列表中显示。希望缩放不失真建议选择 svg 矢量格式,此时 fileType 设为 pdf,url 配置为 PDF 文件路径,同尺寸 svg 图标放在 pdf 同级目录下。width 和 height 分别设置图章放置在页面上的默认大小。

图章列表数据示例代码如下:

var newStampIconsList = [{
annotType: ‘stamp’,
category: ‘类别1’,
name: ‘孟庆华’,
url: “http://10.204.1.109:8081/CustomStaticStamps/CircleStampStatic.png”,
fileType: “png”,
width: 200,
height: 200
}, {
annotType: ‘stamp’,
category: ‘类别1’,
name: ‘非矢量的椭圆章’,
url: “http://10.204.1.109:8081/CustomStaticStamps/OvalStamp.png”,
fileType: “png”,
width: 225,
height: 135,
}, {
annotType: ‘stamp’,
category: ‘类别2’,
name: ‘矢量的椭圆章’,
url: “http://10.204.1.109:8081/CustomStaticStamps/OvalStamp.pdf”,
fileType: “pdf”,
width: 225,
height: 135,
}];

调用 initAnnotationIcons 接口重置图章列表,示例代码如下:

pdfui.eventEmitter.on(PDFViewCtrl.constants.ViewerEvents.renderFileSuccess, (pdfDoc) => {
pdfui.getPDFViewer().then(async function(pdfViewer) {
pdfViewer.initAnnotationIcons(newStampIconsList);
});
})

方法一移除数字图章,方法二自定义图章列表,两种方法可单独或配合使用。

免费获取SDK试用

相关内容

PDF流式编辑,改文字自动重排版

PPT转PDF后如何改文字?不用重做PPT也能改!

多篇文献批量搜关键词,一键高亮导出,效率拉满!

使用工具去除PDF水印是否合法?

Linux版本中如何实现OFD与PDF格式互转

Linux版本中如何自动创建书签(需要2025.1版本)

Linux版本中如何实现在文档中进行手写签名

Linux版本中如何实现文档交叉合并功能(需要2025.1版本)

Linux版本中如何实现同个窗口并排查看两个文档

Linux版本中如何打印OFD格式文档(需要2025.2版本)

推荐内容

PDF流式编辑,改文字自动重排版

PPT转PDF后如何改文字?不用重做PPT也能改!

多篇文献批量搜关键词,一键高亮导出,效率拉满!

使用工具去除PDF水印是否合法?

Linux版本中如何实现OFD与PDF格式互转

Linux版本中如何自动创建书签(需要2025.1版本)

Linux版本中如何实现在文档中进行手写签名

Linux版本中如何实现文档交叉合并功能(需要2025.1版本)

Linux版本中如何实现同个窗口并排查看两个文档

Linux版本中如何打印OFD格式文档(需要2025.2版本)

产品
  • 应用行业
  • 白皮书
开发支持
  • 开发中心
  • SDK文档资料

销售咨询:010-50951668

客服电话:0591-38509808

销售咨询
微信公众号

©2026 福建福昕软件开发股份有限公司 版权所有

隐私策略