为网站页面添加live2D小猫猫

live2D是一种应用于电子游戏的绘图渲染技术，技术由日本Cybernoids公司开发，通过一系列的连续图像和人物建模来生成一种类似三维模型的二维图像。

live2d官方提供了很多平台的SDK），包括iOS，Android，Flash，Unity，openGL等，然后如果要在网页中呈现，则可以提供了WebGL SDK，可以参照官方网站：https://www.live2d.com/

live2d不仅在移动端，同时也可以在网页中呈现，首先网页要引入官方提供的webgl的js压缩包 L2Dwidget.min.js，建议在页面底部延迟加载，因为其体积过于庞大，如果不延迟加载，会严重影响你的网站的加载速度和性能，然后在页面中写入以下代码：

var arr = ['wanko','hibiki','hijiki','tororo'];
var index = Math.floor((Math.random()*arr.length));var name = arr[index];L2Dwidget.init({pluginRootPath: "live2dw/",pluginJsPath: "lib/",pluginModelPath: "live2d-widget-model-"+name+"/assets/",tagMode: false,debug: false,model: { jsonPath: "/live2dw/live2d-widget-model-"+name+"/assets/"+name+".model.json" },display: { position: "right", width: 150, height: 300 },mobile: { show: true },log: false})

这里我们设置一组小挂件模型，有猫狗和小女孩，随机获取一个模型进行加载，出现的位置设定为右下角，同时在移动端设置兼容。

总体上，二次元的webgl页面技术还是很有意思的，同时对于游戏跨平台的制作有着跨时代的意义，前端技术博大精深，由小见大，学习的道路还是山高水深。

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！