texture drag 'n' drop

This topic has 3 replies, 2 voices, and was last updated 6 years ago by Yuri Kovelenov.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Posts
2018-10-31 at 8:06 am #8548

3dmdlb
Customer

Hi,
i want to create an app in which you can replace the texture of a WebGL-model by drag’n’drop another texture on the model in the browser window.

Alternatively and as a less nice option, the texture-change can be made by a button in the Website-UI which opens an explorer-window. Then you can search/choose the texture locally on your Workstation.

Also i want to create Web-UI sliders for changing the rotation, position and tiling of the texture.

Is this possible?

2018-10-31 at 8:35 am #8549

Yuri Kovelenov
Staff

Hi,

This will require some coding to implement.

The upload function for images can be added using <input type="file">element on a web page. It as also possible to make it uploading with drag-n-drop – link.

When the user uploads an image, a server side script puts it in a web server directory and returns its URL.

The URL is then used by the replace texture puzzle to apply the image to the model.

Yes, the sliders can be added to a web page for scaling/rotating/tiling the image. The values generated by these sliders can be passed down to your material using the newly implemented set value puzzle (available in Verge3D 2.9 pre1).

The most close example to what you’re asking for can be seen here. (click Customize button, then click the camera button near the bag surface, finally click Upload a picture button).

Chief 3D Verger | LinkedIn | Twitter

2018-10-31 at 9:17 am #8553

3dmdlb
Customer

Fantastic, thanks a lot Yuri, this is exactly what i’m looking for!

2018-11-01 at 7:36 am #8571

Yuri Kovelenov
Staff

Glad it was helpful!

Chief 3D Verger | LinkedIn | Twitter
Author

Posts