<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://unpkg.com/live2d-widget-model-chitose@1.0.5/assets/chitose.model.json",
"scale":
},
"display": {
"position": "right", //看板娘的表现位置
"width": , //小萝莉的宽度
"height": , //小萝莉的高度
"hOffset": ,
"vOffset": -
},
"mobile": {
"show": true,
"scale": 0.5
},
"react": {
"opacityDefault": 0.7,
"opacityOnHover": 0.2
}
});
</script>

当然你可以通过修改模型切换显示不同的小萝莉,以下是模型列表:

通过替换上面jsonPath中的live2d-widget-model-chitose来修改小萝莉,

替换的小萝莉效果可以参考这里,点我(引用下大佬的链接,笔芯)

  • live2d-widget-model-chitose
  • live2d-widget-model-epsilon2_1
  • live2d-widget-model-gf
  • live2d-widget-model-haru/01 (use npm install --save live2d-widget-model-haru)
  • live2d-widget-model-haru/02 (use npm install --save live2d-widget-model-haru)
  • live2d-widget-model-haruto
  • live2d-widget-model-hibiki
  • live2d-widget-model-hijiki
  • live2d-widget-model-izumi
  • live2d-widget-model-koharu
  • live2d-widget-model-miku
  • live2d-widget-model-ni-j
  • live2d-widget-model-nico
  • live2d-widget-model-nietzsche
  • live2d-widget-model-nipsilon
  • live2d-widget-model-nito
  • live2d-widget-model-shizuku
  • live2d-widget-model-tororo
  • live2d-widget-model-tsumiki
  • live2d-widget-model-unitychan
  • live2d-widget-model-wanko
  • live2d-widget-model-z16
<!--
其他可选的模型:
黑猫:https://unpkg.com/live2d-widget-model-hijiki@1.0.5/assets/hijiki.model.json
萌娘:https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json
白猫:https://unpkg.com/live2d-widget-model-tororo@1.0.5/assets/tororo.model.json
狗狗:https://unpkg.com/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json
小可爱:https://unpkg.com/live2d-widget-model-z16@1.0.5/assets/z16.model.json
小可爱:https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json
-->

关于live2D的使用的更多相关文章

  1. Live2D WebGL实现

    demo预览:http://www.kakinuma.date/l2d.html 官方:http://www.live2d.com/en/ sdk下载:https://link.zhihu.com/? ...

  2. 【Android】用Cubism 2制作自己的Live2D——官方App样例源码学习(1)!

    前言- 上几篇文章,我们一个一个的研究了Cubism官方提供的Android使用Live2D的简单例子,但是依旧和大家平时见到的还是有很大差距的.在研究了代码差不多一周以后,我决定还是用文字的形式记录 ...

  3. 【Android】用Cubism 2制作自己的Live2D——来制作动态壁纸吧!

    前言- Andorid SDK下载  baidu云 提取码:19jm 这次我们就来研究一下官方的例子之一的liveWallPaper,也就是开发Android的动态壁纸 先来看看这个例子运行的结果: ...

  4. 【Android】用Cubism 2制作自己的Live2D——android sdk样本的下载与Android studio编译!

    前言- 在浏览Live2d说明书的时候我无意中发现了一个有趣的东西,就是android sdk中居然自带动态壁纸!那就让我们来试试吧,说明书此页的网址连接——中文版||日文版 Android开发所必需 ...

  5. 【Android】用Cubism 2制作自己的Live2D——官方App样例源码学习(2)!

    前言- 明确了项目目录的结构,但是结构什么的也太"抽象"了. 本篇开始上代码! 模型的绘制- 前几天的学习中,live2d的绘制有了一些了解了,在Android端使用OpenGL ...

  6. 【Android】用Cubism 2制作自己的Live2D——初探Live2D在Android上的运行!

    前言- 上一次我们成功运行了官方给我们的样本,是不是很有干劲啊?!这次我们就来看看Live2D是怎么在手机上运行的! 准备- 上次运行成功的官方样本——第一次我们先看简单的,就是那个名字叫Sample ...

  7. 【Android】用Cubism 2制作自己的Live2D——软件的安装与破解!

    前言- 上文我们简单的了解了Cubism的情况,但是Cubism 2.X安装好以后如果不进行破解只能使用Free版本,这是我们接受不了的,我们是专业的.是来学习的,怎么能不用Pro版本呢?所以话不多说 ...

  8. 【Android】用Cubism 2制作自己的Live2D——初见!

    前言- 现在很多手游的UI上都不约而同的放置一个Live2D模型,这仿佛已经成为了一个业界的潜规则之类的东西.作为一名深受手机游戏毒害的90后,我也没有忘记小时候励志当一名技术宅的梦想,也想试试自己做 ...

  9. live2d+cocos2dx示例工程

    环境 : win10 64bit visual studio 2013 cocos2d-x-3.9 Live2D_SDK_OpenGL_2.0.06_2_sample_3.3_en 首先安装visua ...

  10. 用ECMAScript4 ( ActionScript3) 实现Unity的热更新 -- 热更新Live2D

    live2D是一个很强大的2D动画组件.我们可以使用AS3脚本对它进行热更新. live2D在Unity中的使用请看这里: 如何获取Live2D 总得来说,我们可以先去live2D官网下载它的Unit ...

