在博客中增加自己的live2d纸片人模型方法

准备工具

1. github仓库：存放live2d模型和json文件

   如果你的博客支持本地存放文件也可，主要是博客园只支持几种格式，太坑了。

   注意如果你使用git仓库的话，firefox浏览器可能不能成功显示，原因是CORS安全策略阻止了跨源申请

2. 现成的带json的live2d模型。

   这个可以到资源群或者百度贴吧去找（也可以自己做

   如果没有的话，作者推荐了两个少女前线的模型，非常好康，地址放在文末

使用步骤

没有模型请跳过。

1. 上传模型到github仓库或本地仓库

   这里给出传git的步骤

   当然也可以fork到自己的仓库，直接用我的也行呀QwQ

• 注册账号并新建仓库

  

• 上传文件，就是上面那个Upload File，格式就是打个包到文件夹中，拖到指定区域就行了

• 点开文件夹，再点开里面的model.json，此时网址如

  https://github.com/用户名/仓库名/blob/master/ots-14/model.json

  

• 点击代码框上面的“Raw”按钮，生成外链

  

  这样就准备好了

2. 把下列代码添加到HTML文件中：（如果是博客园用户，需要申请js权限，在“ 页脚Html代码”中输入）

   <script src="https://eqcn.ajz./wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
   <script>
       L2Dwidget.init({
           "model": {
   　　　　　　　//jsonpath控制显示模型
               jsonPath: "https://raw./parker0523/res/master/ots-14/model.json",
           },
           "display": {
               "position": "right", //看板娘的表现位置
               "width": 200,  //宽度
               "height": 350, //高度
               "hOffset": -50,
               "vOffset": -20
           },
           "mobile": {
               "show": true,
           },
           "react": {
               "opacityDefault": 1,//不透明度，可调
               "opacityOnHover": 0.2
           }
       });
   </script>

代码中的网址就是上面准备的网址

有一些参数，可根据自己博客实际来调。

这个是支持交互的，只不过我给的live2d模型没有语音。。。

给一个效果图吧：

附件

就两个网址：

这个是OTS-14的

https://raw./parker0523/res/master/ots-14/model.json

这个是索米的

https:///usr/file/live2d/assets/GF/kp31/model.json

直接替换代码中的即可

用不起的或者想找我要live2d模型的可以留言呀QwQ（我尽量及时回复

我目前有的live2d：

1. 88type

2. 95 玉玲珑

3. dsr50 红牡丹/最高出价

4. fn57 儿童节皮肤

5. g36c 约会

6. g41 泳装

7. 格琳娜

8. 灰熊

9. 416 星之茧

10. 索米kp31 幸福使命/泳装

11. ntw20 女仆咖啡厅

12. 汤姆森 恶魔猎人

13. px4 圣诞节

14. rfb 圣诞节

15. 小狮子 南瓜

16. type64-ar

17. vector 盲信者

18. wa2000 古堡历险

19. 维尔德

20. ots-14 紫雨心

澄清

少女前线live2d模型有版权，请勿用于商业用途！