Visualize 3D objects on 2D Paper.js grid

[iamAmer]

Visualize 3D objects on 2D Paper.js grid

related to #44
I've noticed that the size of the 2D grid is the same as the 3D canvas, so I think it will make the process more simple.

My solution

1- We need to extract every object's coordinates.
2- converting 3D coordinates into 2D grid.
3- Draw corresponding shapes in Paper.js (top-down view).
4- Sync 3D canvas changes

Questions to explore

• How are 3D objects currently managed in the codebase?
• Is there an existing event system for object changes?

[iamAmer]

@pcolt is there any ideas on this issue, or could i start with this solution?

[pcolt]

@iamAmer I think your plan is a good one. I would start with point 1 and 2 drawing some simple points or shapes on the 2D grid, then I would adjust scales and eventually I would add proper shapes (maybe some hardcoded square to start with).

You can check the models array, it holds all the objects in the 3D scene. Pay attention to local coordinates and world coordinates. You will probably need the second one. There are some methods in Threejs to do that (i.e. object3D.localToWorld). Check also exportSceneToJson() it already does something like this