p5.js是一个JavaScript的函数库,它在制作之初就和Processing有同样的目标。就是让艺术家,设计师,教育工作者和编程初学者能够很容易,很轻松地学习和使用程序设计。并且它也能给现在的网页带来一些新的东西,例如p5的官方网站。
在你学习p5.js的同时,还可以帮助你学习JavaScript,能够将制作出来的有创意,有趣的东西呈现在任何的浏览器上。当然还可以用它做很多事情,做艺术创作,做资料数据的可视化,做交互艺术等等。
<?php$a = "abc1123"
?>
<script>
var a = "<?php echo $a?>"
</script>
首先要了解PHP是服务器端程序,在服务器端执行,然后把执行结果交给客户端(浏览器)。
而 js(JavaScript) 是在客户端(浏览器)执行的程序,可以理解为是HTML的一部分。
所以上边代码在浏览器执行结果是:
<script>
var a = "abc123"
</script>
建议先学习HTML(包括js) .然后再学习PHP. 会容易些。
PHP:
http://baike.baidu.com/link?url=xl0E0qi55pL3rJIhoJ_DRR240SiVCjGCXYmsBSXjCQpymm2vSSDKufyYEd_VpKjrJQVrGICYye9LOV_st8Mw9OIjDIXHR6_P5DxGIetuISC
Javascript:
http://baike.baidu.com/link?url=5dhgF31QABkKhkun5p0om7WNZOL26ixTWmMV-4ZEIbw--xOELfkJD7bqbdyOwDGKCY9eG-AmKGBy29UWnZkala
HTML:
http://baike.baidu.com/link?url=xOMNYbu195eyhunRRz-NWjkF4ZR4kBhSFPsAdKd_oUXbS5QIz9NnVEGppwx-mPFb
简单的说,p5.js是一个js类库;canvas是一个html5新增的一个元素,"canvas" 即 "画布", 此元素是为了客户端矢量图形而设计的。它自己没有行为,却把一个绘图 API 展现给客户端 JavaScript 以使脚本能够把想绘制的东西都绘制到一块画布上。两者要想绘图,都需执行js代码。仔细看p5的初始代码,
function setup() {createCanvas(400, 400)//为html页面创建canvas元素
}
两者的本质都是通过js来实现canvas的表现,p5.js与jquery库无异,将一些常用的功能需求的代码进行封装,以实现代码的简化。也就是任何p5.js可实现的,通过纯canvas的js api都能实现,不过要想实现,往往牺牲得是时间与效率。而p5.js提供了一种仅需少量代码就能实现很炫酷的操作的方法。两者渲染速度比较,理论上应该是一样的,毕竟大家殊途同归嘛,都是通过js来实现的,只要纯js写的足够优化,是会比p5.js快一丢丢的,差异不明显。明显的差异是p5.js在网页加载时需要下载p5.js的类库才能进行操作,而canvas api由于是客户端提供的原因,则不需要。