A-Fram:
a-tetrahedron 四面體
a-octahedron 八面體
a-dodecahedron 十二面體
a-icosahedron 二十面體
            <!--        x  y  z             radius:半徑 默認值為1-->
<a-octahedron position="0 0 -10" color="red" radius="5">
</a-octahedron>

球體:
radius:半徑 默認值為1 球的大小
sphere 可代表球體或多面體，默認為球體
<!--                x y z                   半徑-->
<a-sphere position="0 0 -10" color="#363"   radius="3">
</a-sphere>

https://zptcsoft.github.io/vr/build/index2.html#scene-1
https://aframe.io/
https://threejs.org/examples/#webgl_loader_kmz
cdn: 
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/0.180.0/three.tsl.js" integrity="sha512-pVsOWriwN/5X/FWYhtqqQLnD+3cm8W1YqGrNrfkKgp+GMykFl7fZ0vorWpckUlZOVIG1tNVnI3D7T8DSea5TQg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
https://threejs.org/manual/#en/primitives

<!--1. 引入A-Frame库-->
<script src="js/aframe.min.js"></script>
<!--2. 添加a-scene，用来存放实体的容器-->
<a-scene>
   <!--3. 设置天空颜色-->
   <a-sky color="#eee"></a-sky>
</a-scene>


<!--添加實體方塊-->
<a-box position="0 0 -10"><a-box>


---------
nav a{
   color: #fff;
   text-decoration: none;
}
nav a:hover 觸碰{
   background-color: #fa0;
}

font-size 文字大小
font-decoration:none; 不要底線
margin : 0px 20px 0px 20px;
上右下左

环境光（AmbientLight）
平行光（DirectionalLight）
点光源(PointLight)
聚光灯（SpotLight）
材质平面（PlaneGeometry）用于接收（平行光和聚光灯的光源）

相機 四個參數
1.視野角度 45-75度之間 2. 縱橫比，網頁的實際高度，否則會變橢圓型
3.相機的可視範圍 小於0.1(太近)大於1000(太遠)的都看不見

https://sketchfab.com/feed

AR:
https://www.ansys.com/zh-tw/simulation-topics/what-is-augmented-reality

const cube = new THREE.Mesh(geometry,material);
geometry:幾何形狀  material物體的材質

boxGeometry立方體
sphereGeometry球體
coneGeometry圓錐體
CylinderGeometry圓柱體

const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshPhongMaterial({ color: 0x00ff00 });
const cube = new THREE.Mesh(geometry,material);
scene.add(cube);

cube.position.set(4,0,0);


cube.position.set(4,0,0);
position:物體的座標
cube.scale.multiplyScalar(3);
scale:物體的縮放
cube.rotation.y = Math.PI / 4
rotation:旋轉該物體
