1、在根文件index.html中引入live2dw/lib/L2Dwidget.min.js
下载模型的文件，放在本地或者cdn
切换不同的模型
模型地址：https://github.com/xiazeyu/live2d-widget-models
showLive2d(name: String) {var live2dWidget = document.querySelector("#live2d-widget");if (live2dWidget) {live2dWidget.remove();// window.L2Dwidget.config = null;// window.L2Dwidget.destroy();// window.L2Dwidget.removeChild();} else {console.error("Live2D widget element not found");}// 配置文件官方API: https://l2dwidget.js.org/docs/class/src/index.js~L2Dwidget.html#instance-method-initvar config = {model: {jsonPath: "", // xxx.model.json 的路径},display: {position: "right", //看板娘的表现位置leftwidth: 200, //宽度height: 250, //高度hOffset: 255, //h偏移vOffset: 155,//v偏移},tagMode: false,debug: false,mobile: {show: true, // 是否在移动设备上显示scale: 1, // 移动设备上的缩放motion: true, // 移动设备是否开启重力感应},react: {opacityDefault: 1, // 默认透明度opacityOnHover: 1, // 鼠标移上透明度},};config.model.jsonPath =你的本地地址或者线上地址 + "/live2dw/live2d-widget-model-" +name +"/assets/" +name +".model.json";console.log("[ config.model.jsonPath ] >", name, config.model.jsonPath);try {window.L2Dwidget.config.model.jsonPath = config.model.jsonPath;//必须得改这里，否则修改模型地址不改变} catch (error) {}setTimeout(() => {window.L2Dwidget.init(config);}, 100);// 注释掉的 是百度的例子// setTimeout(() => {// window.L2Dwidget.init({// model: {// jsonPath:// "https://yjy.yiyiny.com/static/live2dw/live2d-widget-model-" +// name +// "/assets/" +// name +// ".model.json",// scale: 1,// hHeadPos: 0.5,// vHeadPos: 0.618,// },// dialog: {// enable: true,// script: {// //每20s，显示一言（调用一言Api返回的句子）// "every idle 20s": "$hitokoto$",// "hover div": "星星在天上而你在我心里 (*/ω＼*)",// //触摸到身体// "tap body": "害羞⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄",// //触摸到头部// "tap face": "~~",// },// },// mobile: { show: true, scale: 0.5 },// display: {// superSample: 2,// width: 200,// height: 400,// position: "right",// hOffset: 0,// vOffset: 0,// },// react: { opacityDefault: 0.7, opacityOnHover: 0.2 },// name: {// canvas: "Live2dCanvas1",// },// });// }, 1000);// window.L2Dwidget.init({// //对人物的属性配置// // pluginRootPath: "../live2dw/", //人物文件夹的位置// // pluginJsPath: "lib/",// // pluginModelPath: "live2d-widget-model-shizuku/assets/",// model: {// jsonPath:// "https://yjy.yiyiny.com/static/live2dw/live2d-widget-model-" +// name +// "/assets/" +// name +// ".model.json",// },// dialog: {// enable: true, //是否开启对话框// hitokoto: true,// script: {// //每20s，显示一言（调用一言Api返回的句子）// // "every idle 20s": "$hitokoto$",// // //触摸到class='star'对象,将会展示的文字// // "hover .star": "星星在天上而你在我心里 (*/ω＼*)",// //触摸到身体// "tap body": "害羞⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄",// //触摸到头部// "tap face": "人家是在认真写博客哦--前端妹子",// },// },// display: {// //人物的属性配置// superSample: 2,// position: "left",// width: 150,// height: 500,// hOffset: 200, // 横向偏移// vOffset: 200, // 纵向偏移// },// mobile: {// show: false, //是否在移动端展示// scale: 0.5, //t透明度// },// });},
