¿Es posible tener dos contextos WebGL en la misma página?

Estoy tratando de dibujar la misma escena WebGL utilizando dos lienzos uno al lado del otro. ¿Es posible? Hasta ahora no he tenido suerte.¿Es posible tener dos contextos WebGL en la misma página?

La idea es la siguiente:

cargo mi geometría
I fijó dos gl contexto, uno por lienzo
me llaman drawElements en el primer contexto de pasar mi geometría
I llame al drawElements en el segundo contexto pasando mi geometría

Resultados: Solo la primera invocación es exitosa. El segundo contexto ejecuta gl.clear correctamente pero no se muestra ninguna geometría.

¿Qué me estoy perdiendo? ¿Es esto una restricción de especificación? o una limitación en las implementaciones de Firefox y Safari?

Gracias,

Fuente

2012-02-03 Diego

Pensé que debería dejar un enlace a esta solución: http://stackoverflow.com/a/33180165/128511 En particular [esta solución webgl] (http://twgljs.org/examples/itemlist.html), y [esta solución three.js] (http://threejs.org/examples/webgl_multiple_elements.html) – gman

Sí, usted puede tener más de un contexto WebGL en una página, pero cada contexto debe gestionar sus recursos propios. No puede crear búferes o texturas en un contexto y luego usarlos en el otro, así que para utilizar este enfoque, si desea representar la misma escena, deberá cargar todos sus recursos dos veces.

Eso es ciertamente factible, pero requerirá mucha memoria (como se puede imaginar). Una mejor solución sería crear un contexto que sea 2 veces el ancho que necesita y usar gl.viewport y gl.scissor para renderizar a la mitad para cada vista de la escena.

O bien, cree un lienzo de tamaño de vista completo y utilice la configuración de tijera/puerto de visualización para que coincida con otros elementos html. Ver esto Q & A: How can we have display of same objects in two canvas in webgl?

Fuente

2012-02-03 04:30:05 Toji

También había pensado en la opción de ventana gráfica. Pero me gusta complicar las cosas solo para ver qué se puede hacer. lol. Gracias. – Diego

Eso debería haber arrojado un error. Como dijo Toji, dos WebGLContext s no pueden compartir recursos. Sin embargo, hay una propuesta para esto. Check here. Sospecho que veremos algo similar en WebGL pronto.

Fuente

2012-02-08 14:48:41

¡Ooh! ¡Bonito! No sabía que eso estaba sobre la mesa. – Toji

Propuesta de extensión aquí: https: //www.khronos.org/registry/webgl/extensions/WEBGL_shared_resources/ – prideout

Para su información, esa propuesta fue abandonada. Sé que mientras lo escribía, también lo implementé y al hacerlo me di cuenta de que era la solución incorrecta. La nueva solución es 'OffscreenCanvas' aunque todavía no se ha enviado – gman

utilizo varios contextos WebGL en una sola página mediante la asignación de la misma clase que los lienzos que deben convertir el contenido de WebGL, y poner algo específico en el lienzo interior html:

function specific(what) { 
    switch (what) { 
    case 'front': 
     //do something 
     break; 
    case 'side': 
     //do something else 
     break; 
    } 
} 

function webGLStart() { 
    var canvasArray = document.getElementsByClassName("webGLcanvas"); 
    for (var index = 0; index < canvasArray.length; ++index) { 
     initWebGlContext(); 
     specific(canvasArray[index].innerHTML); 
    } 
} 

</script> 
</head> 

<body onload="webGLStart();"> 
    <canvas class="webGLcanvas">front</canvas> 
    <canvas class="webGLcanvas">side</canvas> 
</body>

Puede encontrar un trabajo ejemplo here.

Como explicaron las respuestas anteriores (Toji y Chris Broadfoot), debe tener en cuenta que no puede compartir recursos entre contextos WebGL.

editar: code ya está disponible en github.

Fuente

2014-11-24 10:09:30

¿Es posible tener dos contextos WebGL en la misma página?

Respuesta

Cuestiones relacionadas