{"id":1609,"date":"2025-11-13T21:55:00","date_gmt":"2025-11-13T13:55:00","guid":{"rendered":"https:\/\/www.admiralspee.site\/?p=1609"},"modified":"2026-01-15T00:56:41","modified_gmt":"2026-01-14T16:56:41","slug":"%e5%bc%80%e5%8f%91%e6%97%a5%e5%bf%97-%e5%9c%a8%e7%bd%91%e9%a1%b5%e9%87%8c%e5%88%b6%e4%bd%9c%e4%b8%80%e5%9c%ba%e7%ae%80%e5%8d%95%e7%9a%84live2d%e6%bc%94%e5%87%ba","status":"publish","type":"post","link":"https:\/\/www.admiralspee.site\/en\/archives\/1609","title":{"rendered":"\u5f00\u53d1\u65e5\u5fd7 | \u5728\u7f51\u9875\u91cc\u5236\u4f5c\u4e00\u573a\u7b80\u5355\u7684Live2D\u6f14\u51fa"},"content":{"rendered":"<p>\u6700\u8fd1\u770b\u4e86\u521d\u97f3\u672a\u6765\u7684\u7535\u5f71\uff0c\u6df1\u4e3a\u611f\u52a8\u3002\u5982\u679c\u8bf4\u521d\u97f3\u672a\u6765\u201c\u9690\u85cf\u201d\u5728WiFi\u91cc\uff0c\u624b\u673a\u91cc\uff0c\u90a3\u4e48\u80af\u5b9a\u4e5f\u53ef\u4ee5\u4f7f\u7528\u67d0\u79cd\u65b9\u5f0f\u8ba9\u5979\u771f\u6b63\u51fa\u73b0\u5728\u7f51\u9875\u91cc\u3002<\/p>\n\n\n\n<p>\u4e00\u822c\u6765\u8bf4\uff0c\u5728\u7f51\u9875\u4e0a\u653e\u7f6e\u4e8c\u6b21\u5143\u89d2\u8272\u90fd\u4f1a\u4f7f\u7528Live2D\uff0c\u5bf9\u5e94\u7684\u5c31\u9700\u8981\u627e\u5230\u521d\u97f3\u672a\u6765\u7684Live2D\u6a21\u578b\u548c\u5408\u9002\u7684Live2D\u5f15\u64ce\u3002\u4e00\u5f00\u59cb\u6a21\u578b\u8fd8\u6bd4\u8f83\u96be\u627e\uff0c\u7f51\u4e0a\u5f00\u6e90\u7684\u6a21\u578b\u90fd\u6781\u5176\u53e4\u8001\uff0c\u51e0\u4f55\u6ca1\u6709\u770b\u5f97\u4e0a\u773c\u7684\u3002\u540e\u6765\u5076\u7136\u95f4\u627e\u5230\u4e00\u4e2a\u7f51\u7ad9\uff0c\u91cc\u9762\u5f00\u6e90\u4e86\u4e16\u754c\u8ba1\u5212\u6e38\u620f\u4e2d\u6240\u6709\u7684\u7f8e\u672f\u7d20\u6750\u548c\u6a21\u578b\uff0c\u751a\u81f3\u6709\u521d\u97f3\u672a\u6765\u5728\u7535\u5f71\u4e2d\u65b0\u5f62\u8c61\u7684\u6a21\u578b\uff08\u867d\u7136\u662f\u975e\u5b98\u65b9\u7f51\u7ad9\uff0c\u4f46\u611f\u8c22\u4e16\u5609\u5f00\u6e90\uff1a<a href=\"https:\/\/sekai.best\/l2d\">Live2D | Sekai Viewer<\/a>\uff09\u3002<\/p>\n\n\n\n<p>\u6e38\u620f\u4e2d\u4f7f\u7528\u7684Live2D\u6a21\u578b\u90fd\u662f\u6700\u65b0\u7684Live2D Cubism 4.0\uff08<code>.model3.json<\/code>\uff09\uff0c\u6211\u5fc5\u987b\u627e\u4e00\u4e2a\u80fd\u591f\u652f\u6301\u8fd9\u79cd\u683c\u5f0f\u7684\u5f15\u64ce\uff0c\u6b64\u5916\u8fd8\u9700\u8981\u80fd\u591f\u6df1\u5ea6\u63a7\u5236\u52a8\u4f5c\u548c\u8868\u60c5\u3001\u4e0d\u4f9d\u8d56\u91cd\u578b\u6846\u67b6\u3001\u80fd\u591f\u5373\u63d2\u5373\u7528\u3002\u6700\u7ec8\u6211\u9501\u5b9a\u4e86PixiJS v6\u914d\u5408pixi-live2d-display\u7684\u7ec4\u5408\u3002PixiJS v6\u662f\u76ee\u524dWeb\u7aef\u6027\u80fd\u6700\u5f3a\u52b2\u76842D\u6e32\u67d3\u5f15\u64ce\u4e4b\u4e00\uff0c\u5177\u6709\u5f3a\u5927\u7684\u7ed8\u56fe\u80fd\u529b\uff0c\u800cpixi-live2d-display\u89e3\u51b3\u4e86Live2D\u5b98\u65b9\u7684\u590d\u6742\u903b\u8f91\uff0c\u63d0\u4f9b\u4e86\u4e00\u79cd\u7b80\u5316\u7684API\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u9f20\u6807\u89c6\u7ebf\u8ffd\u8e2a<\/h3>\n\n\n\n<p>\u8fd9\u4e00\u529f\u80fd\u5e38\u89c1\u4e14\u975e\u5e38\u7b80\u5355\uff0c\u539f\u7406\u662f\u5c06\u5c4f\u5e55\u5750\u6807\u6620\u5c04\u5230 Live2D \u6a21\u578b\u7684<code>ParamAngleX<\/code>\u548c<code>ParamAngleY<\/code>\u53c2\u6570\u533a\u95f4\u3002<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro padding-bottom-disabled cbp-has-line-numbers cbp-highlight-hover\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#d8dee9ff;--cbp-line-number-width:calc(1 * 0.6 * .875rem);--cbp-line-highlight-color:rgba(201, 218, 248, 0.2);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#39404f\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"62\" height=\"20\" viewbox=\"0 0 62 20\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"30\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"52\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#d8dee9ff;display:none\" aria-label=\"\u590d\u5236\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>window.addEventListener('pointermove', (event) => {\n  const rect = canvas.getBoundingClientRect();\n  const x = event.clientX - rect.left;\n  const y = event.clientY - rect.top;\n  model.focus(x, y);\n});<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #D8DEE9\">window<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">addEventListener<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">pointermove<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">(<\/span><span style=\"color: #D8DEE9\">event<\/span><span style=\"color: #ECEFF4\">)<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">rect<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">canvas<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">getBoundingClientRect<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">x<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">event<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">clientX<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">rect<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">left<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">event<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">clientY<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">rect<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">top<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">focus<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">x<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span><\/code><\/pre><span style=\"display:flex;align-items:flex-end;padding:10px;width:100%;justify-content:flex-end;background-color:#2e3440ff;color:#c8d0e0;font-size:12px;line-height:1;position:relative\">JavaScript<\/span><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u81ea\u52a8\u7728\u773c\u72b6\u6001\u673a<\/h3>\n\n\n\n<p>\u867d\u7136Live2D\u6a21\u578b\u666e\u904d\u81ea\u5e26\u201c\u81ea\u52a8\u7728\u773c\u201d\uff0c\u4f46\u662f\u5728\u8fd9\u4e2a\u9879\u76ee\u4e2d\u6211\u4e0d\u77e5\u4e3a\u4f55\u65e0\u6cd5\u8c03\u51fa\u6a21\u578b\u81ea\u5e26\u7684\u7728\u773c\u3002\u4e3a\u4e86\u4e3a\u6a21\u578b\u8d4b\u4e88\u7075\u9b42\uff0c\u6211\u4e0d\u5f97\u4e0d\u81ea\u5df1\u624b\u5199\u4e86\u4e00\u4e2a\u57fa\u4e8e\u65f6\u95f4\u589e\u91cf\u7684\u72b6\u6001\u673a\u3002\u6211\u5c06\u7728\u773c\u8fc7\u7a0b\u62c6\u89e3\u4e3a\u4e09\u4e2a\u9636\u6bb5\uff1a<\/p>\n\n\n\n<ol start=\"1\" class=\"wp-block-list\">\n<li><strong>Wait<\/strong>\uff1a\u968f\u673a\u65f6\u957f\uff082~5\u79d2\uff09\uff0c\u4fdd\u6301\u7741\u773c\u3002<\/li>\n\n\n\n<li><strong>Closing<\/strong>\uff1a\u773c\u775b\u53c2\u6570\u4ece<code>Base<\/code> -&gt; <code>0<\/code>\u3002<\/li>\n\n\n\n<li><strong>Opening<\/strong>\uff1a\u773c\u775b\u53c2\u6570\u4ece<code>0<\/code> -&gt; <code>Base<\/code>\u3002<\/li>\n<\/ol>\n\n\n\n<p>\u6838\u5fc3\u662f\u5229\u7528PixiJS\u7684<code>ticker<\/code>\u6765\u9a71\u52a8\uff0c\u5e76\u5728\u5f00\u59cb\u7728\u773c\u524d\u8bb0\u5f55\u5f53\u524d\u773c\u775b\u7684\u5f00\u5408\u5ea6\uff0c\u4ece\u800c\u9632\u6b62\u6253\u65ad\u539f\u672c\u7684\u8868\u60c5\uff08\u6bd4\u5982\u89d2\u8272\u6b63\u5904\u4e8e\u7b11\u8138\u7684\u8868\u60c5\uff0c\u7728\u773c\u540e\u4f9d\u7136\u4f1a\u56de\u5230\u7b11\u773c\uff0c\u800c\u4e0d\u662f\u5f3a\u5236\u5168\u7741\uff09\u3002<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro padding-bottom-disabled cbp-has-line-numbers cbp-highlight-hover\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#d8dee9ff;--cbp-line-number-width:calc(2 * 0.6 * .875rem);--cbp-line-highlight-color:rgba(201, 218, 248, 0.2);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#39404f\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"62\" height=\"20\" viewbox=\"0 0 62 20\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"30\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"52\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#d8dee9ff;display:none\" aria-label=\"\u590d\u5236\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>\/\/ ======= \u7728\u773c =======\nconst coreModel = model.internalModel.coreModel;\nconst EYE_L_ID = 'ParamEyeLOpen';\nconst EYE_R_ID = 'ParamEyeROpen';\n\n\/\/ \u7728\u773c\u72b6\u6001\u673a\nlet blinkState = 'wait';   \/\/ 'wait' | 'closing' | 'opening'\nlet waitTimer = 0;\nlet phaseTimer = 0;\nlet nextBlinkTime = 2 + Math.random() * 3;   \/\/ \u4e0b\u4e00\u6b21\u7728\u773c\u95f4\u9694\uff08\u79d2\uff09\nconst blinkPhaseDuration = 0.08;             \/\/ \u95ed\u773c \/ \u7741\u773c\u5404\u81ea\u65f6\u957f\uff08\u79d2\uff09\n\n\/\/ \u6bcf\u6b21\u7728\u773c\u524d\u8bb0\u5f55\u5f53\u65f6\u7684\u57fa\u7840\u773c\u775b\u5f00\u5408\nlet baseEyeL = 1.0;\nlet baseEyeR = 1.0;\n\napp.ticker.add(() => {\n  if (!coreModel) return;\n\n  \/\/ \u7528\u771f\u5b9e\u65f6\u95f4\uff0c\u6bcf\u5e27\u6beb\u79d2 \/ 1000\n  const dt = app.ticker.deltaMS \/ 1000;\n\n  if (blinkState === 'wait') {\n    \/\/ \u7b49\u5f85\u4e0b\u4e00\u6b21\u7728\u773c\n    waitTimer += dt;\n    if (waitTimer >= nextBlinkTime) {\n      waitTimer = 0;\n      blinkState = 'closing';\n      phaseTimer = 0;\n\n      \/\/ \u6bcf\u6b21\u7728\u773c\u524d\uff0c\u8bb0\u5f55\u5f53\u524d\u773c\u775b\u57fa\u7840\u503c\n      baseEyeL = coreModel.getParameterValueById(EYE_L_ID);\n      baseEyeR = coreModel.getParameterValueById(EYE_R_ID);\n    }\n  } else if (blinkState === 'closing') {\n    \/\/ \u4ece baseEye -> 0 \u7684\u95ed\u773c\u9636\u6bb5\n    phaseTimer += dt;\n    let t = phaseTimer \/ blinkPhaseDuration;\n    if (t > 1) t = 1;\n\n    const vL = baseEyeL * (1 - t);\n    const vR = baseEyeR * (1 - t);\n    coreModel.setParameterValueById(EYE_L_ID, vL);\n    coreModel.setParameterValueById(EYE_R_ID, vR);\n\n      if (t >= 1) {\n        blinkState = 'opening';\n        phaseTimer = 0;\n      }\n    } else if (blinkState === 'opening') {\n      \/\/ \u4ece 0 -> baseEye \u7684\u7741\u773c\u9636\u6bb5\n    phaseTimer += dt;\n    let t = phaseTimer \/ blinkPhaseDuration;\n    if (t > 1) t = 1;\n\n    const vL = baseEyeL * t;\n    const vR = baseEyeR * t;\n    coreModel.setParameterValueById(EYE_L_ID, vL);\n    coreModel.setParameterValueById(EYE_R_ID, vR);\n\n    if (t >= 1) {\n      blinkState = 'wait';\n      waitTimer = 0;\n      nextBlinkTime = 2 + Math.random() * 3;   \/\/ \u4e0b\u4e00\u6b21\u7728\u773c\u95f4\u9694\u518d\u968f\u673a\n    }\n  }\n}<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #616E88\">\/\/ ======= \u7728\u773c =======<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">coreModel<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">internalModel<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">coreModel<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">EYE_L_ID<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">ParamEyeLOpen<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">EYE_R_ID<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">ParamEyeROpen<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #616E88\">\/\/ \u7728\u773c\u72b6\u6001\u673a<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">blinkState<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">wait<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #616E88\">\/\/ &#39;wait&#39; | &#39;closing&#39; | &#39;opening&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">waitTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">phaseTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">nextBlinkTime<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">2<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">+<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">Math<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">random<\/span><span style=\"color: #D8DEE9FF\">() <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">3<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #616E88\">\/\/ \u4e0b\u4e00\u6b21\u7728\u773c\u95f4\u9694\uff08\u79d2\uff09<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">blinkPhaseDuration<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0.08<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">             <\/span><span style=\"color: #616E88\">\/\/ \u95ed\u773c \/ \u7741\u773c\u5404\u81ea\u65f6\u957f\uff08\u79d2\uff09<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #616E88\">\/\/ \u6bcf\u6b21\u7728\u773c\u524d\u8bb0\u5f55\u5f53\u65f6\u7684\u57fa\u7840\u773c\u775b\u5f00\u5408<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">baseEyeL<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1.0<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">baseEyeR<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1.0<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9\">app<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">ticker<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">add<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #81A1C1\">!<\/span><span style=\"color: #D8DEE9\">coreModel<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #81A1C1\">return;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">  <\/span><span style=\"color: #616E88\">\/\/ \u7528\u771f\u5b9e\u65f6\u95f4\uff0c\u6bcf\u5e27\u6beb\u79d2 \/ 1000<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">dt<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">app<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">ticker<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">deltaMS<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">\/<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1000<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">blinkState<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">===<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">wait<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ \u7b49\u5f85\u4e0b\u4e00\u6b21\u7728\u773c<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">waitTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">+=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">dt<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">waitTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">nextBlinkTime<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">waitTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">blinkState<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">closing<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">phaseTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">      <\/span><span style=\"color: #616E88\">\/\/ \u6bcf\u6b21\u7728\u773c\u524d\uff0c\u8bb0\u5f55\u5f53\u524d\u773c\u775b\u57fa\u7840\u503c<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">baseEyeL<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">coreModel<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">getParameterValueById<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">EYE_L_ID<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">baseEyeR<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">coreModel<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">getParameterValueById<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">EYE_R_ID<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">else<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">blinkState<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">===<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">closing<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ \u4ece baseEye -&gt; 0 \u7684\u95ed\u773c\u9636\u6bb5<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">phaseTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">+=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">dt<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">phaseTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">\/<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">blinkPhaseDuration<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">vL<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">baseEyeL<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">vR<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">baseEyeR<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">coreModel<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">setParameterValueById<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">EYE_L_ID<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">vL<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">coreModel<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">setParameterValueById<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">EYE_R_ID<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">vR<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #D8DEE9\">blinkState<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">opening<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #D8DEE9\">phaseTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">else<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">blinkState<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">===<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">opening<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">      <\/span><span style=\"color: #616E88\">\/\/ \u4ece 0 -&gt; baseEye \u7684\u7741\u773c\u9636\u6bb5<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">phaseTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">+=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">dt<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">phaseTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">\/<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">blinkPhaseDuration<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">vL<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">baseEyeL<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">vR<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">baseEyeR<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">coreModel<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">setParameterValueById<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">EYE_L_ID<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">vL<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">coreModel<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">setParameterValueById<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">EYE_R_ID<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">vR<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">t<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">blinkState<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">wait<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">waitTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">nextBlinkTime<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">2<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">+<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">Math<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">random<\/span><span style=\"color: #D8DEE9FF\">() <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">3<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #616E88\">\/\/ \u4e0b\u4e00\u6b21\u7728\u773c\u95f4\u9694\u518d\u968f\u673a<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><\/span><\/code><\/pre><span style=\"display:flex;align-items:flex-end;padding:10px;width:100%;justify-content:flex-end;background-color:#2e3440ff;color:#c8d0e0;font-size:12px;line-height:1;position:relative\">JavaScript<\/span><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u54cd\u5e94\u5f0f\u5e03\u5c40<\/h3>\n\n\n\n<p>PC\u548cMobile\u7684\u5c55\u793a\u903b\u8f91\u622a\u7136\u4e0d\u540c\uff1a<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>PC<\/strong>\uff1a\u5bbd\u5c4f\uff0c\u89d2\u8272\u5e94\u8be5\u7acb\u5728\u5c4f\u5e55\u4e2d\u4e0b\u90e8\uff0c\u4e0d\u4f1a\u906e\u6321\u8fc7\u591a\u7684\u753b\u9762\u3002<\/li>\n\n\n\n<li><strong>Mobile<\/strong>\uff1a\u7ad6\u5c4f\uff0c\u89d2\u8272\u9700\u8981\u5c45\u4e2d\u653e\u5927\u624d\u80fd\u770b\u6e05\uff0c\u51e0\u4e4e\u8981\u5145\u65a5\u6574\u4e2a\u753b\u9762\u3002<\/li>\n<\/ul>\n\n\n\n<p>\u6211\u5c01\u88c5\u4e86\u4e00\u4e2a<code>layoutModel<\/code>\u51fd\u6570\uff0c\u5728\u7a97\u53e3Resize\u65f6\u81ea\u52a8\u8ba1\u7b97\u6a21\u578b\u7684\u663e\u793a\u5c3a\u5bf8\u548c\u4f4d\u7f6e\uff0c\u4ece\u800c\u5728\u4e24\u79cd\u663e\u793a\u8bbe\u5907\u4e0a\u90fd\u80fd\u8fbe\u5230\u6700\u597d\u7684\u663e\u793a\u6548\u679c\u3002<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro padding-bottom-disabled cbp-has-line-numbers cbp-highlight-hover\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#d8dee9ff;--cbp-line-number-width:calc(2 * 0.6 * .875rem);--cbp-line-highlight-color:rgba(201, 218, 248, 0.2);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#39404f\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"62\" height=\"20\" viewbox=\"0 0 62 20\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"30\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"52\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#d8dee9ff;display:none\" aria-label=\"\u590d\u5236\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>function layoutModel() {\n  \/\/ \u7528\u5b9e\u9645 DOM \u5c3a\u5bf8\uff0c\u800c\u4e0d\u662f renderer \u5185\u90e8\u5c3a\u5bf8\n  const rect = wrapper.getBoundingClientRect();\n  const w = rect.width;\n  const h = rect.height;\n\n  const isMobile = window.innerWidth &lt;= 768;   \n\n  if (isMobile) {\n    \/\/ \u2014\u2014 \u624b\u673a\uff1a\u4eba\u7269\u653e\u5c4f\u5e55\u6b63\u4e2d\uff0c\u7a0d\u5fae\u504f\u4e0b\u4e00\u70b9 \u2014\u2014 \n    model.anchor.set(0.5, 0.5);    \/\/ \u4ee5\u4eba\u7269\u4e2d\u5fc3\u4e3a\u951a\u70b9\n    model.scale.set(0.25);         \n\n    model.x = w * 0.5;\n    model.y = h * 0.5;            \/\/ 0.5 \u6b63\u4e2d\uff0c0.55 \u7a0d\u5fae\u504f\u4e0b\n  } else {\n    \/\/ \u2014\u2014 PC\uff1a\u7ad9\u5728\u5e95\u90e8\u4e2d\u592e \u2014\u2014\n    model.anchor.set(0.5, 0.35);    \/\/ \u811a\u9644\u8fd1\u4e3a\u951a\u70b9\n    model.scale.set(0.3);\n\n    model.x = w * 0.5;\n    model.y = h * 0.5;\n  }\n}<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #81A1C1\">function<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">layoutModel<\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">  <\/span><span style=\"color: #616E88\">\/\/ \u7528\u5b9e\u9645 DOM \u5c3a\u5bf8\uff0c\u800c\u4e0d\u662f renderer \u5185\u90e8\u5c3a\u5bf8<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">rect<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">wrapper<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">getBoundingClientRect<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">w<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">rect<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">width<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">h<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">rect<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">height<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">isMobile<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">window<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">innerWidth<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&lt;=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">768<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">   <\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">isMobile<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ \u2014\u2014 \u624b\u673a\uff1a\u4eba\u7269\u653e\u5c4f\u5e55\u6b63\u4e2d\uff0c\u7a0d\u5fae\u504f\u4e0b\u4e00\u70b9 \u2014\u2014 <\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">anchor<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">set<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">0.5<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0.5<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #616E88\">\/\/ \u4ee5\u4eba\u7269\u4e2d\u5fc3\u4e3a\u951a\u70b9<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">scale<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">set<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">0.25<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">         <\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">x<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">w<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0.5<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">h<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0.5<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">            <\/span><span style=\"color: #616E88\">\/\/ 0.5 \u6b63\u4e2d\uff0c0.55 \u7a0d\u5fae\u504f\u4e0b<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">else<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ \u2014\u2014 PC\uff1a\u7ad9\u5728\u5e95\u90e8\u4e2d\u592e \u2014\u2014<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">anchor<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">set<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">0.5<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0.35<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #616E88\">\/\/ \u811a\u9644\u8fd1\u4e3a\u951a\u70b9<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">scale<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">set<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">0.3<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">x<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">w<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0.5<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">model<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">h<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0.5<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><\/span><\/code><\/pre><span style=\"display:flex;align-items:flex-end;padding:10px;width:100%;justify-content:flex-end;background-color:#2e3440ff;color:#c8d0e0;font-size:12px;line-height:1;position:relative\">JavaScript<\/span><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u6e32\u67d3\u4f18\u5316<\/h3>\n\n\n\n<p>\u5728 PC \u7aef\u76f4\u63a5\u6e32\u67d3Canvas\u95ee\u9898\u4e0d\u5927\uff0c\u4f46\u5728\u9ad8DPR\uff08\u8bbe\u5907\u50cf\u7d20\u6bd4\uff09\u7684\u624b\u673a\u4e0a\uff0c\u5982\u679c\u6309\u7167\u9ed8\u8ba4\u7684<code>window.devicePixelRatio<\/code>\u6e32\u67d3\uff0cCanvas\u7684\u5206\u8fa8\u7387\u4f1a\u7206\u70b8\uff0c\u5bfc\u81f4\u624b\u673a\u53d1\u70ed\u3001\u6389\u5e27\u751a\u81f3Crash\u3002<\/p>\n\n\n\n<p>\u6211\u5728\u521d\u59cb\u5316<code>PIXI.Application<\/code>\u524d\u505a\u4e86\u4e00\u4e2a\u5173\u952e\u7684\u6570\u5b66\u9650\u5236\uff0c\u4ece\u800c\u964d\u4f4e\u624b\u673a\u8bbe\u5907\u7684\u6e32\u67d3\u538b\u529b\u3002<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro padding-bottom-disabled cbp-has-line-numbers cbp-highlight-hover\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#d8dee9ff;--cbp-line-number-width:calc(2 * 0.6 * .875rem);--cbp-line-highlight-color:rgba(201, 218, 248, 0.2);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#39404f\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"62\" height=\"20\" viewbox=\"0 0 62 20\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"30\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"52\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#d8dee9ff;display:none\" aria-label=\"\u590d\u5236\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>\/\/ \u83b7\u53d6\u8bbe\u5907\u50cf\u7d20\u6bd4\uff0c\u4f46\u5f3a\u5236\u9650\u5236\u6700\u5927\u4e3a 2\u3002\n\/\/ \u5f88\u591a\u65d7\u8230\u673a DPR \u662f 3 \u6216 4\uff0c\u6e32\u67d3\u538b\u529b\u6210\u500d\u589e\u52a0\uff0c\u4f46\u8089\u773c\u89c2\u611f\u63d0\u5347\u6709\u9650\u3002\nconst RESOLUTION = Math.min(window.devicePixelRatio || 1, 2);\n\nconst app = new PIXI.Application({\n  view: canvas,\n  autoStart: true,\n  transparent: true,\n  autoDensity: true,           \/\/ \u4ecd\u7136\u81ea\u9002\u5e94 DPR\n  resolution: RESOLUTION,      \/\/ \u4f46\u6700\u591a\u653e\u5927\u5230 2 \u500d\n  antialias: true,\n});<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #616E88\">\/\/ \u83b7\u53d6\u8bbe\u5907\u50cf\u7d20\u6bd4\uff0c\u4f46\u5f3a\u5236\u9650\u5236\u6700\u5927\u4e3a 2\u3002<\/span><\/span>\n<span class=\"line\"><span style=\"color: #616E88\">\/\/ \u5f88\u591a\u65d7\u8230\u673a DPR \u662f 3 \u6216 4\uff0c\u6e32\u67d3\u538b\u529b\u6210\u500d\u589e\u52a0\uff0c\u4f46\u8089\u773c\u89c2\u611f\u63d0\u5347\u6709\u9650\u3002<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">RESOLUTION<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">Math<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">min<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">window<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">devicePixelRatio<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">||<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">2<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">app<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">new<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">PIXI<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">Application<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #88C0D0\">view<\/span><span style=\"color: #ECEFF4\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">canvas<\/span><span style=\"color: #ECEFF4\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #88C0D0\">autoStart<\/span><span style=\"color: #ECEFF4\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">true<\/span><span style=\"color: #ECEFF4\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #88C0D0\">transparent<\/span><span style=\"color: #ECEFF4\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">true<\/span><span style=\"color: #ECEFF4\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #88C0D0\">autoDensity<\/span><span style=\"color: #ECEFF4\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">true<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\">           <\/span><span style=\"color: #616E88\">\/\/ \u4ecd\u7136\u81ea\u9002\u5e94 DPR<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #88C0D0\">resolution<\/span><span style=\"color: #ECEFF4\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">RESOLUTION<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #616E88\">\/\/ \u4f46\u6700\u591a\u653e\u5927\u5230 2 \u500d<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #88C0D0\">antialias<\/span><span style=\"color: #ECEFF4\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">true<\/span><span style=\"color: #ECEFF4\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span><\/code><\/pre><span style=\"display:flex;align-items:flex-end;padding:10px;width:100%;justify-content:flex-end;background-color:#2e3440ff;color:#c8d0e0;font-size:12px;line-height:1;position:relative\">JavaScript<\/span><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u97f3\u4e50\u81ea\u52a8\u64ad\u653e\u7b56\u7565<\/h3>\n\n\n\n<p>\u5f00\u53d1\u4e2d\u9047\u5230\u7684\u4e00\u4e2a\u95ee\u9898\u662fChrome\u53ef\u80fd\u4f1a\u7981\u6b62\u97f3\u9891\u81ea\u52a8\u64ad\u653e\u3002\u5982\u679c\u76f4\u63a5\u8c03\u7528<code>bgm.play()<\/code>\uff0c\u63a7\u5236\u53f0\u4f1a\u62a5<code>DOMException<\/code>\u3002\u6240\u4ee5\u6211\u8bbe\u8ba1\u4e86\u4e00\u5957Promise\u94fe\u5f0f\u515c\u5e95\u65b9\u6848\uff0c\u4fdd\u8bc1\u4e86\u65e0\u8bba\u6d4f\u89c8\u5668\u7b56\u7565\u5982\u4f55\u4e25\u683c\uff0c\u7528\u6237\u53ea\u8981\u4e0e\u9875\u9762\u4ea7\u751f\u4ea4\u4e92\uff0c\u6f14\u51fa\u5c31\u80fd\u987a\u5229\u5f00\u59cb\u3002<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro padding-bottom-disabled cbp-has-line-numbers cbp-highlight-hover\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#d8dee9ff;--cbp-line-number-width:calc(2 * 0.6 * .875rem);--cbp-line-highlight-color:rgba(201, 218, 248, 0.2);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#39404f\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"62\" height=\"20\" viewbox=\"0 0 62 20\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"30\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"52\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#d8dee9ff;display:none\" aria-label=\"\u590d\u5236\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>function startBgmAndLyrics() {\n  bgm.play().then(() => {\n    \/\/ Case A: \u6d4f\u89c8\u5668\u5141\u8bb8\u81ea\u52a8\u64ad\u653e\n    startLyrics();\n  }).catch(err => {\n    \/\/ Case B: \u88ab\u62e6\u622a\u3002\u6ce8\u518c\u4e00\u6b21\u6027\u70b9\u51fb\u4e8b\u4ef6\u3002\n    console.warn(\"\u97f3\u4e50\u81ea\u52a8\u64ad\u653e\u88ab\u6d4f\u89c8\u5668\u963b\u6b62\uff0c\u5c06\u5728\u7528\u6237\u70b9\u51fb\u9875\u9762\u540e\u5f00\u59cb\u64ad\u653e\u548c\u53f0\u8bcd\u3002\", err);\n    const resume = () => {\n      bgm.play().then(() => {\n        startLyrics();\n      }).catch(() => {});\n      document.removeEventListener('click', resume);\n    };\n    \/\/ \u7528\u6237\u70b9\u51fb\u9875\u9762\u4efb\u4f55\u5730\u65b9\uff0c\u7acb\u523b\u5f00\u59cb\n    document.addEventListener('click', resume, { once: true });\n  });\n}<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #81A1C1\">function<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">startBgmAndLyrics<\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">bgm<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">play<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">then<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ Case A: \u6d4f\u89c8\u5668\u5141\u8bb8\u81ea\u52a8\u64ad\u653e<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #88C0D0\">startLyrics<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">catch<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">err<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ Case B: \u88ab\u62e6\u622a\u3002\u6ce8\u518c\u4e00\u6b21\u6027\u70b9\u51fb\u4e8b\u4ef6\u3002<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">console<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">warn<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">\u97f3\u4e50\u81ea\u52a8\u64ad\u653e\u88ab\u6d4f\u89c8\u5668\u963b\u6b62\uff0c\u5c06\u5728\u7528\u6237\u70b9\u51fb\u9875\u9762\u540e\u5f00\u59cb\u64ad\u653e\u548c\u53f0\u8bcd\u3002<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">err<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">resume<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">bgm<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">play<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">then<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #88C0D0\">startLyrics<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">catch<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{}<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">document<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">removeEventListener<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">click<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">resume<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ \u7528\u6237\u70b9\u51fb\u9875\u9762\u4efb\u4f55\u5730\u65b9\uff0c\u7acb\u523b\u5f00\u59cb<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">document<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">addEventListener<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">click<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">resume<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">once<\/span><span style=\"color: #ECEFF4\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">true<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><\/span><\/code><\/pre><span style=\"display:flex;align-items:flex-end;padding:10px;width:100%;justify-content:flex-end;background-color:#2e3440ff;color:#c8d0e0;font-size:12px;line-height:1;position:relative\">JavaScript<\/span><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">LRC\u89e3\u6790\u5f15\u64ce<\/h3>\n\n\n\n<p>\u8fd9\u662f\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u7684\u91cd\u70b9\u4e4b\u4e00\uff0c\u6211\u5e0c\u671b\u5728\u97f3\u4e50\u64ad\u653e\u7684\u540c\u65f6\uff0c\u53ef\u4ee5\u540c\u6b65\u663e\u793a\u6b4c\u8bcd\u3002\u56e0\u4e3a\u53ef\u4ee5\u5728\u7f51\u7edc\u4e0a\u76f4\u63a5\u627e\u5230\u97f3\u4e50\u5bf9\u5e94\u7684.lrc\u6b4c\u8bcd\u6587\u4ef6\uff0c\u6240\u4ee5\u6211\u53ea\u9700\u8981\u624b\u52a8\u5199\u4e00\u4e2a\u51fd\u6570\u6765\u89e3\u6790.lrc\u6587\u4ef6\u5373\u53ef\u3002<\/p>\n\n\n\n<p>\u4f46\u5b9e\u9645\u89e3\u51b3\u4e2d\u4ecd\u6709\u4e0d\u5c11\u95ee\u9898\uff0c\u6bd4\u5982\u6807\u51c6\u7684LRC\u662f<code>[mm:ss.xx]\u6b4c\u8bcd<\/code>\uff0c\u4f46\u5728\u8fd9\u4e2a\u9879\u76ee\u4e2d\uff0c\u8fd8\u9700\u8981\u989d\u5916\u8003\u8651\u7a7a\u884c\uff08\u95f4\u594f\u90e8\u5206\u4e0d\u663e\u793a\u6b4c\u8bcd\uff09\u548c\u6ca1\u6709\u65f6\u95f4\u6233\u7684\u201c\u7eed\u884c\u201d\uff08\u65e5\u6587\u6b4c\u8bcd\u548c\u4e2d\u6587\u7ffb\u8bd1\u5206\u884c\u663e\u793a\uff09\u3002<\/p>\n\n\n\n<p>\u4e3a\u6b64\u6211\u4f7f\u7528\u4e86\u4e00\u4e2a\u5f3a\u5927\u7684\u6b63\u5219\u6765\u6355\u83b7\u65f6\u95f4\uff0c\u5e76\u5904\u7406\u4e86\u7eed\u884c\u548c\u7a7a\u884c\u7684\u903b\u8f91\u3002\u914d\u5408<code>updateDialog<\/code>\u51fd\u6570\u5728<code>requestAnimationFrame<\/code>\u4e2d\u9ad8\u9891\u5bf9\u6bd4<code>audio.currentTime<\/code>\uff0c\u5b9e\u73b0\u4e86\u6781\u5176\u7cbe\u51c6\u7684\u5b57\u5e55\u663e\u793a\u3002<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro padding-bottom-disabled cbp-has-line-numbers cbp-highlight-hover\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#d8dee9ff;--cbp-line-number-width:calc(3 * 0.6 * .875rem);--cbp-line-highlight-color:rgba(201, 218, 248, 0.2);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#39404f\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"62\" height=\"20\" viewbox=\"0 0 62 20\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"30\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"52\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#d8dee9ff;display:none\" aria-label=\"\u590d\u5236\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>function parseLRC(text) {\n  const lines   = text.split('\\n');\n  const result  = [];\n  let lastEntry = null;\n\n  for (let raw of lines) {\n    const line = raw.replace(\/\\r\/g, '');\n    if (!line.trim()) continue;  \/\/ \u7a7a\u884c\u76f4\u63a5\u8df3\u8fc7\n\n    \/\/ \u652f\u6301 &#91;00:00.59&#93; \u6216 &#91;00:00&#93; \u683c\u5f0f\n    \/\/ Group 1: \u5206, Group 2: \u79d2, Group 3: \u6beb\u79d2\n    const match = line.match(\/\\&#91;(\\d{2}):(\\d{2})(?:\\.(\\d{1,3}))?&#93;\/);\n    \/\/ \u8ba1\u7b97\u603b\u79d2\u6570\n    if (match) {\n      const min = parseInt(match&#91;1&#93;, 10);\n      const sec = parseInt(match&#91;2&#93;, 10);\n      const ms  = match&#91;3&#93; ? parseInt(match&#91;3&#93;.padEnd(3, '0'), 10) : 0;\n      const content = line\n        .replace(\/\\&#91;\\d{2}:\\d{2}(?:\\.\\d{1,3})?&#93;\/, '')\n        .trim();  \/\/ \u5141\u8bb8\u4e3a\u7a7a\uff0c\u7528\u6765\u5173\u6c14\u6ce1\n\n      const entry = {\n        time: min * 60 + sec + ms \/ 1000,\n        text: content\n      };\n      result.push(entry);\n      lastEntry = entry;\n    } else {\n      \/\/ \u65e0\u65f6\u95f4\u6807\u7b7e\u4f46\u6709\u6587\u5b57\uff1a\u4f5c\u4e3a\u4e0a\u4e00\u53e5\u7684\u201c\u7eed\u884c\u201d\n      if (lastEntry) {\n        if (lastEntry.text) {\n          lastEntry.text += '\\n' + line.trim();\n        } else {\n          lastEntry.text = line.trim();\n        }\n      }\n    }\n  }\n  return result.sort((a, b) => a.time - b.time);\n}\n\nconst scriptData   = parseLRC(lrcText);\nlet currentIndex   = -1;\nlet finishedOnce   = false;\nlet lyricsStarted  = false;\nlet dialogTimer    = null;\nlet startTime      = 0;   \/\/ \u53f0\u8bcd\u5f00\u59cb\u7684\u65f6\u95f4\u6233\uff08\u6beb\u79d2\uff09\n\n\/\/ ======= \u53f0\u8bcd\u5237\u65b0\u51fd\u6570 =======\nfunction updateDialog() {\n  if (!scriptData.length) return;\n\n  const elapsed = (Date.now() - startTime) \/ 1000; \/\/ \u79d2\n  let idx = currentIndex;\n\n  for (let i = scriptData.length - 1; i >= 0; i--) {\n    if (elapsed >= scriptData&#91;i&#93;.time) {\n      idx = i;\n      break;\n    }\n  }\n\n  if (idx !== currentIndex &amp;&amp; idx >= 0) {\n    currentIndex = idx;\n    const line = scriptData&#91;idx&#93;;\n\n    if (line.text &amp;&amp; line.text.length > 0) {\n      dialogBox.textContent = line.text;\n      dialogBox.classList.add('show');\n    } else {\n      dialogBox.textContent = \"\";\n      dialogBox.classList.remove('show');\n    }\n  }\n\n  const lastTime = scriptData&#91;scriptData.length - 1&#93;.time;\n  if (!finishedOnce &amp;&amp; elapsed >= lastTime) {\n    finishedOnce = true;\n\n    (async () => {\n      playFaceMotion('face_band_smile_08');\n      await delay(300);\n      playBodyMotion('w-adult01-shakehand');\n      await delay(4000);\n      playBodyMotion('w-normal01-glad');\n    })();\n\n    if (dialogTimer) {\n      clearInterval(dialogTimer);\n      dialogTimer = null;\n    }\n  }\n}\n\n\/\/ ======= \u97f3\u4e50 + \u53f0\u8bcd\u542f\u52a8\u51fd\u6570 =======\nfunction startLyrics() {\n  if (lyricsStarted) return;\n  lyricsStarted = true;\n  startTime     = Date.now();\n  dialogTimer   = setInterval(updateDialog, 100);\n}<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #81A1C1\">function<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">parseLRC<\/span><span style=\"color: #ECEFF4\">(<\/span><span style=\"color: #D8DEE9\">text<\/span><span style=\"color: #ECEFF4\">)<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">lines<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">text<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">split<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #EBCB8B\">\\n<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">result<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> []<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">lastEntry<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">null;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">for<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">raw<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">of<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">lines<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">line<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">raw<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">replace<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">\/<\/span><span style=\"color: #EBCB8B\">\\r<\/span><span style=\"color: #ECEFF4\">\/<\/span><span style=\"color: #81A1C1\">g<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #81A1C1\">!<\/span><span style=\"color: #D8DEE9\">line<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">trim<\/span><span style=\"color: #D8DEE9FF\">()) <\/span><span style=\"color: #81A1C1\">continue;<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #616E88\">\/\/ \u7a7a\u884c\u76f4\u63a5\u8df3\u8fc7<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ \u652f\u6301 &#91;00:00.59&#93; \u6216 &#91;00:00&#93; \u683c\u5f0f<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ Group 1: \u5206, Group 2: \u79d2, Group 3: \u6beb\u79d2<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">match<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">line<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">match<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">\/<\/span><span style=\"color: #EBCB8B\">\\&#91;<\/span><span style=\"color: #ECEFF4\">(<\/span><span style=\"color: #EBCB8B\">\\d<\/span><span style=\"color: #81A1C1\">{2}<\/span><span style=\"color: #ECEFF4\">)<\/span><span style=\"color: #EBCB8B\">:<\/span><span style=\"color: #ECEFF4\">(<\/span><span style=\"color: #EBCB8B\">\\d<\/span><span style=\"color: #81A1C1\">{2}<\/span><span style=\"color: #ECEFF4\">)(?:<\/span><span style=\"color: #EBCB8B\">\\.<\/span><span style=\"color: #ECEFF4\">(<\/span><span style=\"color: #EBCB8B\">\\d<\/span><span style=\"color: #81A1C1\">{1,3}<\/span><span style=\"color: #ECEFF4\">))<\/span><span style=\"color: #81A1C1\">?<\/span><span style=\"color: #EBCB8B\">&#93;<\/span><span style=\"color: #ECEFF4\">\/<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ \u8ba1\u7b97\u603b\u79d2\u6570<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">match<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">min<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">parseInt<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">match<\/span><span style=\"color: #D8DEE9FF\">&#91;<\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\">&#93;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">10<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">sec<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">parseInt<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">match<\/span><span style=\"color: #D8DEE9FF\">&#91;<\/span><span style=\"color: #B48EAD\">2<\/span><span style=\"color: #D8DEE9FF\">&#93;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">10<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">ms<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">match<\/span><span style=\"color: #D8DEE9FF\">&#91;<\/span><span style=\"color: #B48EAD\">3<\/span><span style=\"color: #D8DEE9FF\">&#93; <\/span><span style=\"color: #81A1C1\">?<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">parseInt<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">match<\/span><span style=\"color: #D8DEE9FF\">&#91;<\/span><span style=\"color: #B48EAD\">3<\/span><span style=\"color: #D8DEE9FF\">&#93;<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">padEnd<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">3<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">0<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">10<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #81A1C1\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">content<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">line<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">replace<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">\/<\/span><span style=\"color: #EBCB8B\">\\&#91;\\d<\/span><span style=\"color: #81A1C1\">{2}<\/span><span style=\"color: #EBCB8B\">:\\d<\/span><span style=\"color: #81A1C1\">{2}<\/span><span style=\"color: #ECEFF4\">(?:<\/span><span style=\"color: #EBCB8B\">\\.\\d<\/span><span style=\"color: #81A1C1\">{1,3}<\/span><span style=\"color: #ECEFF4\">)<\/span><span style=\"color: #81A1C1\">?<\/span><span style=\"color: #EBCB8B\">&#93;<\/span><span style=\"color: #ECEFF4\">\/<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">trim<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #616E88\">\/\/ \u5141\u8bb8\u4e3a\u7a7a\uff0c\u7528\u6765\u5173\u6c14\u6ce1<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">entry<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #88C0D0\">time<\/span><span style=\"color: #ECEFF4\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">min<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">60<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">+<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">sec<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">+<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">ms<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">\/<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1000<\/span><span style=\"color: #ECEFF4\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #88C0D0\">text<\/span><span style=\"color: #ECEFF4\">:<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">content<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">result<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">push<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">entry<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">lastEntry<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">entry<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">else<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">      <\/span><span style=\"color: #616E88\">\/\/ \u65e0\u65f6\u95f4\u6807\u7b7e\u4f46\u6709\u6587\u5b57\uff1a\u4f5c\u4e3a\u4e0a\u4e00\u53e5\u7684\u201c\u7eed\u884c\u201d<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">lastEntry<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">lastEntry<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">text<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">          <\/span><span style=\"color: #D8DEE9\">lastEntry<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">text<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">+=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #EBCB8B\">\\n<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">+<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">line<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">trim<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">else<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">          <\/span><span style=\"color: #D8DEE9\">lastEntry<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">text<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">line<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">trim<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">return<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">result<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">sort<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">(<\/span><span style=\"color: #D8DEE9\">a<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">b<\/span><span style=\"color: #ECEFF4\">)<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">a<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">time<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">b<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">time<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">scriptData<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">parseLRC<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">lrcText<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">currentIndex<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">finishedOnce<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">false;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">lyricsStarted<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">false;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">dialogTimer<\/span><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">null;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">startTime<\/span><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #616E88\">\/\/ \u53f0\u8bcd\u5f00\u59cb\u7684\u65f6\u95f4\u6233\uff08\u6beb\u79d2\uff09<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #616E88\">\/\/ ======= \u53f0\u8bcd\u5237\u65b0\u51fd\u6570 =======<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">function<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">updateDialog<\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #81A1C1\">!<\/span><span style=\"color: #D8DEE9\">scriptData<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9FF\">length) <\/span><span style=\"color: #81A1C1\">return;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">elapsed<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">Date<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">now<\/span><span style=\"color: #D8DEE9FF\">() <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">startTime<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #81A1C1\">\/<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1000<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #616E88\">\/\/ \u79d2<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">idx<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">currentIndex<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">for<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">scriptData<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9FF\">length <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #81A1C1\">--<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">elapsed<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">scriptData<\/span><span style=\"color: #D8DEE9FF\">&#91;<\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\">&#93;<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">time<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">idx<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">break;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">idx<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">!==<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">currentIndex<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&amp;&amp;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">idx<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">currentIndex<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">idx<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">line<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">scriptData<\/span><span style=\"color: #D8DEE9FF\">&#91;<\/span><span style=\"color: #D8DEE9\">idx<\/span><span style=\"color: #D8DEE9FF\">&#93;<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">line<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">text<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&amp;&amp;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">line<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">text<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9FF\">length <\/span><span style=\"color: #81A1C1\">&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">dialogBox<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">textContent<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">line<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">text<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">dialogBox<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">classList<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">add<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">show<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">else<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">dialogBox<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">textContent<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&quot;&quot;<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">dialogBox<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">classList<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">remove<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">show<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">lastTime<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">scriptData<\/span><span style=\"color: #D8DEE9FF\">&#91;<\/span><span style=\"color: #D8DEE9\">scriptData<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9FF\">length <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\">&#93;<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">time<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #81A1C1\">!<\/span><span style=\"color: #D8DEE9\">finishedOnce<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&amp;&amp;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">elapsed<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">lastTime<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">finishedOnce<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">true;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    (<\/span><span style=\"color: #81A1C1\">async<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #88C0D0\">playFaceMotion<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">face_band_smile_08<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">await<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">delay<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">300<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #88C0D0\">playBodyMotion<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">w-adult01-shakehand<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #81A1C1\">await<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">delay<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">4000<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #88C0D0\">playBodyMotion<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">w-normal01-glad<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">dialogTimer<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #88C0D0\">clearInterval<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">dialogTimer<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">      <\/span><span style=\"color: #D8DEE9\">dialogTimer<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">null;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #616E88\">\/\/ ======= \u97f3\u4e50 + \u53f0\u8bcd\u542f\u52a8\u51fd\u6570 =======<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">function<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">startLyrics<\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">if<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">lyricsStarted<\/span><span style=\"color: #D8DEE9FF\">) <\/span><span style=\"color: #81A1C1\">return;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">lyricsStarted<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">true;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">startTime<\/span><span style=\"color: #D8DEE9FF\">     <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">Date<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">now<\/span><span style=\"color: #D8DEE9FF\">()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">dialogTimer<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">setInterval<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">updateDialog<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">100<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><\/span><\/code><\/pre><span style=\"display:flex;align-items:flex-end;padding:10px;width:100%;justify-content:flex-end;background-color:#2e3440ff;color:#c8d0e0;font-size:12px;line-height:1;position:relative\">JavaScript<\/span><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u6f14\u51fa\u7f16\u6392<\/h3>\n\n\n\n<p>\u628a\u6240\u6709\u7684\u5185\u5bb9\u90fd\u6309\u6e05\u5355\u52a0\u8f7d\u51fa\u6765\u53ea\u662f\u7b2c\u4e00\u6b65\uff0c\u5982\u679cMiku\u53ea\u662f\u50bb\u7ad9\u5728\u90a3\u91cc\uff0c\u90a3\u5c31\u4e0d\u4ec5\u6ca1\u6709\u7075\u9b42\uff0c\u751a\u81f3\u6709\u70b9\u60ca\u609a\u3002\u4e3a\u4e86\u6253\u9020\u6c89\u6d78\u611f\uff0c\u6211\u9700\u8981\u50cf\u5bfc\u6f14\u4e00\u6837\uff0c\u5b89\u6392\u89d2\u8272\u7684\u51fa\u573a\u548c\u8c22\u5e55\u3002<\/p>\n\n\n\n<p>\u5728\u6280\u672f\u5b9e\u73b0\u4e0a\uff0c\u6211\u62d2\u7edd\u4e86\u4f20\u7edf\u7684<code>setTimeout<\/code>\u5d4c\u5957\uff0c\u800c\u662f\u5229\u7528ES6\u7684<strong>Promise<\/strong>\u548c<strong>Async\/Await<\/strong>\u8bed\u6cd5\uff0c\u5c06\u65f6\u95f4\u8f74\u63a7\u5236\u53d8\u5f97\u50cf\u5199\u5267\u672c\u4e00\u6837\u76f4\u89c2\u3002<\/p>\n\n\n\n<p>\u9996\u5148\uff0c\u6211\u5c01\u88c5\u4e86\u4e00\u4e2a\u6781\u5176\u7b80\u5355\u7684\u5de5\u5177\u51fd\u6570\uff0c\u5c06<code>setTimeout<\/code>\u5305\u88c5\u6210Promise\u3002<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro padding-bottom-disabled cbp-has-line-numbers cbp-highlight-hover\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#d8dee9ff;--cbp-line-number-width:calc(1 * 0.6 * .875rem);--cbp-line-highlight-color:rgba(201, 218, 248, 0.2);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#39404f\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"62\" height=\"20\" viewbox=\"0 0 62 20\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"30\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"52\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#d8dee9ff;display:none\" aria-label=\"\u590d\u5236\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>function delay(ms) {\n  return new Promise(resolve => setTimeout(resolve, ms));\n}<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #81A1C1\">function<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">delay<\/span><span style=\"color: #ECEFF4\">(<\/span><span style=\"color: #D8DEE9\">ms<\/span><span style=\"color: #ECEFF4\">)<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">return<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">new<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #8FBCBB\">Promise<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">resolve<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">setTimeout<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">resolve<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">ms<\/span><span style=\"color: #D8DEE9FF\">))<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><\/span><\/code><\/pre><span style=\"display:flex;align-items:flex-end;padding:10px;width:100%;justify-content:flex-end;background-color:#2e3440ff;color:#c8d0e0;font-size:12px;line-height:1;position:relative\">JavaScript<\/span><\/div>\n\n\n\n<p>\u5728\u6a21\u578b\u52a0\u8f7d\u5b8c\u6bd5\u4e4b\u540e\uff0c\u6211\u6ca1\u6709\u8ba9\u89d2\u8272\u540c\u65f6\u505a\u6240\u6709\u52a8\u4f5c\uff0c\u800c\u662f\u5728\u6bcf\u4e2a\u52a8\u4f5c\u4e4b\u95f4\u90fd\u6dfb\u52a0\u4e86\u79d2\u7ea7\u7684\u505c\u987f\u3002\u56e0\u4e3a\u628a\u52a8\u753b\u5b89\u6392\u7684\u8fc7\u4e8e\u7d27\u51d1\u53ef\u80fd\u4f1a\u4ea7\u751f\u52a8\u753b\u51b2\u7a81\uff0c\u5bfc\u81f4\u67d0\u4e9b\u52a8\u4f5c\u88ab\u541e\u3002\u4e0d\u8fc7\u8fd9\u79cd\u505c\u987f\u53cd\u800c\u4ea7\u751f\u4e86\u67d0\u79cd\u5fae\u5999\u7684\u81ea\u7136\u611f\u3002<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro padding-bottom-disabled cbp-has-line-numbers cbp-highlight-hover\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#d8dee9ff;--cbp-line-number-width:calc(1 * 0.6 * .875rem);--cbp-line-highlight-color:rgba(201, 218, 248, 0.2);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#39404f\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"62\" height=\"20\" viewbox=\"0 0 62 20\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"30\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"52\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#d8dee9ff;display:none\" aria-label=\"\u590d\u5236\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>(async () => {\n    \/\/ \u52a8\u4f5c\u7ec4\uff1aw-adult12-glad\n    playBodyMotion('w-adult12-glad'); \n    \n    await delay(1000); \/\/ \u4ee3\u7801\u6682\u505c\uff0c\u753b\u9762\u7ee7\u7eed\u6e32\u67d3\n    \n    \/\/ \u8868\u60c5\u7ec4\uff1aface_band_closeeye_03\n    playFaceMotion('face_band_closeeye_03'); \n})();<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #81A1C1\">async<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ \u52a8\u4f5c\u7ec4\uff1aw-adult12-glad<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #88C0D0\">playBodyMotion<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">w-adult12-glad<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">await<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">delay<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">1000<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #616E88\">\/\/ \u4ee3\u7801\u6682\u505c\uff0c\u753b\u9762\u7ee7\u7eed\u6e32\u67d3<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ \u8868\u60c5\u7ec4\uff1aface_band_closeeye_03<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #88C0D0\">playFaceMotion<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">face_band_closeeye_03<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span><\/code><\/pre><span style=\"display:flex;align-items:flex-end;padding:10px;width:100%;justify-content:flex-end;background-color:#2e3440ff;color:#c8d0e0;font-size:12px;line-height:1;position:relative\">JavaScript<\/span><\/div>\n\n\n\n<p>\u5f53\u97f3\u4e50\u64ad\u653e\u7ed3\u675f\u65f6\uff0c\u9875\u9762\u5e76\u6ca1\u6709\u621b\u7136\u800c\u6b62\uff0c\u800c\u662f\u8fdb\u5165\u4e86\u4e00\u6bb5\u7cbe\u5fc3\u7f16\u6392\u7684\u8c22\u5e55\u5e8f\u5217\u3002\u5728\u73af\u5883\u5c42\uff0c\u80cc\u666f\u56fe\u5f00\u59cb\u7f13\u6162\u6de1\u51fa\uff08<code>fade-out<\/code>\uff09\uff0c\u805a\u7126Miku\uff1b\u5728\u89d2\u8272\u5c42\uff0cMiku\u5fae\u7b11-&gt;\u6325\u624b\u544a\u522b-&gt;\u6700\u7ec8\u4fdd\u6301\u5f00\u5fc3\u59ff\u6001\u5b9a\u683c\u3002<\/p>\n\n\n\n<p>\u901a\u8fc7\u8fd9\u79cd\u65b9\u5f0f\uff0c\u539f\u672c\u67af\u71e5\u7684\u4e8b\u4ef6\u76d1\u542c\u56de\u8c03\uff0c\u53d8\u6210\u4e86\u4e00\u6bb5\u53ef\u8bfb\u6027\u6781\u5f3a\u7684\u7ebf\u6027\u53d9\u4e8b\u4ee3\u7801\u3002\u6bcf\u4e00\u884c<code>await<\/code>\u90fd\u662f\u4e00\u4e2a\u955c\u5934\u5207\u6362\uff0c\u6bcf\u4e00\u4e2a<code>playMotion<\/code>\u90fd\u662fMiku\u7684\u4e00\u6b21\u8868\u6f14\u3002<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro padding-bottom-disabled cbp-has-line-numbers cbp-highlight-hover\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#d8dee9ff;--cbp-line-number-width:calc(2 * 0.6 * .875rem);--cbp-line-highlight-color:rgba(201, 218, 248, 0.2);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#39404f\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"62\" height=\"20\" viewbox=\"0 0 62 20\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"8\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"30\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><circle cx=\"52\" cy=\"8\" r=\"8\" fill=\"#2e3440ff\" stroke=\"#2e3440ff\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#d8dee9ff;display:none\" aria-label=\"\u590d\u5236\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>bgm.addEventListener('ended', () => {\n    \/\/ 1. \u89e6\u53d1 CSS \u52a8\u753b\uff0c\u80cc\u666f\u6162\u6162\u53d8\u9ed1\uff0c\u8425\u9020\u843d\u5e55\u611f\n    document.getElementById('live2d-bg').classList.add('fade-out');\n\n    \/\/ 2. \u6267\u884c\u7ebf\u6027\u7684\u52a8\u4f5c\u5e8f\u5217\n    (async () => {\n        \/\/ \u7b2c\u4e00\u5e55\uff1a\u9732\u51fa\u7b11\u5bb9\n        playFaceMotion('face_band_smile_08');\n        await delay(300); \/\/ \u7a0d\u4f5c\u505c\u987f\n\n        \/\/ \u7b2c\u4e8c\u5e55\uff1a\u6325\u624b\u544a\u522b\n        playBodyMotion('w-adult01-shakehand');\n        await delay(4000); \/\/ \u7b49\u5f85\u6325\u624b\u52a8\u4f5c\u5927\u81f4\u5b8c\u6210\n\n        \/\/ \u7b2c\u4e09\u5e55\uff1a\u5b9a\u683c\u5728\u5f00\u5fc3\u7684\u5f85\u673a\u52a8\u4f5c\n        playBodyMotion('w-normal01-glad');\n    })();\n});<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #D8DEE9\">bgm<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">addEventListener<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">ended<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ 1. \u89e6\u53d1 CSS \u52a8\u753b\uff0c\u80cc\u666f\u6162\u6162\u53d8\u9ed1\uff0c\u8425\u9020\u843d\u5e55\u611f<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">document<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">getElementById<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">live2d-bg<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">classList<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">add<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">fade-out<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">    <\/span><span style=\"color: #616E88\">\/\/ 2. \u6267\u884c\u7ebf\u6027\u7684\u52a8\u4f5c\u5e8f\u5217<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    (<\/span><span style=\"color: #81A1C1\">async<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">()<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">        <\/span><span style=\"color: #616E88\">\/\/ \u7b2c\u4e00\u5e55\uff1a\u9732\u51fa\u7b11\u5bb9<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #88C0D0\">playFaceMotion<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">face_band_smile_08<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #81A1C1\">await<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">delay<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">300<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #616E88\">\/\/ \u7a0d\u4f5c\u505c\u987f<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">        <\/span><span style=\"color: #616E88\">\/\/ \u7b2c\u4e8c\u5e55\uff1a\u6325\u624b\u544a\u522b<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #88C0D0\">playBodyMotion<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">w-adult01-shakehand<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #81A1C1\">await<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">delay<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">4000<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #616E88\">\/\/ \u7b49\u5f85\u6325\u624b\u52a8\u4f5c\u5927\u81f4\u5b8c\u6210<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">        <\/span><span style=\"color: #616E88\">\/\/ \u7b2c\u4e09\u5e55\uff1a\u5b9a\u683c\u5728\u5f00\u5fc3\u7684\u5f85\u673a\u52a8\u4f5c<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">        <\/span><span style=\"color: #88C0D0\">playBodyMotion<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #A3BE8C\">w-normal01-glad<\/span><span style=\"color: #ECEFF4\">&#39;<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)()<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span><\/code><\/pre><span style=\"display:flex;align-items:flex-end;padding:10px;width:100%;justify-content:flex-end;background-color:#2e3440ff;color:#c8d0e0;font-size:12px;line-height:1;position:relative\">JavaScript<\/span><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u603b\u7ed3<\/h3>\n\n\n\n<p>\u901a\u8fc7\u8fd9\u51e0\u4e2a\u529f\u80fd\u7684\u7ec4\u5408\uff0c\u518d\u52a0\u4e0a\u5fc5\u8981\u7684\u7f8e\u672f\u3001\u97f3\u4e50\u3001\u6b4c\u8bcd\u548cStyle\u5143\u7d20\uff0c\u6700\u7ec8\u5f97\u5230\u4e86\u4e00\u4e2a\u5feb\u901f\u4e14\u751f\u52a8\u7684\u521d\u97f3\u672a\u6765\u3002<\/p>\n\n\n\n<p>\u9879\u76ee\u6ca1\u6709\u5f15\u5165\u91cd\u578b\u6846\u67b6\uff0c\u5b8c\u5168\u4f7f\u7528\u539f\u751fJS\u4f7f\u5f97\u5b83\u975e\u5e38\u9002\u5408\u5d4c\u5165\u5230\u73b0\u6709\u7684\u4efb\u4f55\u7f51\u7ad9\u6216\u535a\u5ba2\u9875\u9762\u4e2d\u3002<\/p>\n\n\n\n<p>\u867d\u7136\u539f\u672c\u4e5f\u8003\u8651\u8fc7\u5f15\u5165Web Audio API\u5206\u6790\u5668\u6765\u8ba9Miku\u7684\u53e3\u578b\u8ddf\u968f\u97f3\u9891\u7684\u6ce2\u5f62\u81ea\u52a8\u5f00\u5408\uff0c\u4f46\u662f\u540e\u6765\u53d1\u73b0\u8fd9\u6837\u4e0d\u597d\u5206\u5272\u6f14\u5531\u548c\u4f34\u594f\uff0c\u89c2\u611f\u4e0a\u53cd\u800c\u4e0d\u5982\u5168\u7a0b\u95ed\u5634\uff0c\u6240\u6709\u6700\u540e\u4e5f\u5c31\u6ca1\u641e\u3002<\/p>\n\n\n\n<p>\u76ee\u524d\u8fd9\u4e2a\u5f69\u86cb\u5df2\u7ecf\u4e0a\u7ebf\uff0c\u4f60\u53ef\u4ee5\u5728\u7f51\u7ad9\u7684\u89d2\u843d\u627e\u5230\u5f69\u86cb\u7684\u5165\u53e3\uff0c\u7136\u540e\u5f00\u59cb\u6b23\u8d4fMiku\u7684\u6f14\u51fa\uff01<\/p>\n\n\n\n<blockquote class=\"wp-block-quote has-text-align-left is-style-default is-layout-flow wp-block-quote-is-layout-flow\">\n<p class=\"has-black-color has-text-color has-link-color wp-elements-7d60071dafd1cc71ff834692afd02ec1\">Untitled.wav\u662f\u4ec0\u4e48\u610f\u601d\uff1f<\/p>\n<cite>\u5728Project Sekai\u7684\u4e16\u754c\u89c2\u4e2d\uff0cUntitled\u662f\u4e00\u9996\u5c1a\u672a\u5b8c\u6210\u7684\u6b4c\u66f2\uff0c\u4e5f\u662f\u901a\u5f80Sekai\u7684\u94a5\u5319\u3002\u5f53\u4e00\u4e2a\u4eba\u64ad\u653e\u8fd9\u9996\u66f2\u5b50\u65f6\uff0c\u4ed6\u5c31\u4f1a\u88ab\u4f20\u9001\u5230\u5c5e\u4e8e\u4ed6\u7684Sekai\u4e2d\uff0c\u5e76\u4e0e\u90a3\u91cc\u7684\u865a\u62df\u6b4c\u624b\u4eec\u76f8\u9047\u3002\u5f53\u4eba\u4eec\u5728Sekai\u4e2d\u7ecf\u5386\u5404\u79cd\u5404\u6837\u7684\u6545\u4e8b\uff0c\u6700\u7ec8\u6b63\u89c6\u5185\u5fc3\uff0c\u627e\u5230\u4e86\u81ea\u5df1\u201c\u771f\u6b63\u7684\u5fc3\u613f\u201d\u65f6\uff0c\u8fd9\u9996&#8221;Untitled&#8221;\u5c31\u4f1a\u88ab\u586b\u4e0a\u6b4c\u8bcd\uff0c\u62e5\u6709\u540d\u5b57\uff0c\u53d8\u6210\u4e00\u9996\u5c5e\u4e8e\u4ed6\u4eec\u81ea\u5df1\u7684\u5b8c\u6574\u7684\u6b4c\u66f2\u3002<br>\u613f\u4f60\u7684\u5fc3\u613f\u4e16\u754c\u4e2d\u4e5f\u6709\u4e00\u4e2a\u5c5e\u4e8e\u4f60\u7684\u521d\u97f3\u672a\u6765\u3002<\/cite><\/blockquote>\n\n\n\n<h3 class=\"wp-block-heading\">\u6e90\u4ee3\u7801<\/h3>\n\n\n\n<p>GitHub\u9879\u76ee\u5730\u5740\uff1a<a href=\"https:\/\/github.com\/Admiral-Spee\/Web_Live2D_Show\">Admiral-Spee\/Web_Live2D_Show: \u4e00\u573a\u5728\u7f51\u9875\u4e2d\u7684\u7b80\u5355Live2D\u6f14\u51fa<\/a><\/p>\n\n\n\n<p><\/p>","protected":false},"excerpt":{"rendered":"<p>\u6700\u8fd1\u770b\u4e86\u521d\u97f3\u672a\u6765\u7684\u7535\u5f71\uff0c\u6df1\u4e3a\u611f\u52a8\u3002\u5982\u679c\u8bf4\u521d\u97f3\u672a\u6765\u201c\u9690\u85cf\u201d\u5728WiFi\u91cc\uff0c\u624b\u673a\u91cc\uff0c\u90a3\u4e48\u80af\u5b9a\u4e5f\u53ef\u4ee5\u4f7f\u7528\u67d0\u79cd\u65b9\u5f0f\u8ba9\u5979\u771f [&hellip;]<\/p>","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[63],"tags":[67,65,36],"class_list":["post-1609","post","type-post","status-publish","format-standard","hentry","category-dev-log","tag-live2d","tag-65","tag-record"],"_links":{"self":[{"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/posts\/1609","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/comments?post=1609"}],"version-history":[{"count":18,"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/posts\/1609\/revisions"}],"predecessor-version":[{"id":1655,"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/posts\/1609\/revisions\/1655"}],"wp:attachment":[{"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/media?parent=1609"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/categories?post=1609"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.admiralspee.site\/en\/wp-json\/wp\/v2\/tags?post=1609"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}