锁定fabric.js对象答案

【问题标题】：lockScaling for Fabric.js objects锁定fabric.js对象
【发布时间】：2013-12-03 02:25:54
【问题描述】：

我不确定我是否对 API 有误解，或者这是否是一个真正的错误，所以我在打开问题之前先在这里询问。

我在 Canvas 上绘制了一些对象，我不想对它们进行任何操作（移动、旋转、缩放），除了选择本身。事实上，当我选择一个对象时，我无法对它做任何事情。但是，当我选择一组对象时，我无法移动或旋转它们，但拖动选择的角确实实际上会缩放对象。

我在 Windows 7 上使用 Fabric.js 1.3.0。在 Chrome、Firefox 和 IE10 上进行了尝试，三者的行为相同。

这是我的 HTML：

<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Home Page - My ASP.NET Application</title>
    <link href="/Content/bootstrap.css" rel="stylesheet"/>
</head>
<body>
    <canvas id="c"></canvas>
    <script src="/Scripts/jquery-2.0.3.js"></script>
    <script src="/Scripts/fabricjs-1.3.0/all.js"></script>
    <script type="text/javascript">
        $(function () {
            var canvas = new fabric.Canvas("c");

            canvas.setWidth(150);
            canvas.setHeight(150);

            for (var i = 0; i < 5; ++i) {
                for (var j = 0; j < 5; ++j) {
                    canvas.add(new fabric.Rect({
                        top: 20+i * 20, left: 20+j * 20, width: 10, height: 10, fill: 'blue',
                        selectable: true,
                        lockMovementX: true, lockMovementY: true,
                        hasControls: false,
                        lockScaling: true, lockRotation: true
                    }));
                }
            }
        });
    </script>
</body>
</html>

更新：我找到了一个建议，如果Fabric's google group 注册规模事件：

canvas.onBeforeScaleRotate = function lock(object) { 
    object.lockScaling = true; 
}

但这没有帮助。此外，即使它确实有帮助，这也是非常不直观的。 lockMovement 和 lockScaling 有什么区别？ lockMovement 配置有效，而 lockScaling 配置无效...

【问题讨论】：

标签： fabricjs

【解决方案1】：

没有lockScaling 属性。你必须使用lockScalingX 和lockScalingY

见http://fabricjs.com/docs/fabric.Object.html#lockScalingX

【讨论】：

非常感谢！现在我有点愚蠢。尽管在我的辩护中，本教程没有提到两个不同属性的存在：“画布上的每个对象都可以通过几种方式锁定。“lockMovementX”、“lockMovementY”、“lockRotation”、“lockScaling”是锁定相应对象的属性动作。因此将 object.lockMovementX 设置为 true 可以防止对象水平移动。不过，您仍然可以在垂直平面上移动它。同样，lockRotation 可以防止旋转和 lockScaling — 缩放。也许你可以更新教程...
感谢您的提示。你的权利，我们必须更新教程。