physicsjs + requirejs : 실제로 아무것도 수행 할 스크립트를 얻을 수 없습니다.

requirejs를 처음 사용했습니다. 나는 그것을 물리 모듈을 배우기 위해 사용하려고 노력하고있다. 나는 아주 기본적인 튜토리얼을 따르고 있지만, 나는 막혔다. 기본적으로 모듈을 사용하여 원을 만들고 싶지만 아무 일도 일어나지 않습니다. Chrome의 개발 도구는 오류를 발생시키지 않으며 모든 종속성이 예상대로로드되고 있습니다.physicsjs + requirejs : 실제로 아무것도 수행 할 스크립트를 얻을 수 없습니다.

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Physics project</title> 
     <!-- data-main attribute tells require.js to load 
      scripts/main.js after require.js loads. --> 
     <script data-main="main" src="lib/require.js"></script> 
     <link rel="stylesheet" type="text/css" href="lib/css/style.css" 
    </head> 
    <body> 
     <div class="content"> 
     <h2>Physics</h2> 
     <canvas id="viewport" width="500" height="500"></canvas> 
    </div> 
    </body> 
</html>

main.js :

require(['lib/config/require-config'], function(){ 
    require(['lib/modules/template']); 
});

필요한-설정 :

require.config({ 
    paths: { 
     "jquery": "http://code.jquery.com/jquery-latest.min", 
     "underscore": "lib/underscore", 
     "physicsjs":"lib/physicsjs-0.6.0/physicsjs-full-0.6.0.min", 

    }

template.js : 이 모든 물리학 물건이 바로 끌어

이

은 HTML입니다 모듈 제작자 예제를 통해 물리 함수를 "호출"하지 않는 것처럼 보입니다. 올바르게 또는 무엇인가.

define(
    [ 
    'underscore', 
    'jquery', 
    'physicsjs', 
     'lib/physicsjs-0.6.0/bodies/circle' 

    ], 
    function(
     Physics 
    ) { 

     Physics(function(world){ 
     var viewWidth = 500; 
     var viewHeight = 500; 

     var renderer = Physics.renderer('canvas', { 
     el: 'viewport', 
     width: viewWidth, 
     height: viewHeight, 
    meta: false, // don't display meta data 
    styles: { 
     // set colors for the circle bodies 
     'circle' : { 
      strokeStyle: '#351024', 
      lineWidth: 1, 
      fillStyle: '#d33682', 
      angleIndicator: '#351024' 
     } 
     } 
    }); 

    // add the renderer 
    world.add(renderer); 
    // render on each step 
    world.on('step', function(){ 
    world.render(); 
    }); 

    // bounds of the window 
    var viewportBounds = Physics.aabb(0, 0, viewWidth, viewHeight); 

    // constrain objects to these bounds 
    world.add(Physics.behavior('edge-collision-detection', { 
    aabb: viewportBounds, 
    restitution: 0.99, 
    cof: 0.99 
    })); 

    // add a circle 
    world.add(
    Physics.body('circle', { 
     x: 50, // x-coordinate 
     y: 30, // y-coordinate 
     vx: 0.2, // velocity in x-direction 
     vy: 0.01, // velocity in y-direction 
     radius: 20 
     }) 
    ); 

    // ensure objects bounce when edge collision is detected 
    world.add(Physics.behavior('body-impulse-response')); 

    // add some gravity 
    world.add(Physics.behavior('constant-acceleration')); 

    // subscribe to ticker to advance the simulation 
    Physics.util.ticker.on(function(time, dt){ 

    world.step(time); 
    }); 

    // start the ticker 
    Physics.util.ticker.start(); 

    }); 
    });

출처

2014-04-30 dpawlows

물리 엔진에 대한 링크를 추가하십시오. 내 첫 번째 추측은'AMD 모듈 '이 아니므로'심'을 넣어야한다는 것이다. –

define 서명 잘못 :

define([ 
    'underscore', 
    'jquery', 
    'physicsjs', 
    'lib/physicsjs-0.6.0/bodies/circle' 
], 
function(Physics) { 
    // ... 
})

define 배열 요소가 너무 Physics 변수 실제로 UnderscoreJS 지칭 일대일 함수의 인수에 결합된다. 올바른 기능 서명은 다음과 같습니다.

// ... 
function(underscore, $, Physics, circle) { 
    // ... 
})

출처

2014-04-30 20:31:36 kryger

physicsjs + requirejs : 실제로 아무것도 수행 할 스크립트를 얻을 수 없습니다.

답변

관련 문제