Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to identify the type of a selected object?

I am placing Text, Image and Shapes on canvas using Fabric.js. I have made Three different Edit-Panels for all three. When user select text I want to show text panel. like wise for image and shapes.

How to identify type of selected Object?

like image 290
anam Avatar asked Sep 19 '13 11:09

anam


2 Answers

canvas.getActiveObject().get('type') as simmi simmi said is correct. You can also listen to events:

function onObjectSelected(e) {
  console.log(e.target.get('type'));
}
canvas.on('object:selected', onObjectSelected);
like image 116
Kienz Avatar answered Nov 06 '22 17:11

Kienz


I solved this issue using following code::

  if(canvas.getActiveObject().get('type')==="text")
        {
            //Display text panel
            console.log('text panel Displayed');
            $("#Image_left_panel").css("display", "none");
            $("#shape_left_panel").css("display", "none");
            //$("#left_panel").css("display", "block");
        }
        else if(canvas.getActiveObject().get('type')==="Image")
        {
            //Display Image Panel
            console.log('Image Panel Displayed');
            $("#Image_left_panel").css("display", "block");
            $("#shape_left_panel").css("display", "none");
            $("#left_panel").css("display", "none");
        }
        else
        {

        }


        });
like image 11
anam Avatar answered Nov 06 '22 18:11

anam