AR and Three.js - Draw from Points

Expo SDK
1

Please provide the following:

  1. SDK Version: 35
  2. Platforms(Android/iOS/web/all): iOS

Hi,

I’m trying to create an app where you select a section of the floor and then fill that section in with a texture. Currently I have followed the AR tutorials in place and managed to get a shape added to a horizontal plane. I have also got my app to take the first four touches as the four corners of where I want to place the item. So when the user comes onto the camera screen, they can look at an area in front of them, choose the four corners and the app saves the coordinates of the touches.

What I’m stuck on, is then creating a flat shape to cover that area in between each corner based on the coordinates I have selected.

This image might help to show example, select the four corners, then I will change the mats texture -

example
example1000×394 195 KB

Anyone got any hints they could give me, or links to a similar tutorial etc.?

Thanks

2

Hi

I think you’re basically trying to do a perspective transform. I’ve never used three.js, so not sure how it’s done there, but this Stack Overflow post looks like it might help.

3

Thanks Wodin, looks like the kind of thing I’m after, I will give it a read through.

Cheers,
Simon

4

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.