iThreeJS
/
index.html

<!DOCTYPE html>

<html>
	<head>
		<meta charset="utf-8" />
		<title>iThreeJS - 3D数据可视化</title>
		<style type="text/css">
			* {margin:0;padding:0;}
			html, body {height:100%;background:url("./assets/img/datav-3d.jpg") no-repeat -15% bottom / 50% auto;}
			.flex-container {display:-webkit-flex;display:-ms-flexbox;display:flex;}
			.flex-item {flex:1;margin:25px;}
			h3 {font-size:16px;}
			ul {margin:15px;}
			ol {margin:0 15px;}
			li {line-height:2em;font-size:14px;}
			li.title {font-weight:bold;}
			a {text-decoration:none;color:#0366d6;}
			a:hover {text-decoration:underline;}
		</style>
	</head>

	<body>
		<div class="flex-container">
			<div class="flex-item">
				<h3>Quick Start</h3>
				<ul>
					<li><a href="./hello-webgl.html" target="_blank">Hello WebGL</a></li>
					<li><a href="./hello-threejs.html" target="_blank">Hello ThreeJS</a></li>
					<li><a href="./hello-thingjs.html" target="_blank">Hello ThingJS</a></li>
				</ul>
			</div>
			<div class="flex-item">
				<h3>Guidance Manual</h3>
				<ul>
					<li><a href="./tutorial/01-camera.html" target="_blank">照相机 Camera</a></li>
					<li><a href="./tutorial/02-geometry.html" target="_blank">几何体 Geometry</a></li>
					<li><a href="./tutorial/03-material.html" target="_blank">材质 Material</a></li>
					<li><a href="./tutorial/04-mesh.html" target="_blank">网格 Mesh</a></li>
					<li><a href="./tutorial/05-animation.html" target="_blank">动画 Animation</a></li>
					<li><a href="./tutorial/06-model.html" target="_blank">模型 Model</a></li>
					<li><a href="./tutorial/07-light.html" target="_blank">光照 Light</a></li>
					<li><a href="./tutorial/08-shader.html" target="_blank">着色器 Shader</a></li>
				</ul>
			</div>
			<div class="flex-item">
				<h3>Just Coding</h3>
				<ul>
					<li class="title">快速入门</li>
					<ol>
						<li><a href="./courses/chapt01/example01.html" target="_blank">创建第一个3D场景</a></li>
						<li><a href="./courses/chapt01/example02.html" target="_blank">查看几何体的线框模式</a></li>
						<li><a href="./courses/chapt01/example03.html" target="_blank">实现简单的动画效果</a></li>
						<li><a href="./courses/chapt01/example04.html" target="_blank">鼠标控制场景旋转和缩放</a></li>
						<li><a href="./courses/chapt01/example05.html" target="_blank">常用基础几何体</a></li>
						<li><a href="./courses/chapt01/example06.html" target="_blank">物体组合及辅助坐标系</a></li>
					</ol>
					<li class="title">加载模型</li>
					<ol>
						<li><a href="./courses/chapt02/example01.html" target="_blank">加载不带材质的3mf模型</a></li>
						<li><a href="./courses/chapt02/example02.html" target="_blank">加载带材质的3mf模型</a></li>
						<li><a href="./courses/chapt02/example03.html" target="_blank">加载不带材质的obj模型</a></li>
						<li><a href="./courses/chapt02/example04.html" target="_blank">加载带材质的obj模型</a></li>
					</ol>
				</ul>
			</div>
			<div class="flex-item">
				<h3>ThreeJS Cases</h3>
				<ul>
					<li><a href="https://demos.littleworkshop.fr/infinitown" target="_blank">无限城市</a></li>
					<li><a href="http://vr.ff.com/us/" target="_blank">FF 91 VR</a></li>
					<li><a href="http://www.hewebgl.com/code/show/9.html" target="_blank">怪兽换装</a></li>
					<li><a href="http://www.hewebgl.com/code/show/4.html" target="_blank">元素周期表</a></li>
					<li><a href="https://akirodic.com/p/jellyfish/" target="_blank">水母</a></li>
					<li><a href="http://www.yanhuangxueyuan.com/3D/liangcang/index.html" target="_blank">3D粮仓模型</a></li>
					<li><a href="http://www.yanhuangxueyuan.com/3D/wopen/index.html" target="_blank">3D涡轮模型</a></li>
				</ul>
			</div>
			<div class="flex-item">
				<h3>ThingJS Cases</h3>
				<ul>
					<li><a href="https://www.thingjs.com/guide/sampleindex.html?name=/uploads/wechat/oLX7p01p-lBQeR49wRF5j_ox3X3U/ShenzhenCityBuilder.js" target="_blank">智慧城市</a></li>
					<li><a href="https://www.thingjs.com/p/44dd0e233a95d1ed16b628e5" target="_blank">智慧园区</a></li>
					<li><a href="https://www.thingjs.com/demos/menu.html?name=uBuilding" target="_blank">建筑监控</a></li>
					<li><a href="https://www.thingjs.com/static/demos/%E8%BD%A6%E9%97%B4demo/index.html" target="_blank">生产车间</a></li>
					<li><a href="https://www.thingjs.com/demos/menu.html?name=silohouse" target="_blank">3D粮仓模型</a></li>
				</ul>
			</div>
		</div>
	</body>
</html>