Estoy tratando de verificar si hay una colisión entre 2 objetos de texto y estoy usando intersectsWithObject . Está funcionando, pero está teniendo en cuenta el recto bouding. ¿Es posible verificar el nivel de píxeles?
Comportamiento actual:
Comportamiento deseado:
const canvas = new fabric.Canvas('canvas'); canvas.setWidth(document.body.clientWidth); canvas.setHeight(document.body.clientHeight); const text = new fabric.Textbox('some text', { width: 300, fontSize: 70, top: 120, left: 100 }); const text2 = new fabric.Textbox('some more text', { width: 350, fontSize: 50, top: 200, left: 20, }) if (text.intersectsWithObject(text2, true, true)) { text.set('fill', 'red'); } else { text.set('fill', 'black'); } canvas.on('after:render', function() { canvas.contextContainer.strokeStyle = '#555'; canvas.forEachObject(function(obj) { var bound = obj.getBoundingRect(); canvas.contextContainer.strokeRect( bound.left + 0.5, bound.top + 0.5, bound.width, bound.height ); }) }); canvas.add(text); canvas.add(text2);