2015-01-20 1 views
1

그래서 두 개의 캔버스 요소가있는 프로젝트를 만들려고합니다. 두 개의 캔버스 요소가 있으며 각 요소에는 고유 한 paperscript가 있고 두 개 모두의 특정 기능을 제어하는 ​​바깥 쪽의 단추가 있습니다. Paperscript 아래 문서에서 Paperscope and paperjs

, 그것은 말한다 :

주의 사항 : 페이지에 하나 이상의 PaperScript을 포함, 각 스크립트는 자신의 범위에> 실행 및 개체와 기능을 볼 수 없습니다 때 >에서 선언했습니다. PaperScript가 다른 PaperScript 또는 JavaScript 코드와 통신하려면 PaperScript Interoperability에 대한 자습서를 참조하십시오. 다음과 같이 불행한 일이다

는 ... 그 튜토리얼 읽기 때문에 :

매우 출시 예정!

나는이 과정에서 매우 빠르게 고착했다. 필자는 전역 범위에 함수를 넣고 캔버스 외부에서 호출하고 잘못된 캔버스에서 인쇄하는 것을 보았습니다. 모듈을 통해 함수를 내보내려고했는데 함수 (?!?!)를 실행하는 것 같습니다. 그리고 최악의 경우, 'paper.projects'객체는 첫 번째 캔버스 인 하나의 (!) 프로젝트가있는 배열입니다.

그래서 나는 혼란 스럽습니다.

누구든지이 작업을 수행하는 방법을 알고 있습니까?

EDIT : 분명히 this answer이 있지만 전역 스코프 스크립트에서 PaperScript 범위의 함수를 호출하는 방법을 알지 못합니다.

외부 버튼에 작업을 수행하려는 경우 PaperScope에서 전역 함수를 호출하는 스크립트처럼 보일뿐입니다.

분명히 나는 ​​뭔가를 놓치고 있습니다.

SECOND EDIT : window.global 또는 다양한 var 선언을 사용하여 다양한 글로벌 함수를 사용하여 놀았습니다 ...하지만 일어날 것으로 보이는 것은 내가 가지고있는 함수를 호출하려고 할 때 발생하는 것입니다. 주요 범위

globals.makecircle = function() { 
    var o = new Path.Circle({ 
     radius: 50, 
     center: new Point (200,200) 
    }) 
} 

, 그냥 빨리 올바른 창으로 잘못된 창에서 실행됩니다 정의로 말한다. 또한 내가 알아낼 수없는 실행되기 전에 놀라운 지연이 있습니다.

세 번째 편집 : 명확성을 위해.

firstcanvas.js이 내 HTML에 canvas1에 첨부되어 있습니다. 에 첨부 된 secondcanvas.js이 있습니다. Jurg에서 알 수 있듯이 나는 window.globals 객체를 생성

<script type="text/paperscript" src="scripts/firstcanvas.js" canvas="canvas1"></script> 
     <script type="text/paperscript" src="scripts/secondcanvas.js" canvas="canvas2"></script> 

: 모두로, paperscript 유형으로 참조됩니다. 나는 위와 firstcanvas.js에 전역에이 기능을 추가

window.globals = {} 
`$('document').ready($('#dfs').on('click', window.globals.makecircle))` 

: 나는 같은 버튼과 main.js에서 호출.

최근에 canvas2를 클릭 한 경우 id='DFS' 버튼을 클릭하면 canvas2에서 매우 지연되어 기능이 실행됩니다.

paper.projects 두 프로젝트를 모두 나열하지 않으므로 activate() 함수를 사용할 수 없습니다.

+0

실제로 문제가있는 샘플을 제공하십시오. – Nit

+0

충분히 명확하지가 않습니까? –

+0

문제를 나타내는 코드가 표시되지 않았습니다. – Nit

답변

3

오케이! 해결!

여기/글로벌 범위에서 PaperScript 생성 범위를 활성화 참조하는 방법은 다음과 같습니다. 사용자가 액세스 할 수있는 범위의 배열 (알고있는 범위)은 없지만 PaperScope.get(id)은 검색합니다. 내가 뭔가를 원하는 기능으로,

pscope1 = PaperScope.get(1) 
pscope2 = PaperScope.get(2) 

다음 : 어떤 이유로 나는 PaperScope.get(0) 이미 채워, 내 두 캔버스/PaperScript 요소가 실제로 IDS 1 따라서 2

과 범위를 참조 찾기 처음으로 캔버스에 : paper.js가 자동으로 사용자와 상호 작용되지 않았다는보기를 업데이트하지 않기 때문에

pscope1.activate() 

// cool paper.js graphics stuff 

pscope1.view.update() 

마지막 줄입니다. 힌트에 대한 Jurg Lehni에

덕분에 .activate()를 사용합니다.

PSPaperScope.get을 사용하기 전에 paperscript 개체가 만들어 졌는지 확인하십시오. 현재 범위를 가리키는 것입니다 PaperScript 내부 this : 나는 ... 이것에 대한 JQuery와 $('document').ready()

PPS Jurg Lehni 자신의 또 다른 작은 히트 좋은 '팔자을 사용했다. 이를 사용하여 전역 객체에 저장할 수 있습니다.

+0

당신은 사람입니다 !! : D 고마워 !! –