海报demo-canva绘制海报01：canvas绘制图片并解决导出后略模糊问题
2023-04-14 13:48:40
你可以试下“创客贴”,是个网页版的在线图片设计工具,可以制作海报,百度搜一下就知道,上面有很多模版,只要简单的改改图改改字就可以做出好看的图片。
海报设计工具有哪些？一般公司有平面设计和视觉设计或者UI设计师,但是有一些公司运营也会涉及到作图。除ps外,这里推荐几个:创客贴、图怪兽、Conva等,都很好用,但是其实设计海报还是要了解用户痛点和产品特点,要优化自己的文案和元素。海报无论在微信公众号和活动策划中都会用到,如果你是运营小白,给自己赋能,也可以搜索传智播客新媒体+短视频直播运营学科,工具是为人所用,但是工具思维不是人人都有,祝你好运。
canva绘制海报01：canvas绘制图片并解决导出后略模糊问题另外,
img标签和js中的image都建议增加crossorigin="anonymous"属性
**注意:**有部分网友评论('crossOrigin','anonymous')必须是写在你赋值之前,所以楼主写法有误可以看看这个链接去看看,#27260385
效果图如下:
模糊在线demo
解决方案:
1.首先一样,获取Canvas对象:
2.获取像素比,将Canvas宽高进行放大,放大比例为:devicePixelRatio/webkitBackingStorePixelRatio,我们写了一个兼容的方法。
3.按实际渲染倍率来缩放canvas。
注意基础知识点:
要设置canvas的画布大小,使用的是和;
要设置画布的实际渲染大小,使用的style属性或CSS设置的width和height,只是简单的对画布进行缩放。
4.绘制
效果图如下
优化后不模糊的在线demo
参考链接:
一个关于image访问图片跨域的问题,
解决canvas将图片转为base64报错:UncaughtDOMException:Failedtoexecute'toDataURL'on'HTMLCanvasElement':Taintedcanvasesmaynotbeexported,
解决canvas在高清屏中绘制模糊的问题,
热门标签
