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


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

    准备工具

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

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

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

    2. 现成的带jsonlive2d模型

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

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

    使用步骤

    没有模型请跳过。

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

      这里给出传git的步骤

      • 注册账号并新建仓库

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

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

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

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

        这样就准备好了

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

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

      <script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
      <script>
          L2Dwidget.init({
              "model": {
             //jsonpath控制显示模型
                  jsonPath: "https://raw.githubusercontent.com/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.githubusercontent.com/parker0523/res/master/ots-14/model.json

    这个是索米的

    https://pelom.top/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模型有版权,请勿用于商业用途!

    觉得好用的话请点赞或者github上star/fork我吧!

  • 相关阅读:
    Oracle:PL/SQL--流程控制——作业练习:向表中循环插入ID编号
    Oracle:PL/SQL--流程控制(三)——循环结构:loop、while-loop、for-loop
    Oracle:PL/SQL--流程控制(三)——循环结构:loop、while-loop、for-loop
    Oracle:PL/SQL--打开控制台or关闭控制台
    Win10远程桌面及防火墙配置
    H3C-Telnet
    网络工程师(软考)心得
    《网络工程师 考前冲刺100题》思维导图
    《2019上半年网络工程师考试大纲》
    网络设计:搭建校园网(组网工程课设)【译】
  • 原文地址:https://www.cnblogs.com/lcyfrog/p/11725534.html
Copyright © 2020-2023  润新知