Spaces:
Running
Running
| <html> | |
| <head> | |
| <title>DNA Sequence</title> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <script src="https://cdn.babylonjs.com/babylon.js"></script> | |
| <script src="https://cdn.babylonjs.com/loaders/babylonjs.loaders.min.js"></script> | |
| </head> | |
| <body> | |
| <canvas id="renderCanvas"></canvas> | |
| <script> | |
| var canvas = document.getElementById("renderCanvas"); | |
| var engine = new BABYLON.Engine(canvas, true); | |
| var createScene = function () { | |
| var scene = new BABYLON.Scene(engine); | |
| var camera = new BABYLON.ArcRotateCamera("Camera", -Math.PI / 2, Math.PI / 2, 10, BABYLON.Vector3.Zero(), scene); | |
| camera.attachControl(canvas, true); | |
| // Create a DNA strand | |
| var dnaStrand = BABYLON.MeshBuilder.CreateTube("dnaStrand", { | |
| path: [ | |
| new BABYLON.Vector3(0, 0, 0), | |
| new BABYLON.Vector3(0, 2, 0), | |
| new BABYLON.Vector3(2, 2, 0), | |
| new BABYLON.Vector3(2, 0, 0), | |
| new BABYLON.Vector3(2, -2, 0), | |
| new BABYLON.Vector3(0, -2, 0), | |
| new BABYLON.Vector3(0, 0, 0) | |
| ], | |
| radiusFunction: function(i) { | |
| return 0.1 + Math.abs(2 * Math.sin(i * 10)); | |
| }, | |
| tessellation: 128, | |
| updatable: true | |
| }, scene); | |
| // Create the material for the DNA strand | |
| var dnaMaterial = new BABYLON.StandardMaterial("dnaMaterial", scene); | |
| dnaMaterial.emissiveColor = new BABYLON.Color3(0.1, 0.1, 0.1); | |
| dnaMaterial.specularColor = new BABYLON.Color3(0.2, 0.2, 0.2); | |
| // Apply the material to the DNA strand | |
| dnaStrand.material = dnaMaterial; | |
| // Add some lights to the scene | |
| var light1 = new BABYLON.PointLight("light1", new BABYLON.Vector3(5, 10, 5), scene); | |
| var light2 = new BABYLON.PointLight("light2", new BABYLON.Vector3(-5, -10, -5), scene); | |
| return scene; | |
| } | |
| var scene = createScene(); | |
| engine.runRenderLoop(function () { | |
| scene.render(); | |
| }); | |
| window.addEventListener("resize", function () { | |
| engine.resize(); | |
| }); | |
| </script> | |
| </body> | |
| </html> | |