mrdoob / three.js

JavaScript 3D Library.
https://threejs.org/
MIT License
99.31k stars 35.12k forks source link

how to create a tool for basic 3dmodelling tool ? ? #1156

Closed gova05cse closed 12 years ago

gova05cse commented 12 years ago

good noon !

referring to Issue #1002 , i dropped my previous ideas on copying ...........

i want to create a simple 3dmodelling tool which performs scaling , rotation , reflection , transformation of 3d objects in a web browser using three.js ..............

now i have started a fresh project , so pls guide me step by step .................

help me to build my project from scratch to higher end !

thanks .....

LiquidSnakeX commented 12 years ago

I'm certainly no authority on this project, but I think we're lucky that the developers work on the engine for free, let alone that they provide tech-support for it, also for free. So I think it's a bit too much to ask them to design and implement your project for you - for free.

If you have no specific sticking points but generally just don't know where to start at all, you should probably be working on some simpler stuff first, you'll be glad you did later ;)

mrdoob commented 12 years ago

Thanks @LiquidSnakeX :)

gova05cse commented 12 years ago

now i have created the grid and rendered objects by using external toolbar ! ! !

toolbar.js file has following code :

//CUBE
function cubes()
{
 var _domElement = document.createElement( 'div' );
_domElement.id="cube";
_domElement.width = _domElement.height = 10;

var side=prompt("Enter a value :");
var geometry = new THREE.CubeGeometry( side, side, side ,4, 4,4 );
var material = new THREE.MeshBasicMaterial( { color: 0xff0000} );
var mesh = new THREE.Mesh( geometry, material );
signals.added.dispatch( mesh );

_domElement.onclick = function() { alert(" u clicked me "); };
}

how to append the _domElement ? ? if i use container.appendchild(_domElement); its not getting appended to html document . . . . . . . how to append it ? ? i need corresponding div element to access the corresponding mesh,,, to change the dynamic scaling & de-scaling property of cubes which am rendering ?

i hope u got my problem ? ?

help me thanks ! !

mrdoob commented 12 years ago
document.body.appendChild( _domElement );
gova05cse commented 12 years ago

thanks for previous answer ! ... i was doing things from scratch of my own with the start up code patch u given so jus clear when i go wrong ? ?

u have given me the startup for rendering objects in a grid ? ?

in tat startup material u have given drag & drop option for objects ? ? here comes my problem ? ? ......

may i know how the path for drag & drop happens ? ? . . .

what happens wen i click on a object & drag it to new place & drop it ? ? ?

similarly i want to click on a particular object to pick it controls ? ? .. ................................................................. here is the code u given fo drag & drop ?

document.addEventListener( 'drop', function ( event ) {

        event.preventDefault();

        var file = event.dataTransfer.files[ 0 ];
        var extension = file.name.split( '.' )[1].toLowerCase();
        var reader = new FileReader();

        reader.onload = function ( event ) {

            var contents = event.target.result;

                    switch ( extension ) {

                    case 'js':

                                var loader = new THREE.JSONLoader();
                                loader.createModel( JSON.parse( contents ), function ( geometry ) {
                                    geometry.gui = {
                                        paremeters: {
                                        },
                                        getCode: function () {

                                        return 'new THREE.JSONLoader( TODO )';

                                        }
                                    };

                                    var material = new THREE.MeshBasicMaterial( { color: 0xffffff, wireframe: true } );
                                    var mesh = new THREE.Mesh( geometry, material );
                                    signals.added.dispatch( mesh );

                                } );

                                break;

                    case 'dae':

                                var parser = new DOMParser();
                                var xml = parser.parseFromString( contents, 'text/xml' );
                                var loader = new THREE.ColladaLoader();  // dont need 

                                loader.parse( xml, function ( collada ) {

                                signals.added.dispatch( collada.scene );

                                } );
                    break;
                }
        };

        reader.readAsText( file );

    }, false );

thanks !

mrdoob commented 12 years ago

That's not the code for drag&drop. That's the code for dropping a file into the browser. You seriously should take it easy ;)

gova05cse commented 12 years ago

thanks ! .....

its interesting to develop of my own ?? pls clear my doubts to reach d task ? ? ?

in start up code patch given by u has this part " dropping a file into the browser "? ? wats need for dropping in a file browser ? ? how to dynamically handle mesh ? ? how to get d controls of the mesh by a click event to dynamically to scale & resize ? ?