lothar

It's not as good as in Chrome but alot better than before. Thanks for you help!

Good finding! I wasn't aware that "after:render" was called so many times.... But now the texture is updated 100 Times per second no matter if there is a change or not ? Wouldn't it better to do it like this: var timeout = 0;fabricCanvas.on('after:render', function () { if (timeout==0) { timeout = setTimeout(function () { groundTexture.update();timeout=0 }, 10); } else { }});http://www.babylonjs-playground.com/#9U086#35 What do you think? Thanks for you help.

Thanks for Setting up. I added the stuff here: http://www.babylonjs-playground.com/#9U086#32 Don't know why it first says fabricjs not defined - so you have to press run again. When you view it in Firefox and Chrome you see the difference. Edit: Created a second one just for fun: http://www.babylonjs-playground.com/#9U086#33 (wanted to see what happens with a lot of elements)

Hello iiceman, Thanks for your answer. Didn't thought about the obvious... I've added a checkbox to turn the texture update off at http://www.steidle.n...shirt/test.html - when you click "show hidden" and move the text around on the right canvas and then turn the update off and move it around - it doesn't seem like it is faster in IE but it seems faster in Firefox. So it seems it is a mixture between slower fabricjs in NON-Chrome and slower "what ever happen when calling update on dynamic texture" in NON-Chrome. best regards, Lothar

Hello, I am new to this forum and first want to thank for a lot of helpfull posts! Maybe someone can help me with this one: I've started with http://www.babylonjs-playground.com/#9U086#4 (I believe created by iiceman, thanks!) and tried to use fabricjs to paint on the canvas. To allow user interaction I've send the events from the Bayblonjs canvas to the fabricjs canvas translated like this: var pickResult = scene.pick(scene.pointerX, scene.pointerY);var texcoords = pickResult.getTextureCoordinates(); if (texcoords) { var clicked_x = texcoords.x; var clicked_y = texcoords.y; var posX = (clicked_x * textureWidth) | 0; var posY = (textureWidth - clicked_y * textureHeight) | 0; var rect1 = canvas.upperCanvasEl.getBoundingClientRect(); var clientX = posX + rect1.left | 0; var clientY = posY + rect1.top | 0; var evt = document.createEvent("MouseEvents"); evt.initMouseEvent(name, true, true, window, 1, screenX, screenY, clientX, clientY, event.ctrlKey, event.altKey, event.shiftKey, event.metaKey, event.button, canvas.upperCanvasEl); return evt;}I was surprised that this works. Sorry i didn't figured it out how to make a playground example with fabricjs, instead I have an example here: http://www.steidle.net/playground/webgl/shirt/test.html But my problem is that it is smooth in chrome, slow in firefox and IE, unusable in Mac Safari. Does someone have a idea how i could get better performance? The Part where the texture get updated is only called when the underlying fabricjs canvas changes: canvas.on('after:render', function () { UpdateTexture();});best regards, Lothar