fabric.jsを利用したcanvas上オブジェクトの回転

javascriptを独学で学んでおります。
fabric.jsのバージョン2.4.4でcanvas上に配置したオブジェクトを、input type="range"からの入力値に合わせてオブジェクトの中心で回転させたいです。
オブジェクトの左上を中心に回転させることはできますが、中心で回転ができません。
以前のバージョンではできたのですが、最新版ではできませんでした。

該当のソースコード

HTML
1<!DOCTYPE HTML>
2<html lang="ja">
3<body>
4<div>
5	<div>
6        <canvas id="view_canvas" onContextMenu="return false;"></canvas>
7        <div class="slidebar">
8            <h4>回転</h4>
9            <input type="range" id="angle-control" min="-180" max="180" value="0"/>
10        </div>
11	</div>
12</div>
13</body>
14</html>

javascript
1var canvas,
2    context;
3
4canvas = new fabric.Canvas('view_canvas',{
5    width: 200,
6    height: 200,
7    preserveObjectStacking: true
8});
9context = canvas.getContext('2d');
10
11var c_write_object = new fabric.Text("txt", {fontSize: 40,});
12canvas.add(c_write_object);
13canvas.requestRenderAll();
14
15var angleControl = document.getElementById('angle-control');
16angleControl.addEventListener("input", function(){
17        canvas.getActiveObject().set('angle', parseInt(this.value, 10)).setCoords();
18        canvas.requestRenderAll();
19});

x_x

2019/01/23 07:34

マルチポスト https://ja.stackoverflow.com/questions/52026/fabric-js%E3%82%92%E5%88%A9%E7%94%A8%E3%81%97%E3%81%9Fcanvas%E4%B8%8A%E3%82%AA%E3%83%96%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%81%AE%E5%9B%9E%E8%BB%A2

行動規範の内容に同意します

回答1件

ベストアンサー

こうではないですか？
少なくとも2.4.4では提示コードはエラーで動きませんでした。

JavaScript
1        //canvas.getActiveObject().set('angle', parseInt(this.value, 10)).setCoords();
2        c_write_object._setOriginToCenter();
3        c_write_object.set({ angle: parseInt(this.value, 10) }).setCoords();