2014-01-18 3 views
1

Я добавляю объекты к холсту и отслеживаю их тип и количество отсчетов. Когда я добавляю их на холст, все работает отлично, но когда я их изменяю, я борюсь с тем, какой объект был изменен в моем полотне fabric.js, но только в том случае, если он является карточным. Я хочу получить его координаты - карточный и карточный. Я сделал fiddle, который показывает все, за исключением того, что я получаю информацию обо всех объектах, даже когда я только изменяю один объект. Как получить фактический activeObject и его информацию?Какой объект был изменен в fabric.js

Вот js в скрипке, которую я пытался выработать.

 //**********When card is moved************ 

    canvas.on('object:modified', onObjectModified); 

      function onObjectModified(e) {  

      var activeObject = e.target; 

      alert(activeObject.get('left')+' '+ activeObject.get('top')+' '+cardtype+' '+cardcount);     

     }; 
+0

Что вы думаете о прикреплении свойства ID к объекту, который вы сохраняете на холсте, чтобы вы могли проверить, какой объект вы хотите получить? –

+0

Я делаю это, когда добавляю его на холст, чтобы я мог сделать ajax-вызов, чтобы сохранить его в базе данных. Идентификатор равен количеству карт в момент его добавления. Так что да, если я могу захватить идентификатор, тогда я бы знал, какой объект был изменен. Просто не уверен, как убедиться, что это то, что я получаю. – Progrower

+0

Вы видели мою [скрипку] (http://jsfiddle.net/progrower/a4PrY/44/) – Progrower

ответ

2

Чтобы получить выбранный объект холст с fabric.js вы должны использовать methood getActiveObject() возвращает именно то, что вам нужно. Нравится:

alert('Modified object x,y: ' + this.getActiveObject().get('left') + 
    ' ' + this.getActiveObject().get('left') + 
    ' it\'s id is: ' + this.getActiveObject()._objects[0].id); 

Это fiddle.

И не забудьте проверить свои скобки. Теперь вы добавляете onObiectModified в качестве обработчика событий для каждой желтой карточки, и я буду называться для каждого. Просто переместите canvas.on('object:modified', onObjectModified); в другое место, например, после var объявлений.

Ох, и если вы используете тест как jsFiddle окружающих среды с fabric.js, пожалуйста, используйте в качестве ссылки https://rawgithub.com/kangax/fabric.js/master/dist/fabric.js вместо https://raw.github.com/kangax/fabric.js/master/dist/fabric.js (примечания удаления точки!), Иначе он не будет работать на Chrome (см this question)

Надеюсь, что это поможет.

+0

Я вижу, что вы сделали, но если я добавлю 4 карты на холст в [скрипке] (http: // jsfiddle .net/Zegis/rVgsu/1 /) Кажется, он подает предупреждение 4 раза, когда я перемещаю одну карту. Это похоже на проблему, с которой я столкнулся. Я получал правильную информацию, но она обеспечивала бы информацию для каждого объекта на холсте после его перемещения. – Progrower

+0

О, извините. Я добавил ссылку на неправильную скрипку. Вот [рабочий] (http://jsfiddle.net/Zegis/rVgsu/). (Я тоже отредактирую ответ!) –

+0

Спасибо! Я попытаюсь реализовать это в моем полном скрипте. – Progrower

Смежные вопросы