使用p5的函数而不使用设置/绘制格式

时间:2016-08-17 07:35:23

标签: javascript python import p5.js

我对Javascript比较陌生,我正在修补p5库。在Python中,我可以使用from x import y statement

从库中导入单个函数
from subprocess import check_output

我的问题是,有一种方法可以在不使用setup/draw格式的情况下对p5做同样的事情吗?比方说,我想在我的一个脚本中使用noise函数;我可以导入和使用该功能吗?

1 个答案:

答案 0 :(得分:6)

有了这样的问题,最好只是组织一个超级简单的测试来尝试:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Noise Test</title>
    <script src="p5.js" type="text/javascript"></script>
    <script>
        console.log(noise(100));    
    </script>

  </head>
  <body>
  Noise Test, check the console.
  </body>
</html>

此处我们正在加载p5.js库,然后尝试调用noise()函数。如果我们运行它,我们会收到错误:

Did you just try to use p5.js's noise() function? If so, you may want to move it into your sketch's setup() function.

For more details, see: https://github.com/processing/p5.js/wiki/Frequently-Asked-Questions#why-cant-i-assign-variables-using-p5-functions-and-variables-before-setup

index.html:9 Uncaught ReferenceError: noise is not defined

我们可以访问该网址,了解正在发生的事情:

  

在全局模式下,p5变量和函数名称不可用   外部设置(),draw(),mousePressed()等(除非在这种情况下   它们被放置在由其中一个调用的函数内   方法。)

     

对此的解释有点复杂,但必须这样做   与库的设置方式,以支持全局和   实例模式。要了解发生了什么,让我们先来看看   加载带有p5的页面时(在全局模式下)会发生命令。

     
      
  1. 已加载脚本。

  2.   HTML页面加载的
  3. (完成后,onload事件将触发,然后触发第3步)。

  4.   
  5. p5启动,所有功能都添加到全局命名空间。

  6.         

    所以问题是在p5之前加载和评估脚本   当它还没有意识到p5变量时就开始了。如果我们尝试   在这里打电话给他们,他们会导致错误。但是,当我们使用p5时   函数调用setup()和draw()这是可以的,因为   当脚本第一时,浏览器不会查看内部函数   加载。这是因为setup()和draw()函数不是   在用户代码中调用,它们只是定义的,所以里面的东西   它们尚未运行或评估。

         

    直到p5启动才实际设置setup()函数   run(p5为你调用),此时,p5函数存在   在全局命名空间中。

所以,不,你不能在没有p5.jssetup()函数的情况下使用draw()函数。

话虽如此,你可以简单地定义一个你从setup()调用的回调函数,这样你知道p5.js函数可用:

<script src="p5.js" type="text/javascript"></script>
<script>
    function doYourStuff(){
        console.log(noise(100));        
    }

    function setup(){
        doYourStuff();
    }
</script>

或者,您可以使用instance mode

这涉及手动创建p5的实例并使用它直接调用函数而不是全局调用它们:

<script src="p5.js" type="text/javascript"></script>
<script>
    var p5 = new p5();
    console.log(p5.noise(100));
</script>

你也可以挖掘来源。

导入单个函数并不是一个好方法,但您可以对p5.js的未分析源进行ctrl + f搜索,并查找noise()函数。然后你可以将它复制到它自己的文件(以及它所依赖的任何其他帮助函数)中。但这可能比简单地使用上述方法之一更有效,而且可能违反了p5.js的版权。