图片切割工具：将长图精准拆分为若干等份
专为电商详情页、长图分享、社交媒体内容设计，支持按数量或按高度两种切割模式，一键打包下载所有切片。
长图切割的典型应用场景
「一张很长的图需要切成多段」这个需求在以下场景中几乎每天都会出现：
- 电商详情页：淘宝、天猫、京东、拼多多等平台的商品详情图通常要求单张高度不超过一定限制（如 1200px 或 1500px）。设计师制作的长图动辄 8000-15000px 高度，必须切割后逐张上传。
- 微信公众号文章：虽然公众号正文可以直接插入长图，但过长的图片会影响加载速度和阅读体验。将教程类长图切成多段后配合文字说明穿插展示，效果更好。
- 小红书/微博：这些平台对单张图片的尺寸和比例有隐性的推荐规范（如小红书偏好 3:4 竖图），超长图片在这些平台上显示效果不佳。
- 微信朋友圈：朋友圈会自动压缩大图，导致文字变得模糊不可读。预先切割成多张短图可以规避这个问题。
- 打印输出：A4 纸的可打印区域有限（约 2480×3508 像素 @300dpi），超长图片打印时必须分页切割。
两种切割模式详解
- 按数量切割
- 指定要切成的份数 N，工具自动计算每份的高度 = 原图总高度 ÷ N。适用场景：你知道最终需要几张图——比如「我要切成 5 张发到朋友圈」。优点是结果数量精确可控；缺点是每份的实际高度可能不是整数，工具会自动处理余数分配（通常最后一张略小或略大）。
- 按高度切割
- 指定每份的高度 H（像素），工具按此高度从上到下依次切割。适用场景：你有明确的尺寸限制——比如「电商平台要求每张不超过 1200px 高」。优点是每份尺寸精确符合平台规范；缺点是最终数量取决于原图高度，可能不是整数（剩余不足一个单位高度的尾部会被保留为最后一张）。
选择建议：如果你关注的是「最终得到几张图」，用「按数量切割」；如果你关注的是「每张图多大」，用「按高度切割」。
常见问题
切割后的图片质量会下降吗？
不会。切割操作本质上是「从原图上截取指定区域的像素数据」，不涉及任何重采样或重新编码（除非你改变了输出格式）。每一张切片都是原图对应区域的完美复制品，像素级一致。你可以放心地用于印刷品等对画质要求极高的场景。如果选择了 JPG 格式输出且设置了质量控制参数，那才会有损压缩——建议保持默认的高质量设置。
为什么下载的是一个 ZIP 文件而不是逐张图片？
当切割数量较多时（如超过 10 张），逐张下载会导致浏览器弹出大量「保存文件」对话框，体验很差。本工具使用 JSZip 库将所有切片打包为一个 ZIP 文件一次性下载，你只需要解压一次就能获得全部图片。ZIP 内的文件名带有序号前缀（如 `001_切片.png`、`002_切片.png`），方便识别顺序。如果只有少量切片（1-3张），也可以在预览区逐张点击单独下载。
切割线正好切在文字中间怎么办？
这是机械切割最常见的问题。解决方案：（1）提前规划——在设计长图时就按照目标切割高度来排版，在每个切割点附近留出安全边距（至少 20-30px 的空白缓冲区）；（2）调整参数微调——如果按数量切割导致某条线切到了关键位置，可以尝试改用「按高度切割」并手动调整高度值偏移几像素；（3）后期拼接修正——如果只是个别位置有问题，可以用图片拼接工具将有问题的两张重新合并后再手动裁剪。最佳实践是在设计阶段就考虑切割需求，而非事后补救。
支持横向切割吗？目前只能竖着切？
当前版本仅支持横向切割（即沿水平方向将长图切成上下排列的多段），这是基于实际需求的统计——99% 的长图切割需求都是针对竖向长图的（电商详情页、手机截图、聊天记录等都是竖向超长的）。横向切割（将宽图切成左右排列的多段）的需求相对罕见（主要出现在全景图处理场景）。如果你确实需要横向切割功能，可以通过图像编辑软件先将图片旋转 90° → 切割 → 再将每张切片旋转回来作为临时替代方案。
最大支持多长的图片？
受限于浏览器的 Canvas 尺寸限制，大多数现代浏览器允许的最大画布尺寸约为 16384 × 16384 像素（不同浏览器略有差异）。这意味着理论上最大可处理 16384 像素高的图片。但在实际使用中，超过 10000px 高度的图片加载和处理时已经可能出现明显的性能下降（内存占用高、响应变慢）。如果你的图片特别长（如超过 20000px），建议先用其他工具进行预处理或分段处理。
切割后图片的文件命名规则是什么？
ZIP 包内的文件命名格式为：序号_原文件名_主机名_时间戳.扩展名（例如 `003_商品详情页_tools321.com_1717700000.png`）。序号从 001 开始递增，保证文件排序与切割顺序一致。这种命名方式既保留了原始文件的标识信息，又通过时间戳确保了唯一性——即使多次切割同一张图片也不会产生文件名冲突。