Faces (triángulos 3d) en Papervision3D |
Etiquetas: geometry faces |
|
Además de
La matriz que contiene todos los triángulos de una figura se encuentra dentro de la propiedad geometry.faces del objeto. Por ejemplo para recorrer todas las caras de un plano y poner a cada una un color aleatorio, podemos hacer:
Obteniendo algo parecido a esto:
Un par de detalles útiles a la hora de trabajar con las caras en Papervision son: -cada cara tiene un id (propiedad id)numérico único. Este id nos puede valer por ejemplo para asociar en una matriz cada cara a un material. -Si añadimos un evento de ratón a un objeto, el evento InteractiveScene3DEvent que se propaga tiene una propiedad face3d, que hace referencia a la cara que ha recibido el evento (por ejemplo un click) |
Cambiar la visualización utilizando Vertex |
Etiquetas: vertex |
|
Siguiendo con el tema de los
Con un switch de este tipo:
podemos cambiar la reacción de los vértices a los movimientos del ratón. |
Posicionar vértices en Papervision3D |
Etiquetas: vertex WireFrameMaterial |
Los elementos 3D (planos, esferas, modelos 3d, etc) están compuestos de triángulos. Por ejemplo, si creamos un plano en Papervision3D con un WireframeMaterial con la siguiente sintaxis:
obtenemos un resultado parecido a este:
Los vértices de un objeto están almacenados en un Array (vertex) dentro de la propiedad geometry del objeto. Por ejemplo, en el caso de nuestro plano podemos recorrer los vértices con este bucle:
Los números que he colocado sobre la imagen anterior, indican el orden en el que aparecen los vértices en esta matriz. Podemos observar que un plano por n x m segmentos, tiene (n+1) x (m+1) vértices. En nuestro caso, el plano de 4x3 segmentos, tiene 5x4 vértices, ordenados de abajo arriba y de izquierda a derecha. Estos vértices tienen unas coordenadas, que dan a la malla la apariencia de plano, y se pueden modificar. Por ejemplo imaginemos que queremos hacer un carrusel circular compuesto por 8 planos. Podemos crear los 8 planos, y distribuirlos en el círculo mirando al centro, con lo que obtendríamos algo asi (click en la imagen para ver): El efecto es resulton, pero si nos fijamos, los planos aparecen rígidos y no se adaptan a la forma del círculo. Para solucionarlo, podemos posicionar los vértices de los planos en el círculo, en lugar de los propios planos, con lo que obtendríamos algo asi (click en la imagen para ver): Aunque en principio puede parecer muy complejo "posicionar vértices", en realidad haciendo un par de ejemplos se entiende perfectamente, y en algunos proyectos puede mejorar mucho los resultados. Dejo los fuentes comentados, para poder probar las dos opciones y ver las diferencias. |
Bug en la función updateBitmap() de MovieMaterial en Papervision3D 2.0 GreatWhite |
Etiquetas: updateBitmap() drawBipmap() |
Esta semana me he vuelto a topar con este bug de la clase MovieMaterial en Papervision 2.0 GreatWhite. Si utilizamos un MovieClip como material, utilizando MovieMaterial, y este vá a cambiar en algún momento, pero no queremos utilizar el atribute animated para conservar recursos, podemos llamar a la funcion updateBitmap() para actualizar el material solo cuando sea necesario. El problema es que en esta versión de Papervision, la función updateBitmap() definida en MaterialObject3D, está vacía (literalmente). Para solucionar este inconveniente, podemos llamar a la función drawBitmap de la clase MovieMaterial. Por ejemplo:
|
Publicado el primer libro de Papervision |
|
La editorial Está escrito por Jeff Winder y Paul Tondeur, y según palabras textuales de Carlos Ulloa, está "de puta madre". Los contenidos son: Preface
Chapter 1: Setting Up Se puede comprar |
Rotaciones en Papervision Greatwhite |
|
Como a veces es un poco difícil imaginar como van a afectar a su aspecto las transformaciones en las propiedades de los elementos en 3d, me he hecho esta mini-aplicación con Sliders para ver como se muestra un plano al rotarlo sobre sus tres ejes. Espero que a alguien más le sea útil, dejo los fuentes (está hecho con Papervision GreatWhite) por si queréis modificar otras propiedades. |
Papervision GreatWhite: crear un plano con dos caras |
Etiquetas: Plane DisplayObject3D Viewport3D BasicRenderEngine |
|
Existen dos maneras de crear una plano con dos caras en Papervision3D: -Crear un cubo con una profundidad de 1pixel, y utilizar las caras delantera y trasera como caras del plano. -Crear un contenedor DisplayObject3D, y meter dentro dos planos. El plano "b" debe tener una profundidad de 1 y una rotatión de -180º. El segundo método es el que me parece más cómodo, ya que gestionar los materiales con un cubo es más engorroso que con un plano. Un ejemplo de plano con dos caras podrías ser: |
Materiales interactivos en Papervision GreatWhite, parte II |
Etiquetas: Viewport3D BasicRenderEngine interactive animated MovieAssetMaterial |
|
En Papervision greatWhite podemos
Otra opción es crear los elementos 3D a partir de MovieClips interactivos que tienen asociados eventos. Por ejemplo, tenemos un MovieClip con tres botones dentro, y creamos una esfera con ese MovieClip como material. Para que se respeten los eventos de ese clip al convertirlo en material3D, debemos configurar los siguientes parámetros: -al crear la instancia de Viewport3D debemos especificar que es interactivo:
-al crear el material debemos especificar que es interactivo y animado:
Tras el salto, el código completo y la demo. |
Crear modelos 3D Collada para Papervision en Google Sketchup |
Etiquetas: DAE load Viewport3D BasicRenderEngine Camera3D |
|
Google Sketchup es uno de los programas mas sencillos de modelado 3D. Además la versión gratuita es bastante completa, y más que suficiente para hacer modelos sencillos.Una vez hemos descargado Google Sketchup y hecho el primer modelo, tenemos que seguir los siguientes pasos: -Exportar el modelo como Google Earth 4. Esto creará un archivo .kmz -Renombrar el archivo .kmz a .zip. -Descomprimir el archivo y buscar dentro el .dae y las texturas (si las hay). Tras el salto, el 3D en movimiento y el código para cargar el modelo. |
Utilizar materiales interactivos en Papervision GreatWhite |
Etiquetas: InteractiveScene3DEvent BasicRenderEngine Viewport3D displayObject3D |
|
Para utilizar eventos de ratón sobre objetos en Papervision GreatWhite, tenemos que hacer tres cosas: |
Prueba de Line3d en Papervision GreatWhite |
Etiquetas: Lines3D addNewLine Line3D BasicRenderEngine Viewport3D |
|
Hace tiempo que le tenia echado el ojo, asi que hace un rato me he puesto y me ha sorprendido lo fácil que es utilizar esta clase. Veo mucho potencial, a ver si me instalo la CS4 y hago un ejemplo de CS4 + la nueva función extract de FP10. Aquí dejo el fuente por si le ayuda a alguien: |
Papervision GreatWhite: Tipos de Shader |
Etiquetas: PointLight3D GouraudShader FlatShader CellShader PhongShader ShadedMaterial |
|
Una de las novedades de Papervision GreatWhite son los ShadedMaterial. Para utilizarlos basta con seguir los siguientes pasos: |
Galeria de Flickr con Papervision GreatWhite, V2 |
Etiquetas: API Flickr Papervision GreatWhite |
|
He "mejorado" la galeria de imágenes en 3D, añadiendo un menú lateral con todos los albums de usuario (en este caso Lola) y permitiendo la carga de las imágenes originales haciendo click en cada cubo. |
Demo de navegación con cubos en Papervision GreatWhite |
Etiquetas: API Flickr GreatWhite |
|
Esta es una demo de navegación en 3D, y utiliza Papervision GreatWhite y la API de Flickr. |
Papervision 2.0a Greatwhite: Sombras |
Etiquetas: Viewport3D BasicRenderEngine PointLight3D ViewPort3D GouraudMaterial |
|
Una de las novedades de la versión alpha de Papervision son las sombras. Para poder crear efectos de luz, debemos crear un objeto de tipo PointLight3D, y utilizar materiales especiales en los objetos (en este caso u material de tipo GouraudMaterial). El resto es igual que en una plantilla normal de PPV3D. |
Demo Papervision GreatWhite + SoundMixer.computeSpectrum |
|
Una de las novedades de Actionscript 3.0 es la clase SoundMixer, que permite de manera fácil obtener un ByteArray que contenga una instantánea del sonido reproducido. Hay un montón de demos de SoundMixer, muchas de ellas con Papervision. Esta es una más. |
Papervision 2.0: GreatWhite.Plantilla básica |
Etiquetas: Viewport3D BasicRenderEngine Scene3D Camera3D MovieMaterial MaterialList DisplayObject Viewport3D Vertex3D |
|
Hace tiempo que está disponible la versión 2.0a de Papervision, bajo el nombre de Greatwhite. Hay algunos cambios respecto a la versión anterior, y ya han empezado a surgir tutoriales donde se explica como utilizar las nuevas clases y como se recomienda dividir los bloques de código. Esta es una plantilla básica de Papervision 2.0. En este caso creo un cubo y creo sobre él un efecto de "fluidez". Para que funcione hay que tener descargadas las clases de Papervision 2.0a, y haber indicado a Flash donde están guardadas.
|