npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

webimg

v0.3.3

Published

Creating thumbnails, verification code, add a watermark.用于生成缩略图,添加水印,生成验证码

Readme

webimg

中文

This Project base on gm,you shoud install graphicsmagick,If you need to use captcha or text watermark, You should install Ghostscript.

This project is used to generate a thumbnail, add watermarks, generate captchas, batch thumbnail watermark.

INSTALL

npm install webimg

thumbnail example

Webimg('./test.jpg').resize(100,50).thumb('thumb.jpg'); 

Watermark example

Webimg('./test.jpg')
	.markText('test')//text
	.markPos(5)//mark position  123456789
	.fontSize(50)//fongsize
	//.font('foot.ttf')//fontfamily
	.fontColor('#ffffff')//font color
	.watermark('./mark.jpg');

Verification code sample

var captcha = webimg().captcha();
console.log(captcha.getStr()); //get the captcha str

The thumbnail and watermark

Webimg('./test.jpg').params({
	width:100,  
	text:'hahahasdsd', ////watermark text
	fontcolor:'#ffffff',
	fontsize:12
}).thumb();

API

Webimg contructor

thumbnail and watermark
@param string image name

OR
Captcha:
@param int width
@param int height
@param string background color

size

@param function callback
return image size

filesize

@param function 
image's size

outFile

@param string   Set the output file name

font

@param string font path

fontColor

@param string fontcolor (#ffffff)

fontSize

@param int fontsize 

width

@param int width

height

@param int height

**Notice**
Thumbnails generated if only specify the width or height is not specified in accordance with the proportion of automatic calculation,If at the same time high then will be in accordance with the specified contract specifies the width, the proportion is improper cutting automatically

resize

@param int width
@param int height

quality

@param int image quality 1-100

backgroundColor

@param string background color #000000

markImg

@param string watermark image path

markText

@param string Set text watermark

markPos

@param int Sets the position of the watermark
As Follow:
1,2,3
4,5,6
7,8,9

params

@param object    
This method is used for one-time setup parameters
params:
`width` width  @param int
`text` The watermark generated images at the same time If the test img is at the same time Then add images and text watermark random accident @param string
`fontcolor` fontcolor @param string #ffffff
`fontsize` fontsize @param int 
`img` file path @param string 
`pos` mark position @param int 1,2,3,4,5,6,7,8,9
`quality` quality @param int  1-100
`outFile` The output file address Thumbnails, watermark, a verification code
		The format of the output file address Can make the thumb. JPG thumb so the final path consistent with the original image,If it is /aa. JPG with /  Will direct medical specified address

thumb

@param string/null/function   
@param function  
Generated thumbnail in the end the method called
For the batch thumbnail generation can be specified only output file parameters,the callback function can accept a param for the thumb name;

watermark

@param string/null    
Watermark generated output after the address, does not specify, it will automatically generated automatically added after the original file name _t0(_t1,_t2)

captcha

@param string/function
Verification code output address, if you do not specify output address you will need to specify a callback function, the callback function returns the corresponding PNG image Buffer
function(err,buf){

}

captcha Verification code generated

getStr

Returns the generated captcha string

random

Provide authentication code with random string, this method can cover can customize the characters

gm

 Webimg.gm => gm