gm

What is gm?

The gm (GraphicsMagick) npm package is a Node.js wrapper for the GraphicsMagick and ImageMagick image processing libraries. It allows you to perform a wide range of image manipulation tasks such as resizing, cropping, rotating, and adding text to images.

What are gm's main functionalities?

Image Resizing

This feature allows you to resize an image to the specified dimensions. In this example, the image is resized to 240x240 pixels.

const gm = require('gm');
gm('/path/to/image.jpg')
  .resize(240, 240)
  .write('/path/to/resized_image.jpg', function (err) {
    if (!err) console.log('Image resized successfully');
  });

Image Cropping

This feature allows you to crop an image to the specified width and height, starting from the specified x and y coordinates. In this example, a 100x100 pixel area is cropped from the image starting at coordinates (50, 50).

const gm = require('gm');
gm('/path/to/image.jpg')
  .crop(100, 100, 50, 50)
  .write('/path/to/cropped_image.jpg', function (err) {
    if (!err) console.log('Image cropped successfully');
  });

Image Rotation

This feature allows you to rotate an image by a specified angle. In this example, the image is rotated by 45 degrees with a green background fill.

const gm = require('gm');
gm('/path/to/image.jpg')
  .rotate('green', 45)
  .write('/path/to/rotated_image.jpg', function (err) {
    if (!err) console.log('Image rotated successfully');
  });

Adding Text to Image

This feature allows you to add text to an image. In this example, the text 'Hello World' is added to the image at coordinates (30, 50) with a font size of 68.

const gm = require('gm');
gm('/path/to/image.jpg')
  .fontSize(68)
  .drawText(30, 50, 'Hello World')
  .write('/path/to/text_image.jpg', function (err) {
    if (!err) console.log('Text added to image successfully');
  });

Other packages similar to gm

sharp

Sharp is a high-performance image processing library for Node.js, which is based on the libvips library. It is known for its speed and low memory usage compared to gm. Sharp supports a wide range of image formats and provides functionalities such as resizing, cropping, rotating, and more.

jimp

Jimp is a pure JavaScript image processing library for Node.js with no external dependencies. It is easy to use and provides a wide range of image manipulation functionalities such as resizing, cropping, rotating, and adding text. Jimp is suitable for smaller projects or environments where installing external binaries is not feasible.

lwip

LWIP (Lightweight Image Processor) is a lightweight image processing library for Node.js. It provides functionalities such as resizing, cropping, rotating, and color manipulation. LWIP is designed to be fast and efficient, but it has fewer features compared to gm and sharp.

README

gm

GraphicsMagick for node

Basic Usage

var fs = require('fs')
  , gm = require('./gm');

// resize and remove EXIF profile data
gm('/path/to/my/img.jpg')
.resize(240, 240)
.noProfile()
.write('/path/to/resize.png', function (err) {
  if (!err) console.log('done');
});

// obtain the size of an image
gm('/path/to/my/img.jpg')
.size(function (err, size) {
  if (!err)
    console.log(size.width > size.height ? 'wider' : 'taller than you');
});

// output all available image properties
gm('/path/to/img.png')
.identify(function (err, data) {
  if (!err) console.log(data)
});

// pull out the first frame of an animated gif and save as png
gm('/path/to/animated.gif[0]')
.write('/path/to/firstframe.png', function (err) {
  if (err) console.log('aaw, shucks');
});

// auto-orient an image
gm('/path/to/img.jpg')
.autoOrient()
.write('/path/to/oriented.jpg', function (err) {
  if (err) ...
})

// crazytown
gm('/path/to/my/img.jpg')
.flip()
.magnify()
.rotate('green', 45)
.blur(7, 3)
.crop(300, 300, 150, 130)
.edge(3)
.write('/path/to/crazy.jpg', function (err) {
  if (!err) console.log('crazytown has arrived');
})

// annotate an image
gm('/path/to/my/img.jpg')
.stroke("#ffffff")
.drawCircle(10, 10, 20, 10)
.font("Helvetica.ttf", 12)
.drawText(30, 20, "GMagick!")
.write("/path/to/drawing.png", function (err) {
  if (!err) console.log('done');
});

// creating an image
gm(200, 400, "#ddff99f3")
.drawText(10, 50, "from scratch")
.write("/path/to/brandNewImg.jpg", function (err) {
  // ...
});

Buffers

// A buffer can be passed instead of a filepath as well
var buf = require('fs').readFileSync('/path/to/image.jpg');

gm(buf, 'image.jpg')
.noise('laplacian')
.write('/path/to/out.jpg', function (err) {
  if (err) return handle(err);
  console.log('Created an image from a Buffer!');
});

Streams

// passing a stream
var readStream = fs.createReadStream('/path/to/my/img.jpg');
gm(readStream, 'img.jpg')
.write('/path/to/reformat.png', function (err) {
  if (!err) console.log('done');
});

// can also stream output to a ReadableStream
// (can be piped to a local file or remote server)
gm('/path/to/my/img.jpg')
.resize('200', '200')
.stream(function (err, stdout, stderr) {
  var writeStream = fs.createWriteStream('/path/to/my/resized.jpg');
  stdout.pipe(writeStream);
});

// pass a format or filename to stream() and
// gm will provide image data in that format
gm('/path/to/my/img.jpg')
.stream('png', function (err, stdout, stderr) {
  var writeStream = fs.createWriteStream('/path/to/my/reformated.png');
  stdout.pipe(writeStream);
});

// combine the two for true streaming image processing
var readStream = fs.createReadStream('/path/to/my/img.jpg');
gm(readStream, 'img.jpg')
.resize('200', '200')
.stream(function (err, stdout, stderr) {
  var writeStream = fs.createWriteStream('/path/to/my/resized.jpg');
  stdout.pipe(writeStream);
});

