imagediff中文文档|imagediff js中文教程|解析

npm npmdoc 2年前 (2022-01-02) 890次浏览

imagediff中文文档|imagediff js中文教程|解析

安装命令:npm i imagediff

js-imagediff

基于 JavaScript / Canvas 的 imagediff 实用程序。

应用程序接口

  • createCanvas() 创建一个新的 Canvas 元素。
  • createImageData(width, height) 创建一个新的 ImageData 对象。
  • isImage(object) 测试 Image 对象。
  • isCanvas(object) Canvas 对象的测试。
  • isContext(object) CanvasRenderingContext2D 对象的测试。
  • isImageData(object) 测试 ImageData 对象。
  • isImageType(object) 测试上述任何一项。
  • toImageData(object) 将图像类型对象转换为新的 ImageData 对象。
  • equal(a, b, tolerance)测试图像类型对象是否相等;接受以像素为单位的容差。
  • diff(a, b, options) 对 a 和 b 执行图像差异,返回 a – b。

    • options.align设置为'top'在不同尺寸时顶部对齐图像。
  • noConflict() 为兼容性从全局空间中删除 imagediff,返回 imagediff。
  • imageDataToPNG(imageData, outputFile, [callback]) (仅限节点)使用可选回调将 imageData 渲染为 outputFile 中的 png。

节点

js-imagediff 可通过 npm 获得。它使用需要安装 lib cairo 的节点画布安装 js-imagediff 与npm install -g imagediff.

命令行

  • imagediff [-e|equal] [-t|tolerance VALUE] FILE_A FILE_B 使用可选容差测试两个图像文件的相等性,打印“真”或“假”。
  • imagediff [-d|diff] FILE_A FILE_B OUTPUT_FILE 在两个文件之间呈现图像差异,另存为输出文件。

找不到模块“画布”

为了更好的浏览器和 browserify 支持,Canvas 已移至可选依赖项。如果您看到无法找到模块的消息,请先检查npm install,以防安装它确实存在问题。这与 https://github.com/HumbleSoftware/js-imagediff/issues/22 有关如果您对此有任何问题,或者知道更好的解决方法,请告诉我。

单元测试画布

JS ImageDiff 开启了在 JavaScript 中轻松测试 Canvas 和其他类似图像的对象。js-imagediff 提供了两个 Jasmine 匹配器来使这更容易。

  • toImageDiffEqual(expected, tolerance) 期望结果等于另一种图像类型。
  • toBeImageData() 期望结果是 ImageData。

在失败的测试中,toImageDiffEqual()将显示预期图像、实际图像和两者的图像差异,让您轻松发现错误。

使用匹配器:

  beforeEach(function () {
    this.addMatchers(imagediff.jasmine);
  });

演示

用户

如果您正在使用 js-imagediff pelase,请给我们留言,让我们知道您正在用它做什么。

变更日志

1.0.8

  • 更新画布依赖项。
  • 暴露内部画布。

1.0.7

  • 为画布添加异步图像加载(关闭 #31、#35、#39)。
  • 支持--diff, --equal, --tolerance(关闭 #17)。

1.0.6

  • 添加顶部对齐的差异选项。
  • 修复不同透明胶片的问题。

1.0.5

  • 将画布移动到可选的依赖项以获取 browserify 支持。

1.0.4

  • 更新了画布依赖项。
  • 在 diff 模式下添加对参数计数的检查。

1.0.3

  • 添加了 NPM/node.js 支持。
  • equaldiff方法添加了命令行界面
  • 添加imageDataToPNG了节点环境的方法。
  • 添加了处理有损格式的容差,并提供可接受差异的选项。

1.0.2

  • 添加了可选的宽度/高度参数以createCanvascreateImageData.
  • 修复了toImageDiffEqual()匹配器和非节点类型的问题 – 不会将 ImageData 和上下文转换为 Canvas 元素进行显示。

1.0.1

  • 将库移至 imagediff.js
  • 添加茉莉花匹配器
  • 小错误修复,皮棉修复。

作者

卡尔·萨瑟兰carl@humblesoftware.com
http://www.humblesoftware.com

项目贡献人员列表:


极客公园 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:imagediff中文文档|imagediff js中文教程|解析
喜欢 (0)
.excerpt .focus {display:none}