使用Fabric.js，增加Canvas文本的FontSize按钮单击答案

【问题标题】：using fabric.js ,increase fontSize of canvas text on button click使用Fabric.js，增加Canvas文本的FontSize按钮单击
【发布时间】：2013-08-31 00:55:57
【问题描述】：

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

canvas.set({fontSize,40});

这不起作用？任何其他方法。我已经创建了小提琴请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();
});

【问题讨论】：

将其更改为字体大小
obj.set(fontSize,40) 没有被执行，程序在此之前停止

标签： javascript jquery html css fabricjs

【解决方案1】：

这是一个工作代码，

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();   
  });

【讨论】：

【解决方案2】：

首先，我能够通过改变来完成这项工作

obj.set('fontSize',40);

到

obj.setFontSize(40);

其次，我认为调整对象大小时改变的不是对象的字体大小，而是它的scaleX 和scaleY。希望这会有所帮助。

【讨论】：

我使用的是 Fabric 4.3.0，第二个选项对我不起作用。