Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
Priyanka
ARNishat
Commits
401d35e5
Commit
401d35e5
authored
Jun 09, 2023
by
Priyanka
Browse files
Update index.html
parent
07b6de14
Pipeline
#7630
passed with stage
in 5 seconds
Changes
1
Pipelines
1
Show whitespace changes
Inline
Side-by-side
public/index.html
View file @
401d35e5
...
@@ -4,18 +4,16 @@
...
@@ -4,18 +4,16 @@
<meta
charset=
"UTF-8"
>
<meta
charset=
"UTF-8"
>
<meta
name=
"viewport"
<meta
name=
"viewport"
content=
"width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
>
content=
"width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
>
<title>
Hit to Plac
e Demo
</title>
<title>
spher
e Demo
</title>
<!-- three.js -->
<!-- three.js -->
<script
src=
"https://unpkg.com/three@0.126.0/build/three.js"
></script>
<script
src=
"https://unpkg.com/three@0.126.0/build/three.js"
></script>
<script
src=
"https://unpkg.com/three@0.126.0/examples/js/loaders/GLTFLoader.js"
></script>
</head>
</head>
<body>
<body>
<!-- Starting an immersive WebXR session requires user interaction.
<!-- Starting an immersive WebXR session requires user interaction.
We start this one with a simple button. -->
We start this one with a simple button. -->
<button
onclick=
"activateXR()"
>
Start
Hit to Plac
e Demo
</button>
<button
onclick=
"activateXR()"
>
Start
spher
e Demo
</button>
<script>
<script>
async
function
activateXR
()
{
async
function
activateXR
()
{
// Add a canvas element and initialize a WebGL context that is compatible with WebXR.
// Add a canvas element and initialize a WebGL context that is compatible with WebXR.
...
@@ -45,7 +43,7 @@ const camera = new THREE.PerspectiveCamera();
...
@@ -45,7 +43,7 @@ const camera = new THREE.PerspectiveCamera();
camera
.
matrixAutoUpdate
=
false
;
camera
.
matrixAutoUpdate
=
false
;
// Initialize a WebXR session using "immersive-ar".
// Initialize a WebXR session using "immersive-ar".
const
session
=
await
navigator
.
xr
.
requestSession
(
"
immersive-ar
"
,
{
requiredFeatures
:
[
'
hit-test
'
]}
);
const
session
=
await
navigator
.
xr
.
requestSession
(
"
immersive-ar
"
);
session
.
updateRenderState
({
session
.
updateRenderState
({
baseLayer
:
new
XRWebGLLayer
(
session
,
gl
)
baseLayer
:
new
XRWebGLLayer
(
session
,
gl
)
});
});
...
@@ -114,17 +112,12 @@ const onXRFrame = (time, frame) => {
...
@@ -114,17 +112,12 @@ const onXRFrame = (time, frame) => {
reticle
.
updateMatrixWorld
(
true
);
reticle
.
updateMatrixWorld
(
true
);
}
}
// Render the scene with THREE.WebGLRenderer.
// Render the scene with THREE.WebGLRenderer.
renderer
.
render
(
scene
,
camera
)
renderer
.
render
(
scene
,
camera
)
}
}
}
}
session
.
requestAnimationFrame
(
onXRFrame
);
session
.
requestAnimationFrame
(
onXRFrame
);
}
}
</script>
</script>
</body>
</body>
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment