7

I have a 3DSMax based model in .obj and .max file format. This model has various areas with clickable points that works fine in 3DSMax. Clicking those points shows the details of those areas.

I have to display this interactive model on the web with all those clickable features. Also I have to save information of those clickable areas in database using AJAX, so that when user clicks on any area of that model it will make an AJAX request.

I also checked this thread

In the attached image there are various areas numbered on the model. All these areas needs to be clickable and should be able to capture details using AJAX.

In the attached image

I am able to load this model on web using three.js as per this example, but those clickable areas are not working. I am not able to perform any click, nor am I able to create any AJAX request.

I am using .obj file as I am unable to load the .max file.

var loader = new THREE.OBJLoader();

// load a resource
loader.load('models/monster.obj', function(object) {
  scene.add(object);
}, function(xhr) {
  console.log((xhr.loaded / xhr.total * 100) + '% loaded');
}, function(error) {
  console.log('An error happened');
});
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
ramya
  • 2,350
  • 6
  • 31
  • 57
  • I am not firm in this topic but have you read this? https://www.pericror.com/software/creating-3d-objects-with-click-handlers-using-three-js/ – Insomnia88 Aug 07 '19 at 10:21
  • @Insomnia88, I checked that, thnx, but those objects are created inside three.js itself. In my case those objects are built in 3dsmax and I am simply loading that object in three.js. – ramya Aug 09 '19 at 10:58
  • @yadavr Simply use [Raycaster.intersectObject](https://threejs.org/docs/#api/en/core/Raycaster.intersectObject). It returns UV coordinates at certain point. – StrandedKitty Aug 13 '19 at 11:21

1 Answers1

0

The easier way for you is to separate those areas in 3ds Max into different objects (select and detach polygon), then use Raycaster on a click event to capture what was clicked; and use intersects[0].object to store what was clicked. But you can also use Raycast to a Texture to see where on the UV was clicked, but your mesh must be unwrapped properly. see the example from three.js code here: link

Armin Masoomi
  • 125
  • 1
  • 9