Javascript 织物对象的不透明度滑块

Javascript 织物对象的不透明度滑块,javascript,canvas,opacity,fabricjs,Javascript,Canvas,Opacity,Fabricjs,我有一个画布,它包括织物对象。我想在画布中为文本区域的背景“textbackroundColor”执行不透明度滑块。我如何执行幻灯片和更改功能 $("#backgroundOpacity").slider( { min: 10, max: 50, value: 30, slide: text_bgColor_slider_moved, change: text_bgColor_slider_changed }); 首先获取画布的活动对象

我有一个画布,它包括织物对象。我想在画布中为文本区域的背景“textbackroundColor”执行不透明度滑块。我如何执行幻灯片和更改功能

$("#backgroundOpacity").slider( {
     min: 10,
     max: 50,
     value: 30,
     slide: text_bgColor_slider_moved,
     change: text_bgColor_slider_changed

  });

首先获取画布的活动对象

var activeObject = canvas.getActiveObject();
然后

$("#backgroundOpacity").slider( {
       max : 100,
       value : activeObject.opacity * 100,
       slide: function (event, ui) {
           activeObject.setOpacity(ui.value / 100);
           canvas.renderAll();
       },
       stop : function (event, ui) {
           canvas.renderAll();
       }
});

另一种方式,通过范围输入和$(document).on


如何创建活动对象?当我这样写“var-activeObject=canvas.getActiveObject();”时,我遇到了一个错误“notdefined”,单击任何对象文本图片或其他,如果显示边框,则对象处于活动状态
$(document).on("change", "#alpha", function () {
transval = $(this).val();
var obj = canvas.getActiveObject();
obj.set({
opacity: transval
});
canvas.renderAll();
});