// GOTCHA:
// when working with input streams and any 'identify'
// operation (size, format, etc), you must pass "{bufferStream: true}" if
// you also need to convert (write() or stream()) the image afterwards
// NOTE: this temporarily buffers the image stream in Node memory
var readStream = fs.createReadStream('/path/to/my/img.jpg');
gm(readStream, 'img.jpg')
.size({bufferStream: true}, function(err, size) {
  this.resize(size.width / 2, size.height / 2)
  this.write('/path/to/resized.jpg', function (err) {
    if (!err) console.log('done');
  });
});

Getting started

First download and install GraphicsMagick

then either use npm:

npm install gm

or clone the repo:

git clone git://github.com/aheckmann/gm.git

Examples:

Check out the examples directory to play around. Also take a look at the extending gm page to see how to customize gm to your own needs.

Constructor:

There are a few ways you can use the gm image constructor.

• 1. gm(path) When you pass a string as the first argument it is interpreted as the path to an image you intend to manipulate.
• 1. gm(stream || buffer, [filename]) You may also pass a ReadableStream or Buffer as the first argument, with an optional file name for format inference.
• 1. gm(width, height, [color]) When you pass two integer arguments, gm will create a new image on the fly with the provided dimensions and an optional background color. And you can still chain just like you do with pre-existing images too. See here for an example.

Methods

• getters

  • size - returns the size (WxH) of the image
  • orientation - returns the EXIF orientation of the image
  • format - returns the image format (gif, jpeg, png, etc)
  • depth - returns the image color depth
  • color - returns the number of colors
  • res - returns the image resolution
  • filesize - returns image filesize
  • identify - returns all image data available

• manipulation

  • adjoin
  • affine
  • antialias
  • append
  • authenticate
  • autoOrient
  • average
  • backdrop
  • bitdepth
  • blackThreshold
  • bluePrimary
  • blur
  • border
  • borderColor
  • box
  • channel
  • charcoal
  • chop
  • clip
  • coalesce
  • colors
  • colorize
  • colorMap
  • colorspace
  • comment
  • compose
  • compress
  • contrast
  • convolve
  • createDirectories
  • crop
  • cycle
  • deconstruct
  • delay
  • define
  • density
  • despeckle
  • dither
  • displace
  • display
  • dispose
  • edge
  • emboss
  • encoding
  • enhance
  • endian
  • equalize
  • extent
  • file
  • filter
  • flatten
  • flip
  • flop
  • foreground
  • frame
  • fuzz
  • gamma
  • gaussian
  • geometry
  • gravity
  • greenPrimary
  • highlightColor
  • highlightStyle
  • iconGeometry
  • implode
  • intent
  • interlace
  • label
  • lat
  • level
  • list
  • limit
  • log
  • loop
  • lower
  • magnify
  • map
  • matte
  • matteColor
  • mask
  • maximumError
  • median
  • minify
  • mode
  • modulate
  • monitor
  • monochrome
  • morph
  • mosaic
  • motionBlur
  • name
  • negative
  • noise
  • noop
  • normalize
  • noProfile
  • opaque
  • operator
  • orderedDither
  • outputDirectory
  • paint
  • page
  • pause
  • pen
  • ping
  • pointSize
  • preview
  • process
  • profile
  • progress
  • quality
  • raise
  • rawSize
  • randomThreshold
  • recolor
  • redPrimary
  • region
  • remote
  • render
  • repage
  • resample
  • resize
  • roll
  • rotate
  • sample
  • samplingFactor
  • scale
  • scene
  • scenes
  • screen
  • segment
  • sepia
  • set
  • setFormat
  • shade
  • shadow
  • sharedMemory
  • sharpen
  • shave
  • shear
  • silent
  • solarize
  • snaps
  • stegano
  • stereo
  • strip imagemagick only
  • spread
  • swirl
  • textFont
  • texture
  • threshold
  • thumb
  • tile
  • transform
  • transparent
  • treeDepth
  • trim
  • type
  • update
  • units
  • unsharp
  • usePixmap
  • view
  • virtualPixel
  • visual
  • watermark
  • wave
  • whitePoint
  • whiteThreshold
  • window
  • windowGroup

• drawing primitives

  • draw
  • drawArc
  • drawBezier
  • drawCircle
  • drawEllipse
  • drawLine
  • drawPoint
  • drawPolygon
  • drawPolyline
  • drawRectangle
  • drawText
  • fill
  • font
  • fontSize
  • stroke
  • strokeWidth
  • setDraw

• image output

  • write - writes the processed image data to the specified filename
  • stream - provides a ReadableStream with the processed image data

##compare

Graphicsmagicks compare command is exposed through gm.compare(). This allows us to determine if two images can be considered "equal".

Currently gm.compare only accepts file paths.

gm.compare(path1, path2 [, tolerance], callback)

gm.compare('/path/to/image1.jpg', '/path/to/another.png', function (err, isEqual, equality, raw) {
  if (err) return handle(err);

  // if the images were considered equal, `isEqual` will be true, otherwise, false.
  console.log('The images were equal: %s', isEqual);

  // to see the total equality returned by graphicsmagick we can inspect the `equality` argument.
  console.log('Actual equality: %d', equality);

  // inspect the raw output
  console.log(raw)
})

You may wish to pass a custom tolerance threshold to increase or decrease the default level of 0.4.

gm.compare('/path/to/image1.jpg', '/path/to/another.png', 1.2, function (err, isEqual) {
  ...
})

Contributors

https://github.com/aheckmann/gm/contributors

Inspiration

http://github.com/quiiver/magickal-node

Plugins

https://github.com/aheckmann/gm/wiki

License

(The MIT License)

Copyright (c) 2010 Aaron Heckmann

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.