mirror of
https://github.com/kevin-DL/gyk-ar.git
synced 2026-01-11 18:44:33 +00:00
Ported over the results from the previous attempt
This commit is contained in:
49
css/index.css
Normal file
49
css/index.css
Normal file
@@ -0,0 +1,49 @@
|
|||||||
|
*,
|
||||||
|
html {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
min-height: 100vh;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-title {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.experiment {
|
||||||
|
border: 1px solid black;
|
||||||
|
border-radius: 3px;
|
||||||
|
min-height: 2rem;
|
||||||
|
margin: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.experiment-thumbnail {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.experiment-thumbnail__image {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.experiment-thumbnail__caption {
|
||||||
|
color: white;
|
||||||
|
background-image: linear-gradient(to right, black, #fefefe);
|
||||||
|
transition: all 0.5s;
|
||||||
|
opacity: 0;
|
||||||
|
padding: 2rem 0 0 0;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
text-align: center;
|
||||||
|
height: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.experiment-thumbnail__image:hover + .experiment-thumbnail__caption {
|
||||||
|
/* position: absolute; */
|
||||||
|
/* bottom: 3rem; */
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
25
index.html
25
index.html
@@ -4,9 +4,32 @@
|
|||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
|
<link rel="stylesheet" href="css/index.css" />
|
||||||
<title>Document</title>
|
<title>Document</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Hello World!</h1>
|
<main>
|
||||||
|
<h1 class="main-title">AR Experiments</h1>
|
||||||
|
<article class="experiment">
|
||||||
|
<a href="/pages/first.html">
|
||||||
|
<h1>First Experiment</h1>
|
||||||
|
</a>
|
||||||
|
</article>
|
||||||
|
<article class="experiment">
|
||||||
|
<a href="/pages/second.html">
|
||||||
|
<h1>Second Experiment</h1>
|
||||||
|
</a>
|
||||||
|
</article>
|
||||||
|
<article class="experiment">
|
||||||
|
<a href="/pages/third.html">
|
||||||
|
<h1>Third Experiment</h1>
|
||||||
|
</a>
|
||||||
|
</article>
|
||||||
|
<article class="experiment">
|
||||||
|
<a href="/pages/fourth.html">
|
||||||
|
<h1>Fourth Experiment</h1>
|
||||||
|
</a>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
BIN
models/earthquake/scene.bin
Normal file
BIN
models/earthquake/scene.bin
Normal file
Binary file not shown.
19911
models/earthquake/scene.gltf
Normal file
19911
models/earthquake/scene.gltf
Normal file
File diff suppressed because it is too large
Load Diff
BIN
models/scene.bin
Normal file
BIN
models/scene.bin
Normal file
Binary file not shown.
433
models/scene.gltf
Normal file
433
models/scene.gltf
Normal file
@@ -0,0 +1,433 @@
|
|||||||
|
{
|
||||||
|
"accessors": [
|
||||||
|
{
|
||||||
|
"bufferView": 2,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 65533,
|
||||||
|
"max": [
|
||||||
|
1,
|
||||||
|
0.45433899760246277,
|
||||||
|
0.255746990442276
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
-1,
|
||||||
|
-0.46420601010322571,
|
||||||
|
-0.255746990442276
|
||||||
|
],
|
||||||
|
"type": "VEC3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 2,
|
||||||
|
"byteOffset": 786396,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 65533,
|
||||||
|
"max": [
|
||||||
|
1,
|
||||||
|
1,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
-1,
|
||||||
|
-1,
|
||||||
|
-1
|
||||||
|
],
|
||||||
|
"type": "VEC3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 3,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 65533,
|
||||||
|
"max": [
|
||||||
|
0.99999332427978516,
|
||||||
|
1,
|
||||||
|
1,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
-0.99999284744262695,
|
||||||
|
-1,
|
||||||
|
-1,
|
||||||
|
-1
|
||||||
|
],
|
||||||
|
"type": "VEC4"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 2,
|
||||||
|
"byteOffset": 1572792,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 65533,
|
||||||
|
"max": [
|
||||||
|
1,
|
||||||
|
1,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
0
|
||||||
|
],
|
||||||
|
"type": "VEC3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 1,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 65533,
|
||||||
|
"max": [
|
||||||
|
1,
|
||||||
|
0.99972999095916748
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
0,
|
||||||
|
-0.00017786500393413007
|
||||||
|
],
|
||||||
|
"type": "VEC2"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 0,
|
||||||
|
"componentType": 5125,
|
||||||
|
"count": 218991,
|
||||||
|
"max": [
|
||||||
|
65532
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
0
|
||||||
|
],
|
||||||
|
"type": "SCALAR"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 2,
|
||||||
|
"byteOffset": 2359188,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 10843,
|
||||||
|
"max": [
|
||||||
|
0.95011097192764282,
|
||||||
|
0.46420601010322571,
|
||||||
|
0.255746990442276
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
-1,
|
||||||
|
-0.46419298648834229,
|
||||||
|
-0.255746990442276
|
||||||
|
],
|
||||||
|
"type": "VEC3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 2,
|
||||||
|
"byteOffset": 2489304,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 10843,
|
||||||
|
"max": [
|
||||||
|
0.99987876415252686,
|
||||||
|
1,
|
||||||
|
0.99999862909317017
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
-0.99986833333969116,
|
||||||
|
-1,
|
||||||
|
-0.99998664855957031
|
||||||
|
],
|
||||||
|
"type": "VEC3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 3,
|
||||||
|
"byteOffset": 1048528,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 10843,
|
||||||
|
"max": [
|
||||||
|
0.99977433681488037,
|
||||||
|
0.99956262111663818,
|
||||||
|
0.99991995096206665,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
-0.99999654293060303,
|
||||||
|
-0.9999845027923584,
|
||||||
|
-1,
|
||||||
|
-1
|
||||||
|
],
|
||||||
|
"type": "VEC4"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 2,
|
||||||
|
"byteOffset": 2619420,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 10843,
|
||||||
|
"max": [
|
||||||
|
1,
|
||||||
|
1,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
0,
|
||||||
|
0.062745101749897003,
|
||||||
|
0
|
||||||
|
],
|
||||||
|
"type": "VEC3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 1,
|
||||||
|
"byteOffset": 524264,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 10843,
|
||||||
|
"max": [
|
||||||
|
0.99882298707962036,
|
||||||
|
0.99638700485229492
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
0,
|
||||||
|
0
|
||||||
|
],
|
||||||
|
"type": "VEC2"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 0,
|
||||||
|
"byteOffset": 875964,
|
||||||
|
"componentType": 5125,
|
||||||
|
"count": 29787,
|
||||||
|
"max": [
|
||||||
|
10842
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
0
|
||||||
|
],
|
||||||
|
"type": "SCALAR"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"asset": {
|
||||||
|
"extras": {
|
||||||
|
"author": "berkgedik (https://sketchfab.com/berkgedik)",
|
||||||
|
"license": "CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)",
|
||||||
|
"source": "https://sketchfab.com/3d-models/cyberpunk-bike-concept-design-99290272e69d4cd8a56af2d2e1274e0d",
|
||||||
|
"title": "Cyberpunk Bike Concept Design"
|
||||||
|
},
|
||||||
|
"generator": "Sketchfab-5.76.0",
|
||||||
|
"version": "2.0"
|
||||||
|
},
|
||||||
|
"bufferViews": [
|
||||||
|
{
|
||||||
|
"buffer": 0,
|
||||||
|
"byteLength": 995112,
|
||||||
|
"byteOffset": 0,
|
||||||
|
"name": "floatBufferViews",
|
||||||
|
"target": 34963
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"buffer": 0,
|
||||||
|
"byteLength": 611008,
|
||||||
|
"byteOffset": 995112,
|
||||||
|
"byteStride": 8,
|
||||||
|
"name": "floatBufferViews",
|
||||||
|
"target": 34962
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"buffer": 0,
|
||||||
|
"byteLength": 2749536,
|
||||||
|
"byteOffset": 1606120,
|
||||||
|
"byteStride": 12,
|
||||||
|
"name": "floatBufferViews",
|
||||||
|
"target": 34962
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"buffer": 0,
|
||||||
|
"byteLength": 1222016,
|
||||||
|
"byteOffset": 4355656,
|
||||||
|
"byteStride": 16,
|
||||||
|
"name": "floatBufferViews",
|
||||||
|
"target": 34962
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"buffers": [
|
||||||
|
{
|
||||||
|
"byteLength": 5577672,
|
||||||
|
"uri": "scene.bin"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"images": [
|
||||||
|
{
|
||||||
|
"uri": "textures/DefaultMaterial_baseColor.jpeg"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"uri": "textures/DefaultMaterial_metallicRoughness.png"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"uri": "textures/DefaultMaterial_emissive.jpeg"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"uri": "textures/DefaultMaterial_normal.png"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"materials": [
|
||||||
|
{
|
||||||
|
"doubleSided": true,
|
||||||
|
"emissiveFactor": [
|
||||||
|
1,
|
||||||
|
1,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"emissiveTexture": {
|
||||||
|
"index": 2,
|
||||||
|
"texCoord": 0
|
||||||
|
},
|
||||||
|
"name": "DefaultMaterial",
|
||||||
|
"normalTexture": {
|
||||||
|
"index": 3,
|
||||||
|
"scale": 1,
|
||||||
|
"texCoord": 0
|
||||||
|
},
|
||||||
|
"occlusionTexture": {
|
||||||
|
"index": 1,
|
||||||
|
"strength": 1,
|
||||||
|
"texCoord": 0
|
||||||
|
},
|
||||||
|
"pbrMetallicRoughness": {
|
||||||
|
"baseColorFactor": [
|
||||||
|
1,
|
||||||
|
1,
|
||||||
|
1,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"baseColorTexture": {
|
||||||
|
"index": 0,
|
||||||
|
"texCoord": 0
|
||||||
|
},
|
||||||
|
"metallicFactor": 1,
|
||||||
|
"metallicRoughnessTexture": {
|
||||||
|
"index": 1,
|
||||||
|
"texCoord": 0
|
||||||
|
},
|
||||||
|
"roughnessFactor": 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"meshes": [
|
||||||
|
{
|
||||||
|
"name": "defaultMaterial",
|
||||||
|
"primitives": [
|
||||||
|
{
|
||||||
|
"attributes": {
|
||||||
|
"COLOR_0": 3,
|
||||||
|
"NORMAL": 1,
|
||||||
|
"POSITION": 0,
|
||||||
|
"TANGENT": 2,
|
||||||
|
"TEXCOORD_0": 4
|
||||||
|
},
|
||||||
|
"indices": 5,
|
||||||
|
"material": 0,
|
||||||
|
"mode": 4
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "defaultMaterial",
|
||||||
|
"primitives": [
|
||||||
|
{
|
||||||
|
"attributes": {
|
||||||
|
"COLOR_0": 9,
|
||||||
|
"NORMAL": 7,
|
||||||
|
"POSITION": 6,
|
||||||
|
"TANGENT": 8,
|
||||||
|
"TEXCOORD_0": 10
|
||||||
|
},
|
||||||
|
"indices": 11,
|
||||||
|
"material": 0,
|
||||||
|
"mode": 4
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"nodes": [
|
||||||
|
{
|
||||||
|
"children": [
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"name": "RootNode (gltf orientation matrix)",
|
||||||
|
"rotation": [
|
||||||
|
-0.70710678118654746,
|
||||||
|
-0,
|
||||||
|
-0,
|
||||||
|
0.70710678118654757
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"children": [
|
||||||
|
2
|
||||||
|
],
|
||||||
|
"name": "RootNode (model correction matrix)"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"children": [
|
||||||
|
3
|
||||||
|
],
|
||||||
|
"matrix": [
|
||||||
|
1,
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
-4.3711390063094768e-08,
|
||||||
|
0.999999999999999,
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
-0.999999999999999,
|
||||||
|
-4.3711390063094768e-08,
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"name": "Collada visual scene group"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"children": [
|
||||||
|
4,
|
||||||
|
5
|
||||||
|
],
|
||||||
|
"name": "Circle.003"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"mesh": 0,
|
||||||
|
"name": "defaultMaterial"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"mesh": 1,
|
||||||
|
"name": "defaultMaterial"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"samplers": [
|
||||||
|
{
|
||||||
|
"magFilter": 9729,
|
||||||
|
"minFilter": 9987,
|
||||||
|
"wrapS": 10497,
|
||||||
|
"wrapT": 10497
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"scene": 0,
|
||||||
|
"scenes": [
|
||||||
|
{
|
||||||
|
"name": "OSG_Scene",
|
||||||
|
"nodes": [
|
||||||
|
0
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"textures": [
|
||||||
|
{
|
||||||
|
"sampler": 0,
|
||||||
|
"source": 0
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"sampler": 0,
|
||||||
|
"source": 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"sampler": 0,
|
||||||
|
"source": 2
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"sampler": 0,
|
||||||
|
"source": 3
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
BIN
models/scene_girl/scene.bin
Normal file
BIN
models/scene_girl/scene.bin
Normal file
Binary file not shown.
235
models/scene_girl/scene.gltf
Normal file
235
models/scene_girl/scene.gltf
Normal file
@@ -0,0 +1,235 @@
|
|||||||
|
{
|
||||||
|
"accessors": [
|
||||||
|
{
|
||||||
|
"bufferView": 2,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 7665,
|
||||||
|
"max": [
|
||||||
|
37.029399871826172,
|
||||||
|
22.239500045776367,
|
||||||
|
64.155502319335938
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
-37.234600067138672,
|
||||||
|
-7.9264001846313477,
|
||||||
|
-0.063299998641014099
|
||||||
|
],
|
||||||
|
"type": "VEC3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 2,
|
||||||
|
"byteOffset": 91980,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 7665,
|
||||||
|
"max": [
|
||||||
|
0.99967199563980103,
|
||||||
|
0.99976259469985962,
|
||||||
|
0.99999856948852539
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
-0.99967199563980103,
|
||||||
|
-0.99982327222824097,
|
||||||
|
-0.99999487400054932
|
||||||
|
],
|
||||||
|
"type": "VEC3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 3,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 7665,
|
||||||
|
"max": [
|
||||||
|
0.9998440146446228,
|
||||||
|
0.999897301197052,
|
||||||
|
0.99903565645217896,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
-1,
|
||||||
|
-0.99989306926727295,
|
||||||
|
-0.99960505962371826,
|
||||||
|
-1
|
||||||
|
],
|
||||||
|
"type": "VEC4"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 1,
|
||||||
|
"componentType": 5126,
|
||||||
|
"count": 7665,
|
||||||
|
"max": [
|
||||||
|
0.99800002574920654,
|
||||||
|
0.99589997529983521
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
0.0031000000890344381,
|
||||||
|
0.0046000001020729542
|
||||||
|
],
|
||||||
|
"type": "VEC2"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"bufferView": 0,
|
||||||
|
"componentType": 5125,
|
||||||
|
"count": 36210,
|
||||||
|
"max": [
|
||||||
|
7664
|
||||||
|
],
|
||||||
|
"min": [
|
||||||
|
0
|
||||||
|
],
|
||||||
|
"type": "SCALAR"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"asset": {
|
||||||
|
"extras": {
|
||||||
|
"author": "vonlogger.md (https://sketchfab.com/vonlogger.md)",
|
||||||
|
"license": "CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)",
|
||||||
|
"source": "https://sketchfab.com/3d-models/scene-girl-60081aed7fba4320a665e919c2613b11",
|
||||||
|
"title": "Scene girl"
|
||||||
|
},
|
||||||
|
"generator": "Sketchfab-5.80.0",
|
||||||
|
"version": "2.0"
|
||||||
|
},
|
||||||
|
"bufferViews": [
|
||||||
|
{
|
||||||
|
"buffer": 0,
|
||||||
|
"byteLength": 144840,
|
||||||
|
"byteOffset": 0,
|
||||||
|
"name": "floatBufferViews",
|
||||||
|
"target": 34963
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"buffer": 0,
|
||||||
|
"byteLength": 61320,
|
||||||
|
"byteOffset": 144840,
|
||||||
|
"byteStride": 8,
|
||||||
|
"name": "floatBufferViews",
|
||||||
|
"target": 34962
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"buffer": 0,
|
||||||
|
"byteLength": 183960,
|
||||||
|
"byteOffset": 206160,
|
||||||
|
"byteStride": 12,
|
||||||
|
"name": "floatBufferViews",
|
||||||
|
"target": 34962
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"buffer": 0,
|
||||||
|
"byteLength": 122640,
|
||||||
|
"byteOffset": 390120,
|
||||||
|
"byteStride": 16,
|
||||||
|
"name": "floatBufferViews",
|
||||||
|
"target": 34962
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"buffers": [
|
||||||
|
{
|
||||||
|
"byteLength": 512760,
|
||||||
|
"uri": "scene.bin"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"images": [
|
||||||
|
{
|
||||||
|
"uri": "textures/DefaultMaterial_baseColor.png"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"materials": [
|
||||||
|
{
|
||||||
|
"doubleSided": true,
|
||||||
|
"emissiveFactor": [
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
0
|
||||||
|
],
|
||||||
|
"emissiveTexture": {
|
||||||
|
"index": 0,
|
||||||
|
"texCoord": 0
|
||||||
|
},
|
||||||
|
"name": "DefaultMaterial",
|
||||||
|
"pbrMetallicRoughness": {
|
||||||
|
"baseColorFactor": [
|
||||||
|
1,
|
||||||
|
1,
|
||||||
|
1,
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"baseColorTexture": {
|
||||||
|
"index": 0,
|
||||||
|
"texCoord": 0
|
||||||
|
},
|
||||||
|
"metallicFactor": 0,
|
||||||
|
"roughnessFactor": 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"meshes": [
|
||||||
|
{
|
||||||
|
"primitives": [
|
||||||
|
{
|
||||||
|
"attributes": {
|
||||||
|
"NORMAL": 1,
|
||||||
|
"POSITION": 0,
|
||||||
|
"TANGENT": 2,
|
||||||
|
"TEXCOORD_0": 3
|
||||||
|
},
|
||||||
|
"indices": 4,
|
||||||
|
"material": 0,
|
||||||
|
"mode": 4
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"nodes": [
|
||||||
|
{
|
||||||
|
"children": [
|
||||||
|
1
|
||||||
|
],
|
||||||
|
"name": "RootNode (gltf orientation matrix)",
|
||||||
|
"rotation": [
|
||||||
|
-0.70710678118654746,
|
||||||
|
-0,
|
||||||
|
-0,
|
||||||
|
0.70710678118654757
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"children": [
|
||||||
|
2
|
||||||
|
],
|
||||||
|
"name": "RootNode (model correction matrix)"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"children": [
|
||||||
|
3
|
||||||
|
],
|
||||||
|
"name": "High Command Katarina.obj.cleaner.materialmerger.gles"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"mesh": 0,
|
||||||
|
"name": ""
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"samplers": [
|
||||||
|
{
|
||||||
|
"magFilter": 9729,
|
||||||
|
"minFilter": 9987,
|
||||||
|
"wrapS": 10497,
|
||||||
|
"wrapT": 10497
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"scene": 0,
|
||||||
|
"scenes": [
|
||||||
|
{
|
||||||
|
"name": "OSG_Scene",
|
||||||
|
"nodes": [
|
||||||
|
0
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"textures": [
|
||||||
|
{
|
||||||
|
"sampler": 0,
|
||||||
|
"source": 0
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
BIN
models/scene_girl/textures/DefaultMaterial_baseColor.png
Normal file
BIN
models/scene_girl/textures/DefaultMaterial_baseColor.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 140 KiB |
BIN
models/skene3/scene.bin
Normal file
BIN
models/skene3/scene.bin
Normal file
Binary file not shown.
5742
models/skene3/scene.gltf
Normal file
5742
models/skene3/scene.gltf
Normal file
File diff suppressed because it is too large
Load Diff
BIN
models/textures/DefaultMaterial_baseColor.jpeg
Normal file
BIN
models/textures/DefaultMaterial_baseColor.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.5 MiB |
BIN
models/textures/DefaultMaterial_emissive.jpeg
Normal file
BIN
models/textures/DefaultMaterial_emissive.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 223 KiB |
BIN
models/textures/DefaultMaterial_metallicRoughness.png
Normal file
BIN
models/textures/DefaultMaterial_metallicRoughness.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 MiB |
BIN
models/textures/DefaultMaterial_normal.png
Normal file
BIN
models/textures/DefaultMaterial_normal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 MiB |
44
pages/first.html
Normal file
44
pages/first.html
Normal file
@@ -0,0 +1,44 @@
|
|||||||
|
<html>
|
||||||
|
<script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>
|
||||||
|
<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.7.5/aframe/build/aframe-ar.js"></script>
|
||||||
|
<!-- <script src="./assets/three.js"></script>
|
||||||
|
<script src="./assets/draco.js"></script> -->
|
||||||
|
|
||||||
|
<body style="margin : 0px; overflow: hidden;">
|
||||||
|
<a-scene embedded
|
||||||
|
arjs="trackingMethod: best; debugUIEnabled: false sourceType: webcam; detectionMode: mono_and_matrix; matrixCodeType: 3x3;">
|
||||||
|
<!-- <a-anchor hit-testing-enabled="true">
|
||||||
|
</a-anchor> -->
|
||||||
|
<a-marker type="barcode" value="5">
|
||||||
|
<a-box material="opacity: 0.5; side:double; color:red;">
|
||||||
|
<a-text value="Hello, World!"></a-text>
|
||||||
|
</a-box>
|
||||||
|
<a-box material="opacity: 0.5; side:double; color:yellow;" position="1 1 1">
|
||||||
|
<a-text value="Hello, World!"></a-text>
|
||||||
|
</a-box>
|
||||||
|
</a-marker>
|
||||||
|
|
||||||
|
<a-marker type="barcode" value="0">
|
||||||
|
<a-box position="0 1.6 0" animation="property: position; to: 5 1.6 0; dur: 1500; easing: linear"></a-box>
|
||||||
|
<a-entity id="mouseCursor" cursor="rayOrigin: mouse"></a-entity>-->
|
||||||
|
<a-sphere id="sphere" cursor-listener material='opacity: 1; color:red;' position="0 1 0"
|
||||||
|
animation="property: position; to: 0 2 0; dur: 1500; easing: easeInOutCirc; delay:1000; loop: true; dir: alternate; ">
|
||||||
|
-->
|
||||||
|
<!-- <a-animation attribute="position" dur="1000" from="0 1 0" to="0 20 3" repeat="indefinite"></a-animation> -->
|
||||||
|
<a-text value="Wazaa"></a-text>
|
||||||
|
</a-box>
|
||||||
|
</a-marker>
|
||||||
|
|
||||||
|
<a-marker type="barcode" value="1">
|
||||||
|
<a-plane color="#ccc" height="20" width="20" rotation="-45 0 0" scale="0.3 0.3 0.3">
|
||||||
|
<a-text value="TDD" color="#000"></a-text>
|
||||||
|
</a-plane>
|
||||||
|
</a-marker>
|
||||||
|
<!-- <a-camera-static/> -->
|
||||||
|
<a-entity camera look-controls></a-entity>
|
||||||
|
</a-scene>
|
||||||
|
<script>
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
41
pages/fourth.html
Normal file
41
pages/fourth.html
Normal file
@@ -0,0 +1,41 @@
|
|||||||
|
<html>
|
||||||
|
<script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>
|
||||||
|
<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.7.5/aframe/build/aframe-ar.js"></script>
|
||||||
|
<script src="//cdn.rawgit.com/donmccurdy/aframe-extras/v6.0.0/dist/aframe-extras.min.js"></script>
|
||||||
|
<!-- <script src="./assets/three.js"></script>
|
||||||
|
<script src="./assets/draco.js"></script> -->
|
||||||
|
|
||||||
|
<body style="margin : 0px; overflow: hidden;">
|
||||||
|
<a-scene embedded
|
||||||
|
arjs="trackingMethod: best; debugUIEnabled: false sourceType: webcam; detectionMode: mono_and_matrix; matrixCodeType: 3x3;">
|
||||||
|
<a-assets>
|
||||||
|
<a-asset-item id="bike" src="/models/scene.gltf">
|
||||||
|
<a-asset-item id="girl" src="/models/scene_girl/scene.gltf">
|
||||||
|
<a-asset-item id="skene" src="/models/skene3/scene.gltf"></a-asset-item>
|
||||||
|
</a-assets>
|
||||||
|
|
||||||
|
<!-- Using the asset management system. -->
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Defining the URL inline. Not recommended but more comfortable for web developers. -->
|
||||||
|
<!-- <a-gltf-model src="models/scene.gltf"></a-gltf-model> -->
|
||||||
|
<a-marker markerhandler id="animated-marker" emitevents="true" cursor="rayOrigin: mouse"
|
||||||
|
raycaster="objects: .clickable" type="barcode" value="0">
|
||||||
|
<!-- <a-entity gltf-model="#earthquake" scale="0.01 0.01 0.01" animation-mixer></a-entity> -->
|
||||||
|
<a-entity id="skeneObject" gltf-model="#skene" scale="0.1 0.1 0.1" animation-mixer position="-1 0 0">
|
||||||
|
</a-entity>
|
||||||
|
<!-- <a-entity gltf-model="#bike" scale="0.5 0.5 0.5" animation-mixer></a-entity>
|
||||||
|
<a-entity gltf-model="#girl" scale="0.01 0.01 0.01" position="0 0 0" rotation="0 90 0" animation-mixer></a-entity> -->
|
||||||
|
</a-marker>
|
||||||
|
<a-entity camera></a-entity>
|
||||||
|
</a-scene>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
setTimeout(() => {
|
||||||
|
console.log(document.querySelector("#skeneObject"))
|
||||||
|
// const entity = document.querySelector("#skene").play()
|
||||||
|
}, 3000);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
55
pages/second.html
Normal file
55
pages/second.html
Normal file
@@ -0,0 +1,55 @@
|
|||||||
|
<html>
|
||||||
|
<script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>
|
||||||
|
<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.7.5/aframe/build/aframe-ar.js"></script>
|
||||||
|
<!-- <script src="./assets/three.js"></script>
|
||||||
|
<script src="./assets/draco.js"></script> -->
|
||||||
|
|
||||||
|
<body style="margin : 0px; overflow: hidden;">
|
||||||
|
<a-scene
|
||||||
|
embedded
|
||||||
|
arjs="trackingMethod: best; debugUIEnabled: false sourceType: webcam; detectionMode: mono_and_matrix; matrixCodeType: 3x3;"
|
||||||
|
>
|
||||||
|
<a-marker type="barcode" value="5">
|
||||||
|
<a-box material="opacity: 0.5; side:double; color:red;">
|
||||||
|
<a-text value="Hello, World!"></a-text>
|
||||||
|
</a-box>
|
||||||
|
<a-box
|
||||||
|
material="opacity: 0.5; side:double; color:yellow;"
|
||||||
|
position="1 1 1"
|
||||||
|
>
|
||||||
|
<a-text value="Hello, World!"></a-text>
|
||||||
|
</a-box>
|
||||||
|
</a-marker>
|
||||||
|
|
||||||
|
<a-marker type="barcode" value="0">
|
||||||
|
<a-box
|
||||||
|
position="0 1.6 0"
|
||||||
|
animation="property: position; to: 5 1.6 0; dur: 1500; easing: linear"
|
||||||
|
></a-box>
|
||||||
|
<a-sphere
|
||||||
|
id="sphere"
|
||||||
|
cursor-listener
|
||||||
|
material="opacity: 0.5; color:red;"
|
||||||
|
position="0 1 0"
|
||||||
|
animation="property: position; to: 0 2 0; dur: 1500; easing: easeInOutCirc; delay:1000; loop: true; dir: alternate; "
|
||||||
|
>
|
||||||
|
<a-text value="Wazaa"></a-text>
|
||||||
|
</a-sphere>
|
||||||
|
</a-marker>
|
||||||
|
|
||||||
|
<a-marker type="barcode" value="1">
|
||||||
|
<a-plane
|
||||||
|
color="#ccc"
|
||||||
|
height="20"
|
||||||
|
width="20"
|
||||||
|
rotation="-45 0 0"
|
||||||
|
scale="0.3 0.3 0.3"
|
||||||
|
>
|
||||||
|
<a-text value="TDD" color="#000"></a-text>
|
||||||
|
</a-plane>
|
||||||
|
</a-marker>
|
||||||
|
<!-- <a-camera-static/> -->
|
||||||
|
<a-entity camera></a-entity>
|
||||||
|
</a-scene>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
89
pages/third.html
Normal file
89
pages/third.html
Normal file
@@ -0,0 +1,89 @@
|
|||||||
|
<html>
|
||||||
|
<script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>
|
||||||
|
<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.7.5/aframe/build/aframe-ar.js"></script>
|
||||||
|
<!-- <script src="./assets/three.js"></script>
|
||||||
|
<script src="./assets/draco.js"></script> -->
|
||||||
|
|
||||||
|
<body style="margin : 0px; overflow: hidden;">
|
||||||
|
<script>
|
||||||
|
AFRAME.registerComponent("markerhandler", {
|
||||||
|
init: function() {
|
||||||
|
const animatedMarker = document.querySelector("#animated-marker");
|
||||||
|
// every click, we make our model grow in size :)
|
||||||
|
animatedMarker.addEventListener("click", function(ev, target) {
|
||||||
|
const intersectedElement =
|
||||||
|
ev && ev.detail && ev.detail.intersectedEl;
|
||||||
|
const aEntity = document.querySelector("#sphere");
|
||||||
|
const yellowSphere = document.querySelector("#yellow-sphere");
|
||||||
|
if (intersectedElement !== undefined) {
|
||||||
|
if (aEntity && intersectedElement === aEntity) {
|
||||||
|
const scale = aEntity.getAttribute("scale");
|
||||||
|
Object.keys(scale).forEach(
|
||||||
|
key => (scale[key] = scale[key] + 1)
|
||||||
|
);
|
||||||
|
aEntity.setAttribute("scale", scale);
|
||||||
|
const material = aEntity.getAttribute("material");
|
||||||
|
Object.keys(material).forEach(key => {
|
||||||
|
if (key === "color") {
|
||||||
|
material[key] = "green";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
aEntity.setAttribute("material", material);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (yellowSphere && intersectedElement === yellowSphere) {
|
||||||
|
const material = yellowSphere.getAttribute("material");
|
||||||
|
Object.keys(material).forEach(key => {
|
||||||
|
if (key === "color") {
|
||||||
|
if (material[key] != "green") {
|
||||||
|
material[key] = "green";
|
||||||
|
} else {
|
||||||
|
material[key] = "red";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
yellowSphere.setAttribute("material", material);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<a-scene
|
||||||
|
embedded
|
||||||
|
arjs="trackingMethod: best; debugUIEnabled: false sourceType: webcam; detectionMode: mono_and_matrix; matrixCodeType: 3x3;"
|
||||||
|
>
|
||||||
|
<a-marker
|
||||||
|
markerhandler
|
||||||
|
id="animated-marker"
|
||||||
|
emitevents="true"
|
||||||
|
cursor="rayOrigin: mouse"
|
||||||
|
raycaster="objects: .clickable"
|
||||||
|
type="barcode"
|
||||||
|
value="0"
|
||||||
|
>
|
||||||
|
<a-entity
|
||||||
|
id="sphere"
|
||||||
|
class="clickable"
|
||||||
|
geometry="primitive: box"
|
||||||
|
material="opacity: 0.5; color:black;"
|
||||||
|
animation__mouseenter="property: components.material.material.color; type: color; to: blue; startEvents: colorChange; dur: 500"
|
||||||
|
animation__mouseenter="property: components.material.material.color; type: color; to: green; startEvents: touchstart; dur: 500"
|
||||||
|
;
|
||||||
|
></a-entity>
|
||||||
|
|
||||||
|
<a-entity
|
||||||
|
id="yellow-sphere"
|
||||||
|
geometry="primitive: box"
|
||||||
|
class="clickable"
|
||||||
|
material="opacity: 0.5; color:yellow;"
|
||||||
|
animation__mouseenter="property: components.material.material.color; type: color; to: blue; startEvents: colorChange; dur: 500"
|
||||||
|
animation__mouseenter="property: components.material.material.color; type: color; to: green; startEvents: touchstart; dur: 500"
|
||||||
|
position="-3 0 0"
|
||||||
|
;
|
||||||
|
></a-entity>
|
||||||
|
</a-marker>
|
||||||
|
<a-entity camera></a-entity>
|
||||||
|
</a-scene>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user