随机推荐

  1. Docker NGINX 例子

    版权所有,未经许可,禁止转载 章节 Docker 介绍 Docker 和虚拟机的区别 Docker 安装 Docker Hub Docker 镜像(image) Docker 容器(container ...

  2. POJ 3461:Oulipo

    Oulipo Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 28155   Accepted: 11251 Descript ...

  3. 【分布式】流式计算Storm框架

    Storm简介: Storm起源Twitter开源的一个类似于Hadoop的实时数据处理框架,不过两则还是有区别的,Hadoop是批量处理数据,而Storm处理的是实时的数据流. Storm应用场景: ...

  4. Ubuntu16.04 在Windows10 系统下的安装(双系统)

    楼主最近升级了一个固态+8G双通道内存条,重装了一下win10和ubuntu系统,过程中遇到一些问题,push上来供自己和大家参考.比较好用的博客教程直接贴链接. 一.win10系统 学校有正版软件许 ...

  5. cf 223B.Two Strings

    神奇(%%题解) 题意:判断B串作为A串的子序列,不是不可以把A全部覆盖掉. 这样的话就是判断是不是A[i]最右匹配B的点和最左匹配B的点相交(重合)就好.(不重合的话B自然会空出中间一段,那么肯定不 ...

  6. 下页小希学MVC5+EF6.2 学习记录三

      目的:1 学习mvc+ef 2  写下日记也是对自己的督促 期待已久的EF终于来了. 学完本篇文章,你将会掌握基于EF数据模型的完整开发流程. 本次将会完成EF数据模型的搭建和使用. 基于这个模型 ...

  7. SpringBoot之Order注解启动顺序

    order的规则: order的值越小,优先级越高order如果不标注数字,默认最低优先级,因为其默认值是int最大值该注解等同于实现Ordered接口getOrder方法,并返回数字. @Reten ...

  8. 【数据结构】二叉树的遍历(前、中、后序及层次遍历)及leetcode107题python实现

    文章目录 二叉树及遍历 二叉树概念 二叉树的遍历及python实现 二叉树的遍历 python实现 leetcode107题python实现 题目描述 python实现 二叉树及遍历 二叉树概念 二叉 ...

  9. 吴裕雄--天生自然Django框架开发笔记:Django 模型

    Django 对各种数据库提供了很好的支持,包括:PostgreSQL.MySQL.SQLite.Oracle. Django 为这些数据库提供了统一的调用API. 可以根据自己业务需求选择不同的数据 ...

  10. 吴裕雄--天生自然 JAVASCRIPT开发学习:语句

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...