节点可以使用哪些包。做图像裁剪?

时间:2022-05-03 09:00:36

I'm creating a website using node.js. I have seen many libraries mentioned that piggy back on top of imagemagick etc. There is a list here: https://github.com/ry/node/wiki/modules#graphics

我用node.js创建一个网站。我见过很多库都提到过imagemagick等等。这里有一个列表:https://github.com/ry/node/wiki/modules#graphics

What I'm trying to do is take the image that a user uploads, crop it/size it to certain dimensions the site requires. What is the best/most active script to do this? I'd like one with npm support. Does anyone have actual experience using some of these?

我所要做的就是把用户上传的图片裁剪成网站需要的特定尺寸。什么是最好/最活跃的脚本?我想要一个有npm支持的。有人有使用这些工具的实际经验吗?

4 个解决方案

#1


26  

Think I found a decent imagemagick wrapper that can handle this pretty well. Even in memory before writing the file to disk. (aka user upload -> node imagemagick lib -> cdn and never touching the disk ... which is what I want)

我想我找到了一个不错的imagemagick包装器,它可以很好地处理这个问题。甚至在将文件写到磁盘之前也要在内存中。(也就是用户上传->节点imagemagick lib -> cdn,永远不接触磁盘……)这就是我想要的)

https://github.com/rsms/node-imagemagick

https://github.com/rsms/node-imagemagick

#2


19  

For anyone who is trying to do decide between Canvas and ImageMagick, I just tried both for comparison, and I'm getting much better results from imagemagick. Here's an image that was resized and cropped from 1024x768 to 128x128:

对于任何想在Canvas和ImageMagick之间做选择的人来说,我只是尝试了两者的比较,并且我从ImageMagick中得到了更好的结果。这里有一张图片,从1024x768调整到128x128:

http://i.imgur.com/tfeft.png

http://i.imgur.com/tfeft.png

#3


5  

If you need to be able to draw or do effects on your images maybe you will still need canvas or ImageMagick but in terms of speed and memory usage there are a few better options.

如果您需要能够绘制或对您的图像产生影响,也许您仍然需要canvas或ImageMagick,但在速度和内存使用方面,有一些更好的选择。

Here is a benchmark of a few different image libraries.

这里是几个不同映像库的基准。

http://www.vips.ecs.soton.ac.uk/index.php?title=Speed_and_Memory_Use

http://www.vips.ecs.soton.ac.uk/index.php?title=Speed_and_Memory_Use

ImageMagick is slow and consumes lots of memory. Try Vips https://github.com/dosx/node-vips

ImageMagick很慢,会消耗很多内存。试着贵宾https://github.com/dosx/node-vips

#4


4  

I've used node-canvas from the LearnBoost folks - https://github.com/learnboost/node-canvas or npm install canvas - they are very responsive to issues and the library is well written and stable. I don't think you can create an image from memory yet but if node-imagemagick doesn't work out for you then it would be worth a try.

我使用了LearnBoost的node-canvas——https://github.com/learnboost/node-canvas或npm install canvas——它们对问题非常敏感,库编写得很好,也很稳定。我认为您还不能从内存中创建图像,但是如果node-imagemagick对您不起作用,那么它是值得一试的。

If you're familiar with the browser-side canvas API it should be straight forward to create an image from a file and draw it into a smaller canvas. There's an example of that here:

如果您熟悉浏览器端画布API,那么应该直接从文件中创建图像并将其绘制到更小的画布中。这里有一个例子

https://github.com/LearnBoost/node-canvas/blob/master/examples/resize.js

https://github.com/LearnBoost/node-canvas/blob/master/examples/resize.js

If you're familiar with C++ it's fairly easy to add methods to the native objects, the project built cleanly for me on Mac OS first time. The documentation for cairo, the graphics library that powers node-canvas, is quite clear too. I'd take a look at the load functions of the Image object to see if there's a way to load from a Node Buffer:

如果您熟悉c++,那么向本机对象添加方法是相当容易的,该项目首次在Mac OS上为我干净地构建。为cairo提供的文档(支持node-canvas的图形库)也非常清晰。我将查看图像对象的load函数,看看是否有从节点缓冲区加载的方法:

