纸张和paperjs [英] Paperscope and paperjs

问题描述

所以我试图创建一个项目，两个canvas元素，每个都有自己的论文，并在每个外部的按钮控制某些功能在两个。

在Paperscript下的文档中，它说：

请注意：
当在一个页面中包含多个PaperScript时，每个脚本将在其自己的作用域中运行>，并且不会看到在其他中声明的对象和函数。对于与其他PaperScript或> JavaScript代码通信的PaperScript，请参阅有关PaperScript互操作性的教程。

...这是不幸的，因为教程如下：

即将推出！

$ b b

我在这个过程中很快陷入困境。我试着把函数放在全局范围内，从它们的画布外面调用它们，并且看到它们在错误的画布上打印。我试过通过一个模块导出函数，似乎运行该函数（？！？！）。最糟糕的是，paper.projects对象是一个包含一个（！）项目的数组，第一个画布。

任何人都知道如何做这个？

编辑：所以显然有这个答案，但我不知道如何让我能够从全局范围脚本调用PaperScript范围中的函数。

这只是一个脚本来调用PaperScope中的全局函数，如果我想让外部按钮做事情，它不适用于我。 p>

显然我缺少了一些东西。

第二编辑：我已经玩过各种全局函数， .global或只是坐在自己没有var声明...但是似乎发生的是，当我尝试调用我已经定义的函数，说：

  globals.makecircle = function（）{
 var o = new Path.Circle（{
 radius：50，
 center：new Point（200,200） 
}）
} 
  

运行在错误的窗口作为正确的窗口。

第三次编辑：为了清楚起见。

我有 firstcanvas.js 附加到 canvas1 在我的HTML，我有 secondcanvas .js 附加到 canvas2 。两者都被引用为脚本类型，如：

 < script type =text / paperscriptsrc =scripts / firstcanvas。 jscanvas =canvas1>< / script> 
< script type =text / paperscriptsrc =scripts / secondcanvas.jscanvas =canvas2>< / script& 
  

我创建 window.globals 建议。我从main.js中用一个按钮调用它，例如：

  window.globals = {} 
`$ （'document'）。ready（$（'＃dfs'）。on（'click'，window.globals.makecircle））`
  

我将此函数添加到 firstcanvas.js 中的全局变量。

如果我最近点击了canvas2，点击按钮 id ='DFS'将导致该函数在canvas2上运行，极其延迟。

和 paper.projects 没有列出这两个项目，所以我不能使用 activate / code>函数。

解决方案

已解决!!!

以下是从全局范围引用/激活PaperScript创建的作用域的方法。虽然没有用户可访问的数组范围（我知道）， PaperScope.get（id）将检索它们。由于某种原因，我发现 PaperScope.get（0）已经填充，我的两个canvas / PaperScript元素实际上指的是ids 1和2的范围。

因此：

  pscope1 = PaperScope.get（1）
 pscope2 = PaperScope .get（2）
  

然后，在任何我想在我的第一个画布上做某事的函数中：

  pscope1.activate（）
 
 // cool paper.js graphics stuff 
 
 pscope1.view.update（）
  

最后一行是因为 paper.js 不会自动更新用户不与之交互的视图。

感谢Jurg Lehni提示使用 .activate（）。

PS PaperScope.get 。我使用了好的jQuery $（'document'）。ready（）为此...

strong> PPS 从Jurg Lehni本人的另一个打击：在一个PaperScript内，这个将指向当前范围。您可以使用它并将其存储在全局对象中。

So I am trying to create a project with two canvas elements, each with its own paperscript, and with buttons on the outside of each that control certain functions within both.

Under the documentation under Paperscript, it says:

Please note: When including more than one PaperScript in a page, each script will run >in its own scope and will not see the objects and functions declared in >the others. For PaperScript to communicate with other PaperScript or >JavaScript code, see the tutorial about PaperScript Interoperability.

... which is unfortunate because that tutorial reads as follows:

Coming very soon!

I've gotten stuck very quickly in this process. I've tried putting functions in global scope, calling them from outside their canvas, and seeing them print on the wrong canvas. I've tried exporting functions via a module and it seems to run the function (?!?!). And worst, the 'paper.projects' object is an array with one(!) project in it, the first canvas.

So I'm stumped.

Anyone know how to do this?

EDIT: So apparently there is this answer but I don't see how that gets me being able to call functions in the PaperScript scope from global scope scripts.

That just seems like a script to call global functions in the PaperScope, which doesn't work for me if I'm trying to make outside buttons do things.

Clearly I'm missing something.

SECOND EDIT: I have played around with various global functions, either in window.global or just sitting by themselves with no var declaration... but what seems to happen is that when I try to call a function which I have defined, say as:

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

in the main scope, it will just as soon run in the wrong window as the correct window. Also there is an incredible delay before it runs which I can't figure out.

THIRD EDIT: For clarity.

I have firstcanvas.js attached to canvas1 in my HTML, I have secondcanvas.js attached to canvas2. Both are referenced as paperscript type, as:

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

I create window.globals object as Jurg suggests. I call it from main.js with a button, such as:

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

I add this function to globals in firstcanvas.js as above.

If I have most recently clicked on canvas2, clicking on the button with id='DFS' will cause the function to run, extremely delayed, on canvas2.

And paper.projects does not list both projects, so I can't use the activate() functions.

解决方案

Okay! SOLVED!!!

Here's how to reference/activate PaperScript-created scopes from the global scope. Although there is no user-accessible array of scopes (that I know of), PaperScope.get(id) will retrieve them. For some reason I find PaperScope.get(0) already populated, and my two canvas/PaperScript elements actually referring to scopes with ids 1 and 2.

Therefore:

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

Then, in any function where I want to do something on my first canvas:

pscope1.activate()

// cool paper.js graphics stuff

pscope1.view.update()

The last line is because paper.js won't automatically update a view that the user is not interacting with.

Thanks to Jurg Lehni for the hint to use .activate().

PS Make sure that your paperscript objects are created before using PaperScope.get. I used good 'ol JQuery $('document').ready() for this...

PPS Another little hit from Jurg Lehni himself: Inside a PaperScript, this will point to the current scope. You could use that and store it in the global object.

这篇关于纸张和paperjs的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！