通用导入

普通网页可以使用live2d的 hexo_live2d.js加载live2d模型,使用 jQuery.js载入资源,适配moc3。

try {
    $('body').append('<div class="waifu"  style="position: fixed; right: 1px;"><div class="waifu-tips"> </div><canvas id="live2d" class="live2d"></canvas></div>')
    $.ajax({url: "/live2d/pixi/pixi.min.js", dataType:"script", cache: true, success: function() {
        $.ajax({url: "/live2d/framework/live2dcubismpixi.js", dataType:"script", cache: true, success: function() {
            $.ajax({url: "/live2d/core/live2dcubismcore.min.js", dataType:"script", cache: true, success: function() {
                $.ajax({url: "/live2d/framework/live2dcubismframework.js", dataType:"script", cache: true, success: function() {
                    $.ajax({url:"/live2d/waifu/waifu-tips.js", dataType:"script", cache: true, success: function() {
                        $.ajax({url:"/live2d/loadModel.js", dataType:"script", cache: true, success: function() {
                            new loadModel();
                        }});
                    }});
                }});
            }});
        }});
}});} catch(err) { console.log("[Error] jQuery is not defined.") }

hexo导入

  1. 在hexo里面全局加载需要在渲染层载入，在 layout.pug添加渲染live2d模型需要的 div
    <div class="waifu"  style="position: fixed; right: 1px;"><div class="waifu-tips"> </div><canvas id="live2d" class="live2d"></canvas></div>

  2. 添加 jQuery.js和加载live2d的 hexo_live2d.js，可以放在主题的js文件夹中。

    script(src=url_for(“js/jquery-3.7.0.min.js”))

script(src=url_for(“js/hexo_live2d.js”))


## 文件配置

### loadModel.js

配置加载live2d模型的资源，此配置通用于碧蓝航线的模型。

### waifu

配置live2d模型的对话，根据需要修改。

## 源码

[源码下载](/live2d.zip)