在博客中增加自己的live2d纸片人模型方法
2019-10-23 12:00
2907 查看
目录
在博客中增加自己的live2d纸片人模型
准备工具
github仓库:存放live2d模型和json文件
如果你的博客支持本地存放文件也可,主要是博客园只支持几种格式,太坑了。
注意如果你使用git仓库的话,firefox浏览器可能不能成功显示,原因是CORS安全策略阻止了跨源申请
现成的带json的live2d模型。
这个可以到资源群或者百度贴吧去找(也可以自己做
如果没有的话,作者推荐了两个少女前线的模型,非常好康,地址放在文末
使用步骤
没有模型请跳过。
上传模型到github仓库或本地仓库
这里给出传git的步骤
注册账号并新建仓库
上传文件,就是上面那个Upload File,格式就是打个包到文件夹中,拖到指定区域就行了
点开文件夹,再点开里面的model.json,此时网址如
https://github.com/用户名/仓库名/blob/master/ots-14/model.json
点击代码框上面的“Raw”按钮,生成外链
这样就准备好了
把下列代码添加到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>
当然也可以fork到自己的仓库,直接用我的也行呀QwQ
代码中的网址就是上面准备的网址
有一些参数,可根据自己博客实际来调。
这个是支持交互的,只不过我给的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:
- 88type
- 95 玉玲珑
- dsr50 红牡丹/最高出价
- fn57 儿童节皮肤
- g36c 约会
- g41 泳装
- 格琳娜
- 灰熊
- 416 星之茧
- 索米kp31 幸福使命/泳装
- ntw20 女仆咖啡厅
- 汤姆森 恶魔猎人
- px4 圣诞节
- rfb 圣诞节
- 小狮子 南瓜
- type64-ar
- vector 盲信者
- wa2000 古堡历险
- 维尔德
- ots-14 紫雨心
觉得好用的话请点赞或者github上star/fork我吧!
相关文章推荐
- 自己发现写博客是很好整理自己知识点的好方法
- sphinx中自己提取特征参数训练声学模型参数方法探讨
- Laravel:ORM模型为自己的方法建立Observer
- 增加自己价值和竞争力的六种方法
- 给自己的博客领养一些小宠物--增加趣味性的小插件
- 关注自己朋友的SCDN博客的方法
- Atitit 学习一项技术的方法总结 目录 1. 自己动手实现学习法 1 2. 七步学习法 —— 如何高效学习一项技能 1 3. 如何快速学习一项技能-十步学习法 - HugoLester - 博客
- [前端插件]为自己的博客增加打赏功能
- 自定义表单输入验证jquery,validate,增加自己的方法,验证完并保存写入数据库
- ecshop新建增加自己做的页面(独立页面)的方法
- 12个增加博客外部链接的方法
- 使用自己的数据集创建神经网络训练模型,一篇博客就够了。
- 增加了科技博客链接方法
- Hexo博客yilia主题首页添加helper-live2d模型插件
- cocos2dx3.4 新声音引擎bug,自己修复了---带方法,希望引擎组能看到这博客验证下
- 基于java.util.logging实现轻量级日志记录库(增加根据当前类class初始化,修复线程池模型(javaEE)下的堆栈轨迹顺序与当前调用方法不一致问题)
- 利用WPF建立自己的3d gis软件(非axhost方式)(六)跳转,增加外部三维模型
- 如何快速给自己博客增加10000推荐量
- 基于java.util.logging实现轻量级日志记录库(增加根据当前类class初始化,修复线程池模型(javaEE)下的堆栈轨迹顺序与当前调用方法不一致问题)
- [前端插件]为自己的博客增加打赏功能