一个配置并不复杂,功能一直在完善的插件,如果各位喜欢,请给我一颗star吧,感激不尽
基于官方2.1.0版本的Api开发。
- ✅ - 多模型装载
- ✅ - 自定义事件行为
- ✅ - 姐妹花
- ✅ - 快速换衣
更多示例正在开发,第一次加载可能会有些慢,见谅~
``` git clone https://github.com/fguby/live2D.git ```还想要更多吗?请点击 二次元传送门
<script src="js/live2d.min.js"></script>
<script src="js/LAppDefine.js"></script>
<canvas id="mycanvas" width="300" height="500"></canvas>
<body onload="InitLive2D()">
模型出不来?
YES.😑
或者,请看看自己具体项目里的路径,然后进行修改?
属性 | 值/含义 |
---|---|
DEBUG_LOG | true/false。是否在console里打印日志。 |
CANVAS_ID | 页面canvas元素的id值。 |
IS_SCROLL_SCALE | 是否开启滚轮缩放 |
VIEW_MAX_SCALE | 画面最大缩放级别 |
VIEW_MIN_SCALE | 画面最小缩放级别 |
IS_BIND_BUTTON | 是否绑定切换模型按钮 |
BUTTON_ID | 绑定按钮的id值,确认绑定时此值才有效。 |
IS_BAN_BUTTON | 是否开启模型加载过程间的按钮禁用功能。 |
BAN_BUTTON_CLASS | 按钮禁止状态时的class值,可自定义样式 |
NORMAL_BUTTON_CLASS | 按钮恢复正常时的class值 |
TEXURE_CHANGE_MODE | 衣服切换模式,random-随机,sequence-顺序 |
TEXURE_BUTTON_ID | 换衣绑定的元素id属性,目前仅支持点击触发 |
MODELS:
[
["model/haru/haru.model.json"],
["model/xiaomai/xiaomai.model.json"],
["model/wanko/wanko.model.json"],
["model/shizuku/shizuku.model.json"],
["model/haru/haru_01.model.json","model/haru/haru_02.model.json"],
["model/Epsilon2.1/Epsilon2.1.model.json"],
["model/Pio/model.json"]
],
MODELS负责模型json文件的统一配置,如果想要配置自己的多个模型,只需要在这里进行添加即可。(单模型只需添加一个就好)
//写法如下
MODELS:
[
[模型1的路径,模型2的路径]
]
//具体配置如下
//1.
IS_START_TEXURE_CHANGE : true,
//2.
TEXURE_CHANGE_MODE : "sequence",
//3.
TEXURE_BUTTON_ID : "button_id",
页面按钮元素的放置。
模型json文件的处理。
确保模型已经顺利加载出现。
"textures":[
"textures/pajamas-costume.png",
"textures/Animal Costume Racoon.png",
"textures/Akiba Idol Costume.png",
"textures/Goddess Costume Pink.png"
],
将需要更换的png图片全都配置在这里,数组的顺序默认是顺序更换时的顺序。