canvas库fabric.js如何设置背景自适应

初学额 2018-06-01 04:03:10
fabric.js 设置背景的方法,这样确实可以设置 canvas 背景图
var canvas = new fabric.Canvas('canvasx');
canvas.setBackgroundImage('../img/zxzx.jpg', canvas.renderAll.bind(canvas));

但是碰上下列问题:
1.
如果图像太大的话,那么背景只会显示一部分图像,如下图


2.
如果图像太小,背景又不会铺满



请问各位请问各位大神,如何用 fabric.js 设置背景图的 高和宽呢? 使之自动适应canvas的大小
...全文
2626 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
梦_一 2019-05-10
  • 打赏
  • 举报
回复
canvas.setBackgroundImage("./img/1.png",function (oimg) { // 适应屏幕 相当于bg-size: 100% 100%; canvas.backgroundImage.set({ scaleX: canvas.width/oimg.width, scaleY: canvas.height/oimg.height }); },{ // 其他配置 opacity: 0.6 });
梦_一 2019-05-10
  • 打赏
  • 举报
回复
fabric.Image.fromURL('./img/1.png', function (oimg) { canvas.setBackgroundImage(oimg,null,{ scaleX: canvas.width/oimg._element.width, scaleY: canvas.height/oimg._element.height }); });
SupperSummer 2019-03-21
  • 打赏
  • 举报
回复
这样写,不行啊
qq_43058162 2018-09-18
  • 打赏
  • 举报
回复
你这个试过了,不行啊
Hello World, 2018-06-05
  • 打赏
  • 举报
回复

87,883

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