折腾来折腾去

pikipity的blog

一起将 Processing 镶嵌在网页上

一直想找一种方法,将 processing 生成的程序放到网页上。在搜索了一番 Google 之后发现要使用 processing.js 才可以,但是要设置自己的网页才可以,太麻烦了,于是就放弃了。今天在浏览 processing.js 官网说明的时候发现,在《Processing.js Quick Start - Processing Developer Edition》一文中介绍了以下两个网站可以在线编写并共享自己的 processing 代码和效果:

  1. sketchpad

    这个网站上,不仅可以实现在线编写和分享代码,还可以自由浏览别人的共享代码,所有程序的效果可以实时演示,编辑器中还提供多人合作功能,很方便。

    缺点也很显著,编辑器虽然提供语法高亮,但是高不高亮完全没有用,所有文字一个颜色(只有 class 部分和别的不一个颜色)。第二个缺点不晓得是不是我浏览器的问题,贴出来的动画会播放一段时间之后突然放大,导致鼠标定位出现错误,很是奇怪。

    sketchpad 编辑器界面

    下面是我为了测试编写的一段小代码:

  2. hascanvas

    这个网站设计的很独特,编辑器隐藏在左边,鼠标靠近浏览器左边缘的时候,编辑器就会自动弹出,鼠标移开编辑区后,就会保存一次代码并编译,结果就显示在整个页面上。但是我用和上面一模一样的代码进行测试始终报错,这里只好拿别人的代码演示一下了。(貌似鼠标位置依然有偏差)

    hascanvas 界面



Comments