我正在研究結構 js 並想獲取當前活動對象的 id

Question

我正在研究結構 js，我想獲取當前選定（活動）對象的 id。我已經定義了該對象的 id，但是在修改對象時我想檢索該 id，但它給出了未定義的。

我試過這個代碼

       <script>
       var rect1 = new fabric.Rect({
                                            left: 100,
                                            top: 130,
                                            width: 622,
                                            height: 340,
                                            fill: 'white',
                                            stroke: '#ccc',
                                            //   sendToBack: true,
                                            lockRotation: true,
                                            bringToFront: true
                                        });

                                        // canvas.add(rect1);
                                        // create a rectangle object
                                        var t = new fabric.IText("622", {
                                            top: 140,
                                            left: 120,
                                            width: 50,
                                            height: 50,
                                            backgroundColor: '#FFFFFF',
                                            fill: '#000000',
                                            fontSize: 14,
                                            Scaling: false,
                                            hasRotatingPoint: false,
                                            transparentCorners: false,
                                            selectable: false,
                                            cornerSize: 7
                                        });

                                        var h = new fabric.IText("340", {
                                            top: 250,
                                            left: 110,
                                            width: 50,
                                            height: 50,
                                            backgroundColor: '#FFFFFF',
                                            fill: '#000000',
                                            fontSize: 14,
                                            Scaling: false,
                                            hasRotatingPoint: false,
                                            transparentCorners: false,
                                            selectable: true,
                                            selectionColor: 'blue',
                                            angle: 270,
                                            cornerSize: 7
                                        });

                                        var id = 'g1'
                                        var group1 = new      fabric.Group([rect1, t, h], {
                                           id: 'g1',
                                          name: 'g_one'
                                        });
                                        //console.log(group1);

                                        canvas.add(group1);


    canvas.on('object:modified', function (e) {
                                       var activeobject = e.target;


                               alert(activeobject.get('id'));

                                save_updated_obj();
                            });
   function save_updated_obj() {
                                var dat = JSON.stringify(canvas.toJSON());
                                //var d_id = groupobs.id; here i want to get id
                                $.ajax({
                                    type: "POST",
                                    url: "json_append.php",
                                    data:  "value2=" + dat + "&id=" + 4,
                                    //contentType: "application/json; charset=utf-8",
                                    //  dataType: "json",       
                                    success: function (v) {
                                        alert("OK");
                                          // alert(v);
                                           $('#json_data').val(v);
                                    },
                                });
                            }
</script>

Answer 1

您正在將屬性myid添加到未定義的組。 像這樣設置屬性：

var group1 = new fabric.Group([rect1, t, h], {
  id: 'g1',
  name: 'g_one'
});

在這里看到小提琴

Answer 2

您必須像這樣在定義數組中設置 id：

var rect1 = new fabric.Rect({
  id: 1,
  left: 100,
  top: 130,
  width: 622,
  height: 340,
  fill: 'white',
  stroke: '#ccc',
  //   sendToBack: true,
  lockRotation: true,
  bringToFront: true
});

並使用以下方法獲取修改后的對象 ID：

fabric_canvas.on("object:modified", function() {
  var ao = fabric_canvas.getActiveObject();
  console.log('id:' + ao.id);
  console.log('top:' + ao.top); //get other property like this
  console.log('left:' + ao.left);
  console.log('scaleX:' + ao.scaleX);
  console.log('scaleY:' + ao.scaleY);
  console.log('rotateAngle:' + ao.angle);
})