¿Array d Objects?

Azibi
20 de Enero del 2005
Estamos creando una web para una asignatura d la carrera, la cosa consiste en una pagina en la que en un visor cargue al pulsar un boton la imagen 3d asociada a ese boton. Utilizarmos la etiqueta object para acceder a cada imagen 3d porque la pagina debe ser una XHTML valida segun la W3C. He desarrollado un script que cambia entre dos imagenes pusando una tecla, es este:

var num=0;
var num=0;
function cambiar()
{
document.getElementById("vrml_"+num).style.visibility=\'hidden\';
num = (num + 1) % 2;//el valor tras el % indica el numero d imagenes entre las que alterna
document.getElementById("vrml_"+num).style.visibility=\'visible\';
}

El problema es que este sistema obliga a cargar todas las imagenes 3d (ke ocupan casi un mega) al cargar la pagina ya que se basan en un sistema d \'oculta/visible\', asi que necesito un sistema d acceso dinamico a los objetos 3d (que no son tantos como para necesitar una base d satos). ¿Debo utilizar un array conteniendo dichos objetos?, ¿como los referencio en el array?, a la hora d acceder a ellos ¿que codigo deberia poner en el XHTML?

GRACIAS.

azibi
20 de Enero del 2005
Muchas gracias por responder tan rapido, tu codigo me esta siendo d mucha ayuda, pero no es lo ke necesitaba seguramente a sido porque no me he explicado bien.
A lo mejor la solucion no es tan complicada como pienso, la cosa consiste en una pagina ke tiene un visor que permite ver imagenes 3d VRML d extension .wrl, y en una parte d esta pagina hay una serie d botones cada uno asociado con una imagen VRML (aunke d momento no se hacer esa asociacion), de manera que cada vez que se pulse un boton cargara su imagen asociada en el visor. Para el visor tengo un script ke permite visualizar VRML y la linea d codigo que permite ver una imagen es <object data="VRML/ejemplo.wrl">Ejemplo VRML</object>, y quiero ke todos los vrml esten metidos en un array para ke como tu muy bien dices se carguen solo cuando los llame pulsabdo cada boton. El script cambiar simplemente
es otra funcion ke permite pasar por cada uno d los existentes en el array.

Jorge
20 de Enero del 2005
A ver si lo entiendo.
Los objetos que obtienes mediante getElementById("vrml_"+num), ¿que son? ¿"images"? ¿"divs?

¿En algun lugar del "body" tienes escrito <object data="VRML/ejemplo.wrl">Ejemplo VRML</object> y con eso se visualiza el archivo "ejemplo.wrl"?

Algo asi como <object id="visor" data="VRML/ejemplo.wrl">Ejemplo VRML</object> ¿Seria valido?

Lo pregunto porque entonces supongo que seria posible hacer document.visor.data=VRML/ejemplo2.wrl para que se visualizara el archivo "ejemplo2.wrl", ¿no?

Y sino, en el peor de los casos esas etiquetas "object" estaran dentro de alguna otra, ¿no? Una celda de una tabla o una capa o algo... reescribes todo el contenido de esa "etiqueta contenedora" y supongo que deberia funcionar.

azibi
20 de Enero del 2005
1) Los objetos son imagenes 3d pero no se pueden catalogar con la etiqueta <img> d html son <embed> pero para los requerimientos ke nos piden (que sea un documento valido xhtml strict) tp podemos usar embed y debemos usar <object>
2) Exactamente, poniendo eso en el body permite ke la imagen 3d (gracias a otro script existente) se vea. Si pones dos lineas iguales (cambiando data) salen dos instancias del visualizador cada una mostrando la imagen 3d contenida en data.
3) Los object estan dentro d otras etiquetas:

<div id="visualizador">
<object data="VRML/ejemplo.wrl">ejemplo VRML
</object>
</div>

Esto es debido a que usamos codigo semantico para hacer la pagina ( http://www.disenorama.com/tutoriales/css/disena_una_pagina_con_codigo.htm ).

azibi
20 de Enero del 2005
He creado un .js:

var vrmlPack = new Array("01","02");

function cargar()
{
for (n=0; n<vrmlPack.length; n++)
{
vrmlPack[n] = "VRML/" + vrmlPack[n] + ".wrl";
}
}

function pulsar(num)
{
document.getElementById("3d").data="vrmlPack[num]";
}

Donde VRML/01.wrl y VRML/02.wrl son 2 imagenes VRML.
he cargado el script debidamente en la cabecera y he hecho <body onload="cargar();">. Despues en el cuerpo en el div adecuado hice:

<div id="visualizador">
<object id="3d" data="VRML/01.wrl">Barney VRML</object>
<button onclick="pulsar(0)">Cargar</button>
<button onclick="pulsar(1)">Cargar</button>
</div>


azibi
20 de Enero del 2005
No se porque pero pulse tabulador y espacio y envio, perdon.
El caso es que meti ese codigo (la linea object es necesaria para cargar la imagen inicial VRML), pero sigui sin funcionar, seguro que para ojos expertos es muy obvio, pero ¿que hice mal?.
GRACIAS

Jorge
20 de Enero del 2005
No se si habre entendido bien lo que necesitas.

A nivel de tiempo de carga yo creo que da mas o menos igual si cargas los objetos (con visibilidad anulada) en el body o que crees un array de objetos y los cargues en el.

Al final lo que tienes es que al cargar la pagina, cargas un monton de imagenes y eso lleva tiempo.

Depende de los requisitos de lo que te piden hacer y las tecnicas que te permitan usar.

Yo cambiaria el enfoque y en lugar de cargar todas las imagenes al principio lo que haria seria cargar cada una cuando sea necesaria, esto es, cuando pulsar el boton, no antes. El usuario tendra un retardo en ver la imagen, pero bueno, generalmente no sera mucho.

En lugar de crear un array que contenga los objetos, crea un array con las urls a las imagenes. En la funcion "cambiar" en lugar de cambiar el estado de "visibilidad" del objeto "image" cambia su propiedad "src" por la correspondiente alamcenada en el array en el array.

Supon que el array lo llamo "vrmlSrc", la funcion que cambia la imagen que se muestra en un objeto image seria mas o menos asi...

function cambiar() {
var obj = document.getElementById("vrml_"+num);
obj.src = vrmlSrc[num];
}

He creado una pagina de ejemplo muy simple (cutre) de como hacerlo en http://myheels.webcindario.com/consult/176077.htm
El ejemplo solo tiene 3 imagenes pero se extiende a todas las que hagan falta simplemente poniendo mas elementos en el array "vrmlSrc".