Babylon.js

入門？プレイグラウンドを使用して、Babylon.jsAPIで直接プレイします。また、使い方を学ぶためのサンプルもたくさん含まれています。

質問は？こちらが公式フォーラムです。

CDN

• https://cdn.babylonjs.com/babylon.js
• https://cdn.babylonjs.com/babylon.max.js

追加のリファレンスはhttps://cdn.babylonjs.com/xxxにあります。ここで、はhttps://cdn.babylonjs.com/gui/babylon.gui.min.js

xxx

のような/distフォルダーにあるフォルダー構造です。

プレビューリリースの場合は、次のURLを使用します。

• https://preview.babylonjs.com/babylon.js
• https://preview.babylonjs.com/babylon.max.js

追加のリファレンスはhttps://preview.babylonjs.com/xxxにあります。ここで、xxxは、 https ： //preview.babylonjs.com/gui/babylon.guiのような/ dist/previewリリースフォルダーにあるフォルダー構造です。 .min.js

npm

BabylonJSとそのモジュールは、完全なタイピングサポートを備えたnpmで公開されています。インストールするには、次を使用します。

npm install babylonjs --save

これにより、以下を使用してBabylonJSを完全にインポートできます。
import * as BABYLON from 'babylonjs';
または以下を使用する個々のクラス：
import { Scene, Engine } from 'babylonjs';
tsconfig.json
TypeScriptを使用している場合は、 ：の「types」に「babylonjs」を追加することを忘れないでください。

    ...
    "types": [
        "babylonjs",
        "anotherAwesomeDependency"
    ],
    ...
モジュールを追加するには、それぞれのパッケージをインストールします。追加パッケージのリストとそのインストール手順は、npmのbabylonjsユーザーにあります。

使用法
はじめにを参照してください：
// Get the canvas DOM element
var canvas = document.getElementById('renderCanvas');
// Load the 3D engine
var engine = new BABYLON.Engine(canvas, true, {preserveDrawingBuffer: true, stencil: true});
// CreateScene function that creates and return the scene
var createScene = function(){
    // Create a basic BJS Scene object
    var scene = new BABYLON.Scene(engine);
    // Create a FreeCamera, and set its position to {x: 0, y: 5, z: -10}
    var camera = new BABYLON.FreeCamera('camera1', new BABYLON.Vector3(0, 5, -10), scene);
    // Target the camera to scene origin
    camera.setTarget(BABYLON.Vector3.Zero());
    // Attach the camera to the canvas
    camera.attachControl(canvas, false);
    // Create a basic light, aiming 0, 1, 0 - meaning, to the sky
    var light = new BABYLON.HemisphericLight('light1', new BABYLON.Vector3(0, 1, 0), scene);
    // Create a built-in "sphere" shape using the SphereBuilder
    var sphere = BABYLON.MeshBuilder.CreateSphere('sphere1', {segments: 16, diameter: 2, sideOrientation: BABYLON.Mesh.FRONTSIDE}, scene);
    // Move the sphere upward 1/2 of its height
    sphere.position.y = 1;
    // Create a built-in "ground" shape;
    var ground = BABYLON.MeshBuilder.CreateGround("ground1", { width: 6, height: 6, subdivisions: 2, updatable: false }, scene);
    // Return the created scene
    return scene;
}
// call the createScene function
var scene = createScene();
// run the render loop
engine.runRenderLoop(function(){
    scene.render();
});
// the canvas/window resize event handler
window.addEventListener('resize', function(){
    engine.resize();
});

貢献
貢献したい場合は、まず貢献ガイドラインをお読みください。

ドキュメンテーション

• ドキュメンテーション
• デモ

貢献

寄稿ガイドラインをご覧ください。

便利なリンク

• 公式ウェブサイト：www.babylonjs.com
• 実験して学ぶオンライン遊び場
• 単純なドラッグアンドドロップで.babylonおよびglTFシーンをテストできるオンラインサンドボックス
• GLSLシェーダーの作成方法を学ぶことができるオンラインシェーダー作成ツール
• 3DS Maxエクスポータを使用して、3DSMaxから.babylonファイルを生成できます。
• Mayaエクスポータを使用して、Mayaから.babylonファイルを生成できます。
• Blenderエクスポーターを使用してBlender3dから.babylonファイルを生成できます
• Unity 5 （非推奨）エクスポーターを使用して、Unity 5シーンエディターからジオメトリをエクスポートできます（アニメーションはサポートされています）
• KhronosGroupによるglTFツール

特徴

サポートされている機能の完全なリストを入手するには、当社のWebサイトにアクセスしてください。