fabric.js 怎么禁止元素旋转和缩放，以及隐藏选中元素时出现的9个点

需求描述

在系统后台，我用fabricjs在开发一个工牌图片的模板，可以允许调整元素位置（这里元素指的就是文本、矩形框这些），但我不需要调整其倾斜度及大小，所以需要禁止管理员缩放及旋转元素

禁止缩放

好像没有相关的属性可以直接控制元素缩放，本人是在缩放事件里添加的判断：

当缩放比例有变化时，将其比例值重置为1

代码如下：

canvas.on("object:scaling", function(){
    let object = canvas.getActiveObject();
    if('text' == object.type){
        //禁止文本缩放
        object.scaleX = 1;
        object.scaleY = 1;
        // 重新渲染画布
        canvas.renderAll(); 
    }
});

禁止旋转

有相关的属性可以直接控制元素旋转：lockRotation

做了上面禁止缩放和禁止旋转的操作，功能上是有生效的，但是当选中元素时，还是会出现那9个点，那些点本来就是用来进行元素缩放和旋转的。

为了让用户感觉功能更加良好，把这9个正方形小方框隐藏就更好了。

隐藏9个控制点

也是有相关的属性可以直接控制：hasControls

如果只是想针对某一类型的元素做更改，可以遍历所有元素，在一一加入画布之前做好判断，统一固定的属性，就可以直接代码里写死，例如如下所示：

var templateData = getTemplateDetail(subjectId);
$.each(templateData, function(index, element){
    //禁止旋转
    element['lockRotation'] = true;
    if('rect' == element.type){
        var eleObj = new fabric.Rect(element);
    }else if('text' == element.type){
        element['hasControls'] = false;
        var eleObj = new fabric.IText(element.content, element);
    }else if('circle' == element.type){

    }
    canvas.add(eleObj);
});