位置: 编程技术 - 正文

Node.js使用gm拼装sprite图片(nodejs拼接路径的方法)

编辑:rootadmin

推荐整理分享Node.js使用gm拼装sprite图片(nodejs拼接路径的方法),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:nodejs gm,nodejs gyp,nodejs拼接路径的方法,nodejs拼接路径的方法,nodejs package,node.js pkg,nodejs gm,nodejs gm,内容如对您有帮助,希望把文章链接给更多的朋友!

从设计图切图得到了个小图标,是按钮的两种状态,然后我就寻思着把他们拼成一张sprite图片.

之前用过gulp的sprite插件,但这次我不想搞的太隆重.拼图我知道有个很好用的命令行工具 GraphicsMagick 及配套的nodejs包gm

首先说下我要拼的图片,我打算将正常状态作为第1行,激活状态作为第2行.这样可以少计算一些background-position.

折腾过程比较痛苦,本来我打算看一下GraphicsMagick与gm的官方文档,结果好多生单词,最后还是放弃了.下面说答案吧:

总的来说有两种方法,

1.使用gm包的append+adjoin方法

这个方法有缺点,就是不能方便的排序成我想要的这种布局.用adjoin我实际上拼了3次图,才最终得到sprite.参考代码如下:

代码很初级.

2.使用GraphicsMagick自带的命令行工具

Node.js使用gm拼装sprite图片(nodejs拼接路径的方法)

是直接使用GraphicsMagick的命令行(安装后,即可在命令行里使用gm命令),但这里要注意:powershell中使用gm一直报错,需要用cmd并cd到对应目录.win自作聪明的用powershell默认代替cmd,结果连这种错误都没修复…

gm montage nav*_0.png nav*_1.png -tile 6x2 -geometry +0+0 rrr.png

可以看到我使用了 montage 方法,且分两次传入了图片(图片路径还支持glob表达式), 分两次传入图片路径可以保证先后顺序(因为我就是想拼两行啊).

简单讲一下montage,其中文表述即”蒙太奇”,高大上,但我们这里只用来拼图. 命令之后就是图片路径; 路径之后有个 `-tile` 参数, 用来指定图片的排列方式.6×2就是6列2行.这里有个技巧,如果你想让所有图片排成一行,可以这样 `-tile x1`,即不管列数,只限制为1行,反之, `-tile 1x`则表示只要1列不管有多少行.

-tile参数后是-geometry参数. 其默认值是'×>+4+3′,表示”每张小图的最大尺寸是×,大于此尺寸的会被缩放(小于的不会放大),图片之间的间隔是横向4纵向3″.

-geometry的参数是按需传的,比如我传的只是+0+0,表示不限制每张图的大小,图片间距为0.

最后一个参数,就是输出拼图结果到rrr.png了.

搞懂这些参数后, 下面的由本方法衍生出来的方法就好理解了.

3.使用gm包执行GraphicsMagick命令行

gm包本身十分强大,但它也提供了生成命令并执行的接口.如上面的命令行, 用gm包可以这么写:

与直接使用命令行是一样的效果.但这样写成js文件后,下次要用或要发给别人用都更方便了.

详解node如何让一个端口同时支持https与http 众所周知node是一个高性能的web服务器,使用它可以很简单的创建一个http或https的服务器。比如一个很简单的http服务器:varhttp=require('http');varhttps=require('

详解HTTPS 的原理和 NodeJS 的实现 基本原理HTTP协议采用明文传输数据,当涉及敏感信息的传送时,极有可能会受到窃听或者中间人的攻击。HTTPS是HTTP与SSL/TLS的组合,即使用加密通讯以及

nodejs模块学习之connect解析 nodejs发展很快,从npm上面的包托管数量就可以看出来。不过从另一方面来看,也是反映了nodejs的基础不稳固,需要开发者创造大量的轮子来解决现实的

标签: nodejs拼接路径的方法

本文链接地址:https://www.jiuchutong.com/biancheng/382133.html 转载请保留说明!

上一篇:mac上node.js环境的安装测试(mac安装nodejs的权限问题)

下一篇:详解node如何让一个端口同时支持https与http(node使用)

  • 增值税应纳税额的计算
  • 稿酬所得个人所得税税率表
  • 增值税发票管理办法
  • 股权转让产生的印花税
  • 个税申报逾期罚款怎么交
  • 兼职人员怎么申报工资
  • 给员工代缴社保工资是否违反劳动法
  • 电子记账软件出纳帐
  • 社团会费收取标准和管理办法
  • 结转周转材料成本差异会计分录
  • 汇算清缴前取得暂估发票
  • 使用人民币进行石油贸易结算
  • 成品油消费税征税
  • 营改增行业销售额的规定
  • 对于甲供工程,施工方销售额不包括建设方提供的材料款。那么该销售额是否包括设备及动力款?
  • 企业年报最容易掉进的九大“陷阱”
  • 以货抵债会计处理
  • 在天猫店铺后台中的提现怎么做会计分录?
  • 税收筹划有哪些特点?
  • 公司开13个点增值税交多少钱
  • m1 mac 恢复出厂
  • 公司补缴印花税的后果
  • 车辆理赔过程中,赔付款给谁
  • 处置子公司税务处理
  • 【修改huggingface transformers默认缓存文件夹】
  • 研发费用加计扣除是什么意思啊
  • 电脑锁屏密码设置步骤
  • 财务清算的作用
  • ubuntu设置nginx开机启动
  • 自行建造完成交付的房子
  • 进口付汇业务流程
  • 补缴企业所得税和滞纳金如何入账
  • 无形资产转让的会计处理
  • 增值税如何在报表里填写
  • cvpr2017最佳论文
  • webssh github
  • 污水处理厂能享受补助吗
  • 普通发票有抵扣联没
  • 搜索人工制造
  • 单位购买电水壶会计入账
  • phpcms v9官网
  • 科目汇总表一页不够写怎么办
  • 计入当期损益的
  • Windows7下Microsoft SQL Server 2008安装图解和注意事项
  • 企业所得税征收方式有哪些?
  • 中级会计职称与中级会计师的区别
  • 以固定资产投资取得长期股权投资
  • 顶账资产入账依据
  • 应收代位追偿款有没有明细科目
  • 上月未记账,本月同样可以记账
  • 住宿费开专票怎么做账
  • 代扣代缴预提所得税10%是什么意思
  • 待认证进项税额借贷方向
  • 记账凭证填制完毕
  • 无形资产及其他资产包括哪些科目
  • 代发工资业务流程
  • 弥补以前年度亏损怎么算
  • 农行网银只有一张卡吗
  • win8.1所有程序在哪里
  • linux中的vim命令的功能
  • mssecsvc是什么进程
  • webinstall.exe - webinstall是什么进程
  • winoldap.exe - winoldap进程是什么意思
  • xp系统的搜索
  • win10电脑去掉快捷箭头百度经验
  • macbook怎么开启
  • win8.1安装更新卡住
  • linux命令怎么用
  • win10创建系统还原点有什么用
  • linux系统安装程序
  • 浅谈jquery中ajax跨域提交的时候会有2次请求的问题
  • myeclipse创建
  • css网站布局实录 pdf
  • unity导出exe文件
  • 获取已安装应用列表的权限在哪里设置
  • unity3d如何发布ios教程
  • unity api compatibility level
  • 单位发的一次性奖励如何扣税
  • 工会经费填错了怎么办
  • 苏宁易购股份转增股本
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设