使用fabric.js,在单击按钮时增加画布文本的fontSize [英] using fabric.js ,increase fontSize of canvas text on button click

查看:26
本文介绍了使用fabric.js,在单击按钮时增加画布文本的fontSize的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用fabric.js在canvas上工作.我已经在画布上创建了文本.现在,单击按钮时我想增加字体大小.

i am using fabric.js to work on canvas . i have created text on canvas .now,onclick of button i want to increase font-size .

canvas.set({fontSize,40});

这行不通吗?任何其他方法.i已经创建了提琴,请检查

this is not working ? any other method .i have created fiddle please Check

   var canvas = window._canvas = new fabric.Canvas('c');
var text = new fabric.Text('Sample', {
    left: 100,
    top: 100,
    fill: 'navy'
});

canvas.add(text);

document.getElementById('textinput').addEventListener('change', function (e) {
    var obj = canvas.getActiveObject();

    if (!obj) return;

    obj.setText(e.target.value);
    canvas.renderAll();
});

document.getElementById('btn').addEventListener('click', function (e) {
    var obj = canvas.getActiveObject();

   alert('button clicked');
     if (!obj) return;

    obj.set(fontSize,40);
    canvas.renderAll();
});

推荐答案

这是一个有效的代码,

var canvas = window._canvas = new fabric.Canvas('c');
var text = new fabric.Text('Sample', {
  left: 100,
  top: 100,
  fontSize: 80,
  fill: 'navy'
});

canvas.add(text);
document
  .getElementById('btn')
  .addEventListener('click', function (e) {
    canvas.getActiveObject().set("fontSize", "30");
    canvas.renderAll();   
  });

这篇关于使用fabric.js,在单击按钮时增加画布文本的fontSize的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