If you're seeing this message, it means we're having trouble loading external resources on our website.

如果你被网页过滤器挡住,请确保域名*.kastatic.org*.kasandbox.org 没有被阻止.

主要内容

在可汗学院以外使用 ProcessingJS

我们在这里有一个非常棒的编辑环境 —— 它实时更新,它为您提供有用的错误,数字擦洗器和颜色选择器。我们环境设计考虑到了新程序员 —— 每天都有成千上万的新开发者,我们希望让他们更容易地学习JavaScript。
一旦熟悉了JavaScript并开始开发更长,更复杂的程序,您可能会发现自己想要在编码环境中使用不同的功能。也许您不想要实时更新,或者您希望将代码放在多个文件中,或者您希望与版本控制系统集成。或许您只是希望能够将ProcessingJS程序集成到您的网站中。
在这种情况下,您可能希望开始在可汗学院之外编写ProcessingJS程序。您不能只是将程序代码复制并粘贴到桌面编辑器中的文件中,并查看工作程序。为什么不能?
ProcessingJS 是一个基于Web技术构建的库。当你在可汗学院上用它编程时,我们实际上在幕后创建一个网页(HTML 文件),在其中贴上一个<canvas> 标签,加载 ProcessingJS JavaScript库,然后运行你的程序代码。
这意味着如果你想在可汗学院之外的程序上工作,需要创建一个HTML文件来完成我们的工作。
您可以从以下开始的示例开始学习:
该示例使用我们的 网页环境 构建。但是,您可以将其粘贴到任何其他代码编辑环境中的HTML文件中。
如果您将程序代码粘贴到该模板中,可能会发现一切都很完美,还可以高兴地跳起来!。
如果事情没有按照预期的运作,那可能是因为模板 不是 使用我们在 可汗学院 使用的完全相同版本的ProcessingJS。我们的版本专门设计并用于KA内部,因此我们建议您在KA之外进行开发时使用 官方ProcessingJS库
ProcessingJS官方版本与可汗学院的ProcessingJS版本之间存在一些显着差异:
  • 可汗学院(KA)使用 mouseIsPressed 而不是mousePressed 作为全局布尔值。类似地,KA使用keyIsPressed而不是keyPressed。这意味着在模板中粘贴代码时需要更改 mouseIsPressedkeyIsPressed
  • KA默认使用度数来表示所有角度参数,而不是弧度。如果你在程序中使用角度度数,可以使用radians()转换它们。
  • KA使用 getImage()getSound() 用于图像和声音,官方版本中不存在。您可以将PImage 用于图像,并且您需要创建一个 <audio> 标签来播放声音。
官方版本还具有更广泛的功能,如图像处理和更多3D功能。您可以在 文档 中探索所有内容。
当然,我们仍然希望看到您在可汗学院之外创建程序,所以我希望您在完成后分享它们,或将它们转换回 ProcessingJS 版本或者在我们的网页环境中共享它们。
接下来,我将更多地讨论桌面编辑器和调试工具。

想加入讨论吗?

尚无帖子。
你会英语吗?单击此处查看更多可汗学院英文版的讨论.