Code Monkey home page Code Monkey logo

live2d's Introduction

live2d

live2d模型收集+展示,可直接用于静态网站

展示页面

以上页面国内访问较慢,而模型较大,可以访问以下地址:

目前共计收录128个模型。

使用说明

Live2d Cubism 2

  • 引用必要的js文件:
<script src="js/live2d.js"></script>
  • 添加canvas元素:
<canvas class="live2d" id="live2d" width="300" height="800"></canvas>
  • 添加css样式(非必须,可自定义):
<style>
    .live2d {
        position: fixed;
        bottom : 0;
        left : 0;
    }
</style>
  • 初始化live2d:
loadlive2d("live2d", "./model.json");
  • LAppDefine.js为live2d的配置文件,具体的配置信息见注释。

  • model文件夹下是live2d的模型文件,目前已收录102种,其中数种模型有可更换皮肤。 模型文件夹的目录大体如下:

+-models(模型文件夹名称)
|__+-texture(模型材质包)
|__|___texture_00.png
|__|___texture_01.png
|__|___....
|__+-motions(模型动作组)
|__+-expression(模型表情组)
|__+-sounds(模型音效)
|__model.json(模型资源分布说明文件)
|__model.moc(模型本体)

部分模型有所不同。

Live2d Cubism 3

以上内容都是基于旧的Cubism Editor 2制作与开发,现在官网老早就使用Cubism 3了(详见Cubism 3 | Live2D 已经到了Cubism 4了,不过与Cubism 3是兼容的,而且官方承诺以后的版本都向下兼容(除了Cubism 2)。

Cubism 3使用的是TypeScript,相比第二版更加稳健,但我基于AzurLaneL2DViewer这个仓库进行了一些小修改,可像Cubism 2一样直接添加模型,不需要修改核心代码。

live2d Cubism 3全部文件放在live2d_3中,可单独使用。

live2d_3/model文件夹下是Cubism 3版本的模型,目前收录了碧蓝航线里的40个模型。

相关链接

版权须知

所有模型均收集自互联网,版权均归原公司/个人所有。您可将资源用于学习、非营利性的网站或项目,不得用于商业使用(付费分发售卖资源、二次修改用于盈利等)。

live2d's People

Contributors

imuncle avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

live2d's Issues

live2d_3预览的模型不太匹配

是这样的,我预览的时候是看到了Unicon 也就是碧蓝航线独角兽的live2d模型的,调戏了一下感觉很OK,打算下载,结果并没有在live2d_3文件夹里面看到……
是出了什么锅嘛?

贴图错误?

image
加载出现脸部贴图缺失的情况??
模型是hk416mod,不过这个贴图有两张(texture_00, texture_01),但是第二张(texture_01.png)都能正确导入,反倒是第一张的脸。。。
您的cubism core版本太低了,我自己把它换成4.4的了,不知道跟这个是否有关系?(小白求指导)
不过挺好玩的,哈哈哈
另外想问问您不包含物理控制器(xxx.physics3.json)的模型应该怎么导入,我试了一个发现好像必须得加载物理控制?
image
谢谢!

模型切换

大佬,能帮忙写个切换模型的按钮吗?,
我现在是这样写的,换模型按钮不知道咋弄了

<html>
<head>
    <title>domemodel3</title>
    <meta charset="utf-8" />
    <script src=""></script>
    <script src="js/jquery.min.js"></script>
    <script src="js/live2dcubismcore.min.js"></script>
    <script src="js/pixi.min.js"></script>
    <script src="js/live2dcubismframework.js"></script>
    <script src="js/live2dcubismpixi.js"></script>
    <script src="js/l2d.js"></script>
    <script src="js/main.js"></script>
</head>
<style type="text/css">
</style>
<div class="Canvas" id="L2dCanvas"></div>
<script>
            var config = {
                basePath: 'http://127.0.0.1/sw',
                role: '4__l2d_32.u',
                opacity: 1,
                mobile: true
            }
            var v = new Viewer(config); 
</script>
</html>

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.