2012-11-29 16 views
9

Jak zmienić rozmiar fazy w tekście 3d w x3dom? Teraz mam kod jak tenJak zmienić rozmiar skosu tekstu 3d w x3dom?

<x3d width="392px" height="392px"> 
<scene> 
    <viewpoint position='0 0 11'></viewpoint> 
    <background skyColor='0.5 0.5 0.5'></background> 
    <shape> 
    <appearance> 
     <material ambientIntensity='0.0933' diffuseColor='0.32 0.54 0.26' shininess='0.51' specularColor='0.46 0.46 0.46'></material> 
    </appearance> 
    <text string='Mono bolditalic 32px' solid='false'> 
     <fontstyle family="TYPEWRITER" style="BOLDITALIC" size="0.8"></fontstyle> 
    </text> 
    </shape> 
    <transform translation='0 0 -2'> 
    <shape> 
     <appearance> 
      <material diffuseColor="1 0 0" specularColor="0.5 0.5 0.5"></material> 
     </appearance> 
     <box></box> 
    </shape> 
    </transform> 
</scene> 
</x3d> 

Czy istnieje przykładowy kod dostępne dla tego?

+0

Wszelkie aktualizacje w tej sprawie? – JSuar

Odpowiedz

1

Wygląda na to, że nie ma żadnych bezpośrednich przykładów na ukosowanie tekstu za pomocą samego X3Dom. three.js wydaje się być jedynym rozwiązaniem webgl, widzę, gdzie można łatwo zmienić fazę tekstu 3D. Wygląda na to, że znalazłeś to na podstawie twoich najnowszych pytań.

Oto niektóre inne dobre zasoby/przykłady dla three.js.

A oto kilka przykładów JSFiddle. Będą one znacznie łatwiejsze do czytania/eksperymentowania.


miałem problemy uzyskiwanie konfiguracji JSFiddle. A fellow programmer was having a similar issue, ale z jego pomocą przygotowałem użyteczny przykład. Pozwoli ci to na eksperymentowanie z możliwościami fazowania.

Bevel Przykład:http://jsfiddle.net/VsWb9/674/

JavaScript

// This is where stuff in our game will happen: 
var scene = new THREE.Scene(); 

// This is what sees the stuff: 
var aspect_ratio = window.innerWidth/window.innerHeight; 
var camera = new THREE.PerspectiveCamera(45, aspect_ratio, 1, 100000); 
camera.position.z = 800; 
camera.position.x = 350; 

scene.add(camera); 

// This will draw what the camera sees onto the screen: 
var renderer = new THREE.WebGLRenderer(); 

// var renderer = new THREE.CanvasRenderer(); 
renderer.setSize(window.innerWidth, window.innerHeight); 
document.body.appendChild(renderer.domElement); 

// ******** START CODING ON THE NEXT LINE ******** 
var shape = new THREE.TextGeometry("Game Over", 
            {font: 'helvetiker', 
            bevelThickness: '3', 
            bevelSize: '3', 
            bevelSegments: '4', 
            bevelEnabled: 'true'}); 
var wrapper = new THREE.MeshNormalMaterial({color: 0x00ff00}); 
var words = new THREE.Mesh(shape, wrapper); 
scene.add(words); 

// Now, show what the camera sees on the screen: 
renderer.render(scene, camera); 

dodatkowe JS

<script src="http://gamingJS.com/Three.js"></script> 
<script src="http://gamingJS.com/ChromeFixes.js"></script> 
<script src="http://mrdoob.github.com/three.js/examples/fonts/helvetiker_regular.typeface.js"></script>