2
0

three.html.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. THREE.HTMLGroup = function ( dom ) {
  5. THREE.Group.call( this );
  6. this.type = 'HTMLGroup';
  7. /*
  8. dom.addEventListener( 'mousemove', function ( event ) {
  9. console.log( 'mousemove' );
  10. } );
  11. dom.addEventListener( 'click', function ( event ) {
  12. console.log( 'click' );
  13. } );
  14. */
  15. };
  16. THREE.HTMLGroup.prototype = Object.assign( Object.create( THREE.Group.prototype ), {
  17. constructor: THREE.HTMLGroup
  18. } );
  19. THREE.HTMLMesh = function ( dom ) {
  20. var texture = new THREE.HTMLTexture( dom );
  21. var geometry = new THREE.PlaneGeometry( texture.image.width * 0.05, texture.image.height * 0.05 );
  22. var material = new THREE.MeshBasicMaterial( { map: texture } );
  23. THREE.Mesh.call( this, geometry, material );
  24. this.type = 'HTMLMesh';
  25. };
  26. THREE.HTMLMesh.prototype = Object.assign( Object.create( THREE.Mesh.prototype ), {
  27. constructor: THREE.HTMLMesh
  28. } );
  29. THREE.HTMLTexture = function ( dom ) {
  30. THREE.CanvasTexture.call( this, html2canvas( dom ) );
  31. this.dom = dom;
  32. this.anisotropy = 16;
  33. };
  34. THREE.HTMLTexture.prototype = Object.assign( Object.create( THREE.CanvasTexture.prototype ), {
  35. constructor: THREE.HTMLTexture,
  36. update: function () {
  37. console.log( 'yo!', this, this.dom );
  38. this.image = html2canvas( this.dom );
  39. this.needsUpdate = true;
  40. }
  41. } );