≡
Products
▼
Support
▼
Company
▼
Forum
Ambiera Forum
Discussions, Help and Support.
Create a new account
,
Search
, or Login:
Create reply in
Rotating camera around scene
Posted by:
(you are not logged in)
Enter the missing letter in: "Interna?ional"
(you are not logged in)
Text:
[quote][b]mtlca401[/b] wrote: I am trying to take existing code from other web 3d technologies that I have worked with, and transform it to copperlicht. What I am trying to accomplish is create a board for some sort of game (no game in particular, but a bird's eye view game). I have figured out how to create the board by extending the MeshSceneNode, but am having trouble figuring out how to center the board, and rotate the camera around the board (or scene really). For centering the board, I'm assuming that I have to center the vertices, but I'm not really sure how to follow what they are doing. For the rotating around the scene, I have tried AnimatorCameraFPS and AnimatorCameraModelViewer. AnimatorCameraFPS looks to move the camera around. AnimatorCameraModelViewer looks to rotate the camera around the scene, but it does not spin the scene using the center of the board. [code] <!DOCTYPE HTML> <html> <head> <link rel="stylesheet" href="style/x3dom.css" /> <script type="text/javascript" charset="utf-8" src="js/jquery-1.7.2.min.js"></script> <script type="text/javascript" charset="utf-8" src="js/jquery-ui-1.9.2.custom.min.js"></script> <script type="text/javascript" charset="utf-8" src="js/jquery.mousewheel.min.js"></script> <script type="text/javascript" charset="utf-8" src="js/raphael-min.js"></script> <script type="text/javascript" charset="utf-8" src="js/copperlicht.js"></script> <style> body {overflow: hidden; background: black; margin: 0; padding: 0;} debugblock {position: absolute; padding: 5px; width: 200px; min-height: 25px; background: black; color: 2AFF00; top: 5px; right: 15px; z-index: 1001;} </style> <script type="text/javascript" charset="utf-8"> $(document).ready(function() { var screenW = $(document).width(); var screenH = $(document).height(); var offsetW = 300; var offsetH = 200; resize_canvas(offsetW, offsetH); $(window).resize(function() { resize_canvas(offsetW, offsetH); }); // create the 3d engine var engine = new CL3D.CopperLicht('3darea'); if (!engine.initRenderer()) return; // this browser doesn't support WebGL // add a new 3d scene var scene = new CL3D.Scene(); engine.addScene(scene); scene.setBackgroundColor(CL3D.createColor(1, 0, 0, 64)); // add our own scene node var mynode = new MySceneNode(engine, 15, 0.1, 15); scene.getRootSceneNode().addChild(mynode); // mynode.addAnimator(new CL3D.AnimatorRotation(new CL3D.Vect3d(0, 0.6, 0))); // add a user controlled camera with a first person shooter style camera controller var cam = new CL3D.CameraSceneNode(); cam.Pos.X = 0; cam.Pos.Y = 20; cam.Pos.Z = 0; scene.getRootSceneNode().addChild(cam); scene.setActiveCamera(cam); var animator = new CL3D.AnimatorCameraFPS(cam, engine); cam.addAnimator(animator); function writeToDebug(str) { $("debugblock").html(str); } function resize_canvas(offsetW, offsetH){ canvas = document.getElementById("3darea"); canvas.width = window.innerWidth - offsetW; canvas.height = window.innerHeight - offsetH; $("3darea").css({"position[/quote]
Possible Codes
Feature
Code
Link
[url] www.example.com [/url]
Bold
[b]bold text[/b]
Image
[img]http://www.example.com/image.jpg[/img]
Quote
[quote]quoted text[/quote]
Code
[code]source code[/code]
Emoticons
Copyright© Ambiera e.U. all rights reserved.
Privacy Policy | Terms and Conditions | Imprint | Contact