ฉันอยากจะลองใช้เทคนิคCSS Spriteเพื่อโหลดภาพขนาดย่อสองสามภาพเป็นภาพเดียว ดังนั้นฉันต้อง "รวม" ภาพขนาดย่อสองสามภาพในไฟล์เดียวแบบออฟไลน์ในเซิร์ฟเวอร์
สมมติว่าฉันมีภาพขนาดย่อ 10 ภาพที่มีขนาดเท่ากัน คุณจะแนะนำให้ฉัน "รวม" จากบรรทัดคำสั่ง Linux ได้อย่างไร
ฉันอยากจะลองใช้เทคนิคCSS Spriteเพื่อโหลดภาพขนาดย่อสองสามภาพเป็นภาพเดียว ดังนั้นฉันต้อง "รวม" ภาพขนาดย่อสองสามภาพในไฟล์เดียวแบบออฟไลน์ในเซิร์ฟเวอร์
สมมติว่าฉันมีภาพขนาดย่อ 10 ภาพที่มีขนาดเท่ากัน คุณจะแนะนำให้ฉัน "รวม" จากบรรทัดคำสั่ง Linux ได้อย่างไร
คำตอบ:
คุณยังสามารถลองใช้ImageMagicซึ่งเหมาะสำหรับการสร้าง CSS Sprites บางกวดวิชาเกี่ยวกับเรื่องนี้ที่นี่
ตัวอย่าง (สไปรต์แนวตั้ง):
convert image1.png image2.png image3.png -append result/result-sprite.png
ตัวอย่าง (สไปรต์แนวนอน):
convert image1.png image2.png image3.png +append result/result-sprite.png
convert -append *.png out.png
คุณยังสามารถใช้GraphicsMagickซึ่งเป็นทางแยกที่เบาและเร็วกว่าของ ImageMagick:
gm convert image1.png image2.png -append combined.png
การเปรียบเทียบเวลาง่ายๆของการรวมภาพ 12 ภาพ:
time convert image{1..12}.jpg -append test.jpg
real 0m3.178s
user 0m3.850s
sys 0m0.376s
time gm convert image{1..12}.jpg -append test.jpg
real 0m1.912s
user 0m2.198s
sys 0m0.766s
GraphicsMagick เร็วกว่า ImageMagick เกือบสองเท่า
ใช้pnmcatnetpbm-package
คุณอาจต้องแปลงไฟล์อินพุตของคุณไปมาเพื่อใช้งาน:
pnmcat -lr <(pngtopnm 1.png) <(pngtopnm 2.png) | pnmtopng > all.png
หากคุณต้องการรวมรูปภาพจากซ้ายไปขวาให้ใช้คำสั่งต่อไปนี้:
convert image{1..0}.png +append result/result-sprite.png
หมายเหตุ+appendแทน-append.
+append-append