Drag and drop a texture

When I drag-and-drop a jpg, I want to assign it to texture, but I am getting an error

Can someone please tell me what I am doing wrong? How can it be fixed?
Thank you,

First of all, if you are passing the scene variable you need to add
this.scene = scene
in the constructor and so on.
I would recommend to make it without the class first.

it is pretty essential in my case to handle inside a class

When you know how it works without a class there will be no problem to convert it to the class :slight_smile:

Here is the working example with Drag-n-Drop into canvas (see console): https://playground.babylonjs.com/#114YPX#87
You need to get the extension from file and if it is the image then create a texture.

1 Like

Here is your PG with small changes, now it seems to be working :slight_smile: - https://playground.babylonjs.com/#1S3MC9#8


@labris Thank you! It works greast!

@labris It works great in playground.
When I downloaded it to my PC and ran it, I got the expected the result on the screen. However, in the console, I see the following error on drag-and-drop event

logger.ts:107 BJS - [20:54:33]: Please provide a valid .babylon file.

Is that safe to ignore?
thank you

In this case I believe it is safe, but you’d may check the extension of the file for the texture, for example like it is done in the Sandbox - Babylon.js/packages/tools/sandbox/src/components/renderingZone.tsx at master · BabylonJS/Babylon.js · GitHub
Also you may have a look how the fileInput is done there - Babylon.js/packages/tools/sandbox/src/components/renderingZone.tsx at master · BabylonJS/Babylon.js · GitHub

1 Like

Thank you for these pointers. I’ll double check that I am handling extensions properly

1 Like