XRWebGLBinding: createEquirectLayer() Methode
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Die createEquirectLayer()
Methode des XRWebGLBinding
Interfaces gibt ein XREquirectLayer
Objekt zurück, welches eine Ebene ist, die equirektangular kodierte Daten auf das Innere einer Kugel abbildet.
Syntax
createEquirectLayer(options)
Parameter
options
-
Ein Objekt zur Konfiguration des
XREquirectLayer
. Es muss die Eigenschaftenspace
,viewPixelHeight
undviewPixelWidth
haben.init
hat die folgenden Eigenschaften:centralHorizontalAngle
Optional-
Eine Zahl, die den zentralen horizontalen Winkel in Radiant der Kugel angibt. Standardwert:
6.28318
(2π). colorFormat
Optional-
Ein
GLenum
, der den Datentyp der Farbtexturdaten definiert. Mögliche Werte:gl.RGB
gl.RGBA
Zusätzlich, für Kontexte mit aktivierterEXT_sRGB
Erweiterung:ext.SRGB_EXT
ext.SRGB_ALPHA_EXT
Zusätzlich, fürWebGL2RenderingContext
Kontexte:gl.RGBA8
gl.RGB8
gl.SRGB8
gl.RGB8_ALPHA8
Zusätzlich, für Kontexte mit aktivierterWEBGL_compressed_texture_etc
Erweiterung:ext.COMPRESSED_RGB8_ETC2
ext.COMPRESSED_RGB8_PUNCHTHROUGH_ALPHA1_ETC2
ext.COMPRESSED_RGBA8_ETC2_EAC
ext.COMPRESSED_SRGB8_ETC2
ext.COMPRESSED_SRGB8_PUNCHTHROUGH_ALPHA1_ETC2
ext.COMPRESSED_SRGB8_ALPHA8_ETC2_EAC
Zusätzlich, für Kontexte mit aktivierterWEBGL_compressed_texture_astc
Erweiterung:Alle
der durch die Erweiterung unterstützten Formate. Der Standardwert istgl.RGBA
.
depthFormat
Optional-
Ein
GLenum
, der den Datentyp der Tiefentexturdaten definiert, oder0
, um anzugeben, dass die Ebene keine Tiefentextur bereitstellen soll (in diesem Fall wirdXRProjectionLayer.ignoreDepthValues
true
sein). Mögliche Werte innerhalb vonWebGLRenderingContext
Kontexten mit aktivierterWEBGL_depth_texture
Erweiterung, oder innerhalb vonWebGL2RenderingContext
Kontexten (keine Erweiterung erforderlich):gl.DEPTH_COMPONENT
gl.DEPTH_STENCIL
Zusätzlich, fürWebGL2RenderingContext
Kontexte:gl.DEPTH_COMPONENT24
gl.DEPTH24_STENCIL24
Der Standardwert istgl.DEPTH_COMPONENT
.
isStatic
Optional-
Ein Boolean, der, wenn wahr, anzeigt, dass Sie nur auf diese Ebene zeichnen können, wenn
needsRedraw
true
ist. Der Standardwert istfalse
. layout
Optional-
Ein String, der das Layout der Ebene angibt. Mögliche Werte:
default
-
Die Ebene berücksichtigt alle Ansichten der Sitzung.
mono
-
Ein einzelnes
XRSubImage
wird zugewiesen und beiden Augen präsentiert. stereo
-
Der Benutzeragent entscheidet, wie er das
XRSubImage
(eines oder zwei) zuweist und das Layout (oben/unten oder links/rechts) gestaltet. stereo-left-right
-
Ein einzelnes
XRSubImage
wird zugewiesen. Das linke Auge erhält den linken Bereich der Textur, das rechte Auge den rechten. stereo-top-bottom
-
Ein einzelnes
XRSubImage
wird zugewiesen. Das linke Auge erhält den oberen Bereich der Textur, das rechte Auge den unteren. Der Standardwert istmono
.
lowerVerticalAngle
Optional-
Eine Zahl, die den unteren vertikalen Winkel in Radiant der Kugel angibt. Standardwert:
-1.570795
(-π/2). mipLevels
Optional-
Eine Zahl, die die gewünschte Anzahl von Mip-Ebenen angibt. Der Standardwert ist
1
. radius
Optional-
Eine Zahl, die den Radius der Kugel angibt. Standardwert:
0
(unendliche Kugel). space
Erforderlich-
Ein
XRSpace
Objekt, das die räumliche Beziehung der Ebene zur physischen Umgebung des Benutzers definiert. textureType
Optional-
Ein String, der den Typ der Textur definiert, den die Ebene haben wird. Mögliche Werte:
texture
-
Die Texturen von
XRWebGLSubImage
werden vom Typgl.TEXTURE_2D
sein. texture-array
-
Die Texturen von
XRWebGLSubImage
werden vom Typgl.TEXTURE_2D_ARRAY
sein (nur WebGL 2 Kontexte). Der Standardwert isttexture
.
transform
Optional-
Ein
XRRigidTransform
Objekt, das den Offset und die Orientierung relativ zuspace
definiert. upperVerticalAngle
Optional-
Eine Zahl, die den oberen vertikalen Winkel in Radiant der Kugel angibt. Standardwert:
1.570795
(π/2). viewPixelHeight
Erforderlich-
Eine Zahl, die die Pixelhöhe der Ansichts-Ebene angibt.
viewPixelWidth
Erforderlich-
Eine Zahl, die die Pixelbreite der Ansichts-Ebene angibt.
Rückgabewert
Ein XREquirectLayer
Objekt.
Beispiele
Erstellen eines XREquirectLayer
Konfigurieren Sie die equirektangulare Ebene mithilfe der oben aufgeführten Eigenschaften in einem Aufruf von createEquirect()
. Um Ebenen dem XR-Gerät zu präsentieren, fügen Sie sie dem layers
-Renderzustand mithilfe von XRSession.updateRenderState()
hinzu.
function onXRSessionStarted(xrSession) {
const glCanvas = document.createElement("canvas");
const gl = glCanvas.getContext("webgl2", { xrCompatible: true });
const xrGlBinding = new XRWebGLBinding(xrSession, gl);
const equirectLayer = xrGlBinding.createEquirectLayer({
space: xrReferenceSpace,
viewPixelWidth: 1200,
viewPixelHeight: 600,
centralHorizontalAngle: 2 * Math.PI,
upperVerticalAngle: Math.PI / 2.0,
lowerVerticalAngle: -Math.PI / 2.0,
radius: 0,
});
xrSession.updateRenderState({
layers: [equirectLayer],
});
}
Spezifikationen
Specification |
---|
WebXR Layers API Level 1 # dom-xrwebglbinding-createequirectlayer |
Browser-Kompatibilität
BCD tables only load in the browser