博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
学JS的心路历程Day26 - PixiJS -入坑
阅读量:5039 次
发布时间:2019-06-12

本文共 740 字,大约阅读时间需要 2 分钟。

后来知道也可以透过canvas让网页动起来!

 

而PixiJS是使用WebGL在canvas上绘制内容与制作动态

且同时有下列特色:

 

支持多点触控

掩码与混合模式

可外加WebGL滤镜

多装置支持

等等,什么是WebGL()?

 

WebGL是一种JS的API,让网页能不需使用外挂程序就能在HTML的canvas元素中实现二维及三维渲染。

 

不过要注意的是,有些浏览器预设会把WebGL关闭,避免太吃性能,要打开可以参照这篇文章How can I enable WebGL in my browser?

 

这边我示范一下chrome如何打开。

 

首先,打开硬件加速功能

进入chrome://settings/

 

接着,启用WebGL

进入chrome://flags/

搜寻WebGL点击启用

 

最后,确认WebGL状态

进入chrome://gpu/

如果状态不是Hardware accelerated,下方的Problems Detected列表可能会解释原因!

 

不过前面提到了这么多看起来很赞的特色,想当然就是不能支持太过老旧的浏览器。

 

或许有人会说,那怎么不用three.js或phaser3呢?

这是因为这两者底层实际上也是用PixiJS,这样你不觉得先学好PixiJS再去学这两者会比较快速吗?

 

而且PixiJS更新时,three.js及phaser3需要等待一段时间才有办法更新。

 

就连前段时间很红的

 

这款游戏也是用PixiJS制作的!

 

对,你没有听错,Canvas也可以做游戏!

 

在接下来的四天时间,我将会带各位初步了解PixiJS的语法以及实作,那们我们明天见()!

转载于:https://www.cnblogs.com/lannyQ-Q/p/10160091.html

你可能感兴趣的文章
[置顶] 细说Cookies
查看>>
[wp7软件]wp7~~新闻资讯,阅读软件下载大全! 集合贴~~~
查看>>
web前端java script学习2017.7.18
查看>>
删除TXPlatform
查看>>
Extjs String转Json
查看>>
二叉树的遍历问题总结
查看>>
WPF 3D变换应用
查看>>
ArchLinux安装开源VMware Tools
查看>>
DB2 锁升级示例1
查看>>
16.RDD实战
查看>>
一位数据挖掘成功人士 给 数据挖掘在读研究生 的建议
查看>>
Python3.6.0安装
查看>>
hdu1049
查看>>
H5项目常见问题及注意事项
查看>>
索尼(SONY) SVE1512S7C 把WIN8降成WIN7图文教程
查看>>
时间模块 && time datetime
查看>>
jquery自动生成二维码
查看>>
spring回滚数据
查看>>
新浪分享API应用的开发
查看>>
美国专利
查看>>