live2dv3's Introduction

本项目基于AzurLaneL2DViewer修改

在网页上添加 .moc3 格式的Live2d模型

使用(Usage)

在你的网页</body>标签之前添加以下内容：

<!------ 位置可自定义 ------>
<div class="Canvas" style="position: fixed; right: 10px; bottom: 10px;z-index: 99999999" id="L2dCanvas"></div>

<!------ 依赖 JS | Dependent JS ------>
<!---- 可选 | Optional ---->
<!-- 兼容低版本浏览器 | Compatible with low-level browsers -->
<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.min.js"> </script>
<!-- 音频播放兼容 | Audio playback compatible -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/howler.min.js"></script>
<!---- 必需 | Required ---->
<script src="https://cubism.live2d.com/sdk-web/cubismcore/live2dcubismcore.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/pixi.min.js"></script>
<!-- live2dv3.js -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/live2dv3.min.js"></script>

<!------ 加载Live2d模型 | Load Live2d model ------>
<script>
    window.onload = () => {
        new l2dViewer({
            el: document.getElementById('L2dCanvas'),
            basePath: 'https://cdn.jsdelivr.net/npm/live2dv3@latest/assets',
            modelName: 'biaoqiang_3',
            sounds: [
                'sounds/demo.mp3', // 相对路径是相对于模型文件夹
                'https://cdn.jsdelivr.net/npm/live2dv3@latest/assets/biaoqiang_3/sounds/demo.mp3' // 也可以是网址
            ]
        })
    }
</script>

参数

参数	类型	描述	默认
`el`	[必需] DOM 对象或 jQuery 对象	要挂载Live2d模型的元素, 支持DOM选择器和jQuery选择器，例：`document.getElementById('L2dCanvas')`或`document.querySelector('#L2dCanvas')`或`$('#L2dCanvas')`	`null`
`basePath`	[必需] String	模型根目录	`null`
`modelName`	[必需] String	模型目录	`null`
`width`	[可选] Number	Canvas宽度，单位: `px`	`500`
`height`	[可选] Number	Canvas高度，单位: `px`	`300`
`sizeLimit`	[可选] Boolean	当窗口大小小于设置的宽或高时不加载模型	`false`
`mobileLimit`	[可选] Boolean	移动端不加载模型	`false`
`sounds`	[可选] Array	触摸播放声音，留空则不播放	`null`

方法

loadModel(`modelName`?)

重新加载/更换模型

live2dv3's People

Contributors

Stargazers

Watchers

live2dv3's Issues

本地资源加载出错

basePath换成本地相对地址后出错（开了跨域）
报错信息
Uncaught TypeError: Cannot read property '_ptr' of null
at new Model (live2dcubismcore.min.js:1)
at Function.Model.fromMoc (live2dcubismcore.min.js:1)
at live2dv3.js:1594
at t.value (mini-signals.js:93)
at e.t._onComplete (Loader.js:568)
at Loader.js:608
at s (async.js:27)
at e. (interactiveTarget.js:82)
at Loader.js:590
at async.js:35