JavaScript/HTML/CSS半色调线条效果

我试图找到一个库/API来转换图像，并添加带有线条的半色调效果，就像这张图像一样

原始图像只是一只考拉，这种用法的示例取自

基本上，我想开发一个web应用程序，允许用户提交任何图像/照片，然后仅应用此效果作为预览，然后提交打印

我只想实现与中相同的功能，但我只关心图像上传和应用效果

我唯一的问题是找不到任何库/API允许我应用这种效果，我希望它是通过JavaScript实现的。我已经找到了两种使用这种滤镜的方法，但它只使用了点，效果不是理想的

问题

是否有任何库或API已经允许我这样做？我在GitHub、codepen上到处找了找，什么也没找到

我曾想过为此实现我自己的模块，但为了实现我自己的模块，是否需要对照片效果和像素操作有扎实的知识？我有JS方面的经验，但我对摄影/特效一无所知

我可以使用我在上面给出的站点的源代码吗（我从哪里得到这个图像示例）？我试图查看他们的代码，但我看不出如何只获取我自己使用所需的部分

我有一个.exe，可以让我完全做到这一点，但它是基于用户界面的。有没有办法通过JavaScript生成流程并通过编程应用效果？我不这么认为，因为它很可能是用.NET framework开发的，我不知道用JS做这件事的方法。这个应用甚至不是我可以用来调用API的DLL

关于实现我自己的，我是否已经看到没有NPM模块，我也在考虑制作一个，有人能提供一个指导方针吗？我基本上只需要将算法应用于每个图像文件

---

提前感谢。

我尝试搜索许多解决方案，我引用了这个，并为您编写了这个，如果您想设置线条边框和边沟，请检查js第51行

JS

function drawLine(imageData){
  // settings variable
  let _width = imageData.width;
  let _height = imageData.height;
  let lineWidth = 4;
  let lineGutter = 7;
  for(let i = 0; _height>i;i+=lineGutter){
    console.log(i)
    context.beginPath();
    context.moveTo(0, i);
    context.lineTo(_width, i);
    context.lineWidth = lineWidth;
    context.strokeStyle = '#ffffff';
    context.stroke();
  }
}