Skip to content

Instantly share code, notes, and snippets.

@vppillai
Created October 24, 2014 04:31
Show Gist options
  • Select an option

  • Save vppillai/ba334f9d8c8c31b20939 to your computer and use it in GitHub Desktop.

Select an option

Save vppillai/ba334f9d8c8c31b20939 to your computer and use it in GitHub Desktop.

Revisions

  1. vppillai created this gist Oct 24, 2014.
    57 changes: 57 additions & 0 deletions mpu6050.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,57 @@
    <!DOCTYPE HTML>
    <html> <head>
    <style>
    body {
    margin: 0px;
    padding: 0px;
    }
    </style> </head>
    <body>
    <div id="container"></div>
    <script src="three.js"></script>
    <script src="stats.min.js"></script>
    <script defer="defer">
    var w=0,x=0,y=0,z=0,j=0, entry;
    function animate(){
    plane.quaternion.set(x,y,z,w);
    renderer.render(scene, camera);
    stats.update();
    requestAnimationFrame(function(){ animate()}); }
    // renderer
    var renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);
    document.body.appendChild(renderer.domElement);
    // camera
    var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 1000);
    camera.position.y = -450;
    camera.position.z = 400;
    camera.rotation.x = 45 * (Math.PI / 180);
    // scene
    var scene = new THREE.Scene();
    // plane
    var plane = new THREE.Mesh(new THREE.BoxGeometry(300, 300,20), new THREE.MeshNormalMaterial());
    //var plane = new THREE.Mesh(new THREE.PlaneGeometry(300, 300), new THREE.MeshNormalMaterial());
    plane.overdraw = true;
    scene.add(plane);
    plane.useQuaternion = true;
    plane.quaternion.set(0,0,0,0);
    exampleSocket = new WebSocket("ws://localhost:81", "protocolOne");
    if (0!=exampleSocket){
    exampleSocket.onmessage = function (e) {
    var res = e.data.split("\t");
    w = Number(res[0]);
    x = Number(res[1]);
    y = Number(res[2]);
    z = Number(res[3]);
    }
    }
    //stats
    container = document.createElement( 'div' );
    document.body.appendChild( container );
    stats = new Stats();
    stats.domElement.style.position = 'absolute';
    stats.domElement.style.top = '0px';
    container.appendChild( stats.domElement );
    // request new frame
    animate()
    </script> </body> </html>