Recent projects need to deal with the cover of the book, that is, add a shadow line to form a spine of the concave-convex feeling, and then cut the spine, divided into two parts, so that the client implementation to open the animation. Because it needs to be processed on the server side, the use of ImageMagick is studied. Also prepare to encapsulate a node.js and Python method, mainly to talk about and then use ImageMagick to zoom in on the picture, and then crop it.
First the material file is as follows (left unhandled cover, right is the shadow that needs to be synthesized up):
Installation of the ImageMagick process will not speak, you can refer to the official Website installation method: http://www.imagemagick.org/script/install-source.php
First of all, the cover picture file.png Zoom to a height of 1024, generate newfile.png convenient and shadow picture synthesis, commands are as follows:
Copy Code code as follows:
Convert-resize x1024 file.png Newfile.png
Convert is scaled in the following ways:
Convert-resize 1024 file.jpg newfile.jpg
To get the picture width of 1024, high according to the original picture proportional calculation
Convert-resize x768 file.jpg newfile.jpg
Get the picture high 768, wide according to the original picture proportional calculation
Convert-resize 1024x768! File.jpg newfile.jpg
Fixed wide and high scaling, regardless of the original is the ratio of the width of the graph, the picture zoom to the specified size.
Convert-resize "1024x768>" File.jpg newfile.jpg
Only if the src.jpg is larger than 1024 or higher than 768, the reduction is done, otherwise the newfile.jpg and file.jpg have the same size.
Convert-resize "1024x768<" File.jpg newfile.jpg
Only if the width of the src.jpg is less than 1024 or higher than 768, the magnification is done, otherwise the newfile.jpg and file.jpg have the same size.
The next step is to synthesize the shadow file onto the cover (the Yy.png from the top left corner to the File.png build newfile.png):
Copy Code code as follows:
composite-gravity Northwest Yy.png file.png newfile.png
Here are the main explanations for the-gravity parameters:
-gravity Northwest pointing to the upper right corner
If the request is in the middle, the argument is center
If required in the lower-right corner, the parameter is southeast
Others follow the directions
After the synthesis effect is as follows:
Finally, the picture is cropped, the picture is divided into two parts, shaded parts left.png and other parts Right.png:
Copy Code code as follows:
Left:convert file.png-gravity Southwest-crop 31x1024+0+0 left.png
Right:convert file.png-gravity Southeast-crop 737x1024+0+0 right.png
The cropping method is adjusted as follows:
Convert File.png-crop widthxheight+x+y newfile
Where Widthxheight is the size of the target picture, +x+y is the coordinate point of the original picture, the two sets of values to appear at least one group, can also exist. Alternatively, the command can use gravity to redefine the coordinate system.
The final results are as follows:
