前端实现在PDF上添加标注(1)
前段时间接到一个需求，用户希望网页上预览PDF，同时能在PDF上添加文字，划线，箭头和用矩形框选的标注，另外还需要对已有的标注进行修改，删除。
期初在互联网上一通搜索，对这个需求来讲发现了两个问题。
第一：有些同行给的方案不符合预期。大多数是在PDF的上面加一层透明层，然后再在这个透明层上面添加文字。这样做批注不能随PDF滚动或放大缩小而跟随，回显也是一个麻烦事，可以说没办法回显。
第二：有些很强，功能很全面的给PDF添加批注的插件，完全符合需求，但是需要支付几百上千的费用。
因此只能硬着头皮开发了。
主要用 pdfjs + pdfjs-dist + jspdf + fabric实现，最终完美完成用户需求
效果展示：
1、添加自由线：
2、添加文字标注（可以对文字标注进行拖动位置，放大缩小）
3、添加矩形和箭头（添加后可调整位置，大小）
4、删除已经添加过的批注，以及将添加批注的PDF导出，带批注的PDF。
另外还能有很多其他的批注都能实现，比如添加图片，修改颜色，修改画笔粗细等等。
提供源码
相关文章：
前端实现在PDF上添加标注(1)
前段时间接到一个需求，用户希望网页上预览PDF，同时能在PDF上添加文字，划线，箭头和用矩形框选的标注，另外还需要对已有的标注进行修改，删除。 期初在互联网上一通搜索，对这个需求来讲发现了两个问…...
螺旋矩阵 II
螺旋矩阵 II 一、题目描述 给定一个正整数 n，请你生成一个包含 1 到 n^2 所有元素的 n x n 正方形矩阵，元素顺序按顺时针的方式进行螺旋排列。 示例 1：输入：n 3 输出：[[1,2,3],[8,9,4],[7,6,5]]示例 2：…...
【愚公系列】《Python网络爬虫从入门到精通》001-初识网络爬虫
标题详情作者简介愚公搬代码头衔华为云特约编辑，华为云云享专家，华为开发者专家，华为产品云测专家，CSDN博客专家，CSDN商业化专家，阿里云专家博主，阿里云签约作者，腾讯云优秀博主&…...
【linux学习指南】模拟线程封装与智能指针shared_ptr
文章目录 📝线程封装🌉 Thread.hpp🌉 Makefile 🌠线程封装第一版🌉 Makefile:🌉Main.cc🌉 Thread.hpp: 🌠线程封装第二版🌉 Thread.hpp:🌉 Main.cc …...
10、Python面试题解析：解释reduce函数的工作原理
reduce 是 Python 中的一个高阶函数，位于 functools 模块中。它的作用是将一个可迭代对象（如列表、元组等）中的元素依次通过一个二元函数（即接受两个参数的函数）进行累积计算，最终返回一个单一的结果。 1.…...
【含开题报告+文档+PPT+源码】学术研究合作与科研项目管理应用的J2EE实施
开题报告 本研究构建了一套集注册登录、信息获取与科研项目管理于一体的综合型学术研究合作平台。系统用户通过注册登录后，能够便捷地接收到最新的系统公告和科研动态新闻，并能进一步点击查看详尽的新闻内容。在科研项目管理方面，系统提供强…...
MySQL主从复制过程，延迟高，解决应对策略
MySQL主从复制延迟高是常见的性能问题，通常由主库写入压力大、从库处理能力不足或配置不当导致。以下从原因定位、优化策略和高级解决方案三个维度提供系统性解决方法： 一、快速定位延迟原因 1. 查看主从同步状态 SHOW SLAVE STATUS\G关键字段…...
Deepseek模拟阿里面试——数据库
在模拟阿里面试时，数据库部分需要涵盖广泛的知识点，包括基础概念、事务管理、索引优化、数据库设计、高并发处理、分布式数据库等。以下是对这些问题的详细分析和解答： 事务的ACID特性是什么，如何保证？ ACID特性&…...
大数据学习之SparkStreaming、PB级百战出行网约车项目一
一.SparkStreaming 163.SparkStreaming概述 Spark Streaming is an extension of the core Spark API that enables scalable, high-throughput, fault-tolerant stream processing of live data streams. Spark Streaming 是核心 Spark API 的扩展，支持实时数据…...
Java 高频面试闯关秘籍
目录 Java基础篇：涵盖OOP、多线程、集合等基础知识。Java高级篇：深入探讨HashMap、JVM、线程池等高级特性。Java框架篇：介绍Spring、SpringMVC、MyBatis等常用框架。Mysql数据库篇：包含SQL语句、事务、索引等数据库知识。分布式技…...
边缘计算网关驱动智慧煤矿智能升级——实时预警、低延时决策与数字孪生护航矿山安全高效运营
迈向智能化煤矿管理新时代 工业物联网和边缘计算技术的迅猛发展，煤矿安全生产与高效运营正迎来全新变革。传统煤矿监控模式由于现场环境复杂、数据采集和传输延时较高，已难以满足当下高标准的安全管理要求。为此，借助边缘计算网关的实时数据…...
Oracle认证大师（OCM）学习计划书
Oracle认证大师（OCM）学习计划书 一、学习目标 Oracle Certified Master（OCM）是Oracle官方认证体系中的最高级别认证，要求考生具备扎实的数据库管理技能、丰富的实战经验以及解决复杂问题的能力。本计划旨在通过系统化的…...
力扣 单词拆分
动态规划，字符串截取，可重复用，集合类。 题目 单词可以重复使用，一个单词可用多次，应该是比较灵活的组合形式了，可以想到用dp，遍历完单词后的状态的返回值。而这里的wordDict给出的是list&…...
如何在Linux中设置定时任务（cron）
在Linux系统中，定时任务是自动执行任务的一种非常方便的方式，常常用于定期备份数据、更新系统或清理日志文件等操作。cron是Linux下最常用的定时任务管理工具，它允许用户根据设定的时间间隔自动执行脚本和命令。在本文中，我们将详…...
C# ASP.NET核心特性介绍
.NET学习资料 .NET学习资料 .NET学习资料 在当今的软件开发领域中，C# ASP.NET凭借其强大的功能和丰富的特性，成为构建 Web 应用程序的重要技术之一。以下将详细介绍 C# ASP.NET的核心特性。 多语言支持 ASP.NET 支持多种语言进行开发，这使…...
Response 和 Request 介绍
怀旧网个人博客网站地址：怀旧网，博客详情：Response 和 Request 介绍 1、HttpServletResponse 1、简单分类 2、文件下载 通过Response下载文件数据 放一个文件到resources目录 编写下载文件Servlet文件 public class FileDownServlet exten…...
Spring常用注解和组件
引言 了解Spring常用注解的使用方式可以帮助我们更快速理解这个框架和其中的深度 注解 Configuration：表示该类是一个配置类，用于定义 Spring Bean。 EnableAutoConfiguration：启用 Spring Boot 的自动配置功能，让 Spring Boo…...
Spring中都应用了哪些设计模式？
好的！以下是您提到的八种设计模式在 Spring 中的简单示例： 1. 简单工厂模式 简单工厂模式通过传入参数来决定实例化哪个类。Spring 中的 BeanFactory 就是简单工厂模式的应用。 示例代码： // 1. 创建接口和具体实现类 public interface A…...
VSCode的安裝以及使用
c配置: 【MinGw-w64编译器套件】 https://blog.csdn.net/weixin_60915103/article/details/131617196?fromshareblogdetail&sharetypeblogdetail&sharerId131617196&sharereferPC&sharesourcem0_51662391&sharefromfrom_link Python配置: 【簡單ÿ…...
Datawhale 组队学习 Ollama教程 task1
一、Ollama 简介 比喻：Ollama 就像是一个“魔法箱子”，里面装满了各种大型语言模型（LLM）。你不需要懂复杂的魔法咒语（配置），只需要轻轻一按（一条命令），就能让…...
论文解读：交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架（二）
HoST框架核心实现方法详解 - 论文深度解读（第二部分） 《Learning Humanoid Standing-up Control across Diverse Postures》 系列文章： 论文深度解读 + 算法与代码分析（二） 作者机构： 上海AI Lab, 上海交通大学, 香港大学, 浙江大学, 香港中文大学 论文主题： 人形机器人…...
K8S认证|CKS题库+答案| 11. AppArmor
目录 11. AppArmor 免费获取并激活 CKA_v1.31_模拟系统 题目 开始操作： 1）、切换集群 2）、切换节点 3）、切换到 apparmor 的目录 4）、执行 apparmor 策略模块 5）、修改 pod 文件 6）、…...
k8s从入门到放弃之Ingress七层负载
k8s从入门到放弃之Ingress七层负载 在Kubernetes（简称K8s）中，Ingress是一个API对象，它允许你定义如何从集群外部访问集群内部的服务。Ingress可以提供负载均衡、SSL终结和基于名称的虚拟主机等功能。通过Ingress，你可…...
[ICLR 2022]How Much Can CLIP Benefit Vision-and-Language Tasks?
论文网址：pdf 英文是纯手打的！论文原文的summarizing and paraphrasing。可能会出现难以避免的拼写错误和语法错误，若有发现欢迎评论指正！文章偏向于笔记，谨慎食用 目录 1. 心得 2. 论文逐段精读 2.1. Abstract 2…...
Python实现prophet 理论及参数优化
文章目录 Prophet理论及模型参数介绍Python代码完整实现prophet 添加外部数据进行模型优化 之前初步学习prophet的时候，写过一篇简单实现，后期随着对该模型的深入研究，本次记录涉及到prophet 的公式以及参数调优，从公式可以更直观…...
拉力测试cuda pytorch 把 4070显卡拉满
import torch import timedef stress_test_gpu(matrix_size16384, duration300):"""对GPU进行压力测试，通过持续的矩阵乘法来最大化GPU利用率参数:matrix_size: 矩阵维度大小，增大可提高计算复杂度duration: 测试持续时间（秒&…...
使用 SymPy 进行向量和矩阵的高级操作
在科学计算和工程领域，向量和矩阵操作是解决问题的核心技能之一。Python 的 SymPy 库提供了强大的符号计算功能，能够高效地处理向量和矩阵的各种操作。本文将深入探讨如何使用 SymPy 进行向量和矩阵的创建、合并以及维度拓展等操作，并通过具体…...
【Java学习笔记】BigInteger 和 BigDecimal 类
BigInteger 和 BigDecimal 类 二者共有的常见方法 方法功能add加subtract减multiply乘divide除 注意点：传参类型必须是类对象 一、BigInteger 1. 作用：适合保存比较大的整型数 2. 使用说明 创建BigInteger对象 传入字符串 3. 代码示例 import j…...
【学习笔记】erase 删除顺序迭代器后迭代器失效的解决方案
目录 使用 erase 返回值继续迭代使用索引进行遍历 我们知道类似 vector 的顺序迭代器被删除后，迭代器会失效，因为顺序迭代器在内存中是连续存储的，元素删除后，后续元素会前移。 但一些场景中，我们又需要在执行删除操作…...
FOPLP vs CoWoS
以下是 FOPLP（Fan-out panel-level packaging 扇出型面板级封装）与 CoWoS（Chip on Wafer on Substrate）两种先进封装技术的详细对比分析，涵盖技术原理、性能、成本、应用场景及市场趋势等维度： 一、技术原…...