pdf.js 添加批注撤销功能按钮代码

以下是PDF.js添加批注撤销功能按钮的代码示例：

首先，在HTML文件中添加一个按钮元素：

<button id="undo-button">撤销</button>

然后，在JavaScript文件中添加以下代码：

// 获取撤销按钮和PDF.js渲染的canvas元素
var undoButton = document.querySelector('#undo-button');
var canvas = document.querySelector('canvas');

// 定义一个空的撤销历史记录数组
var undoHistory = [];

// 监听批注添加事件，将添加的批注存入撤销历史记录数组中
canvas.addEventListener('annotationAdded', function(e) {
  undoHistory.push(e.annotation);
});

// 监听撤销按钮的点击事件，从撤销历史记录数组中取出最后一个批注并删除
undoButton.addEventListener('click', function() {
  var lastAnnotation = undoHistory.pop();
  if (lastAnnotation) {
    canvas.dispatchEvent(new CustomEvent('annotationDeleted', { detail: lastAnnotation }));
  }
});

在上面的代码中，我们首先获取了撤销按钮和PDF.js渲染的canvas元素，然后定义了一个空的撤销历史记录数组。接着，我们监听了批注添加事件，并将添加的批注存入撤销历史记录数组中。最后，我们监听了撤销按钮的点击事件，从撤销历史记录数组中取出最后一个批注并删除。

需要注意的是，在撤销操作中，我们使用了自定义事件`annotationDeleted`，该事件需要在其他地方定义和处理。在此处，我们只是将其派发到canvas元素上，然后在其他地方监听该事件并处理相应的逻辑。