https://github.com/LearnBoost/node-canvas/blob/master/src/Image.h

https://github.com/LearnBoost/node-canvas/blob/master/src/Image.h

https://github.com/LearnBoost/node-canvas/blob/master/src/Image.cc

https://github.com/LearnBoost/node-canvas/blob/master/src/Image.cc

Good luck!

好运!

#1


26  

Think I found a decent imagemagick wrapper that can handle this pretty well. Even in memory before writing the file to disk. (aka user upload -> node imagemagick lib -> cdn and never touching the disk ... which is what I want)

我想我找到了一个不错的imagemagick包装器,它可以很好地处理这个问题。甚至在将文件写到磁盘之前也要在内存中。(也就是用户上传->节点imagemagick lib -> cdn,永远不接触磁盘……)这就是我想要的)

https://github.com/rsms/node-imagemagick

https://github.com/rsms/node-imagemagick

#2


19  

For anyone who is trying to do decide between Canvas and ImageMagick, I just tried both for comparison, and I'm getting much better results from imagemagick. Here's an image that was resized and cropped from 1024x768 to 128x128:

对于任何想在Canvas和ImageMagick之间做选择的人来说,我只是尝试了两者的比较,并且我从ImageMagick中得到了更好的结果。这里有一张图片,从1024x768调整到128x128:

http://i.imgur.com/tfeft.png

http://i.imgur.com/tfeft.png

#3


5  

If you need to be able to draw or do effects on your images maybe you will still need canvas or ImageMagick but in terms of speed and memory usage there are a few better options.

如果您需要能够绘制或对您的图像产生影响,也许您仍然需要canvas或ImageMagick,但在速度和内存使用方面,有一些更好的选择。

Here is a benchmark of a few different image libraries.

这里是几个不同映像库的基准。

http://www.vips.ecs.soton.ac.uk/index.php?title=Speed_and_Memory_Use

http://www.vips.ecs.soton.ac.uk/index.php?title=Speed_and_Memory_Use

ImageMagick is slow and consumes lots of memory. Try Vips https://github.com/dosx/node-vips

ImageMagick很慢,会消耗很多内存。试着贵宾https://github.com/dosx/node-vips

#4


4  

I've used node-canvas from the LearnBoost folks - https://github.com/learnboost/node-canvas or npm install canvas - they are very responsive to issues and the library is well written and stable. I don't think you can create an image from memory yet but if node-imagemagick doesn't work out for you then it would be worth a try.

我使用了LearnBoost的node-canvas——https://github.com/learnboost/node-canvas或npm install canvas——它们对问题非常敏感,库编写得很好,也很稳定。我认为您还不能从内存中创建图像,但是如果node-imagemagick对您不起作用,那么它是值得一试的。

If you're familiar with the browser-side canvas API it should be straight forward to create an image from a file and draw it into a smaller canvas. There's an example of that here:

如果您熟悉浏览器端画布API,那么应该直接从文件中创建图像并将其绘制到更小的画布中。这里有一个例子

https://github.com/LearnBoost/node-canvas/blob/master/examples/resize.js

https://github.com/LearnBoost/node-canvas/blob/master/examples/resize.js

If you're familiar with C++ it's fairly easy to add methods to the native objects, the project built cleanly for me on Mac OS first time. The documentation for cairo, the graphics library that powers node-canvas, is quite clear too. I'd take a look at the load functions of the Image object to see if there's a way to load from a Node Buffer:

如果您熟悉c++,那么向本机对象添加方法是相当容易的,该项目首次在Mac OS上为我干净地构建。为cairo提供的文档(支持node-canvas的图形库)也非常清晰。我将查看图像对象的load函数,看看是否有从节点缓冲区加载的方法:

https://github.com/LearnBoost/node-canvas/blob/master/src/Image.h

https://github.com/LearnBoost/node-canvas/blob/master/src/Image.h

https://github.com/LearnBoost/node-canvas/blob/master/src/Image.cc

https://github.com/LearnBoost/node-canvas/blob/master/src/Image.cc

Good luck!

好运!