1. Home
  2. Docs
  3. Verge3D用户手册
  4. 编程指南
  5. 编程基础

编程基础

本节的目的是为Verge3D做一个简要介绍。我们将首先使用旋转立方体创建新的应用程序。

准备工作

在使用Verge3D之前,您需要使用Verge3D App Manager创建一个新应用程序。

在Create new App面板上选择Custom App选项,然后单击Create App按钮。 App Manager创建以下HTML文件:

<!DOCTYPE html>
<html lang="en">
<head>
<title>Verge3D Application</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" type="text/css" href="my_awesome_app.css">
</head>
<body>
<div id="container"></div>
<script src="v3d.js"></script>
<script src="my_awesome_app.js"></script>
<script src="visual_logic.js"></script>
</body>
</html>
仅需以上代码。下面的所有代码都进入my_awesome_app.js脚本。  

创建App

要实际使用Verge3D显示内容,我们需要做三件事:创建一个新的App,加载你的glTF场景并启用基本控件:

'use strict';

window.addEventListener(‘load’, function() {

var app = new v3d.App(‘container’, null,
new v3d.SimplePreloader({ container: ‘container’ }));

var url = ‘template.gltf’;

app.load(url, function() {
app.enableControls();
runCode();
});

function runCode() {
// add you code here, e.g. console.log(‘Hello, World!’);

}

});

您可以通过几下几种方式扩展您的第一个程序:编辑场景,使用Verge3D拼图工具或使用JavaScript创建自己的代码。

Was this article helpful to you? Yes No 1