~為響應政府網路分級制度~
~本站全部內容均為限制級,保證很黃很暴力~

訓練家的佈弱格-Patch1.2

The BLOG of trainer



編輯日期:2021-10-25 13:26

類型:網頁設計心得
作者:羽山
文章時間:2021-10-25 13:26:16
瀏覽人數:231人
標題:live2d 空洞臉問題修正
網址:https://3wa.tw/blog/blog.php?id=1940
內容:
 

 

live2d 的妹子很可愛,自從在某些謎站看到後,我也抓回來在

3wa.tw 裡放了一隻

 

 不過近期常常覺得有時角色人物的臉會變得很古怪

今天花了點時間研究一下原始碼查原因 

 

 

 正常的畫面

 

 

 出現異常時的畫面

 

 

debug 方式就是先想辦法看懂被壓縮處理後的 live2d.min.js 原始碼

之所以滑鼠動一動就變空臉,很大的原因是在 mouse move event 發生時

根據 mousemove 查詢,發現可以打開 DEBUG_MOUSE_LOG 來看看

所以先把 506、507 行的

DEBUG_LOG: !1,

DEBUG_MOUSE_LOG: !1, 

 

改成

DEBUG_LOG: 1,

DEBUG_MOUSE_LOG: 1, 

 

 

重新載入畫面後,在螢幕上移動,就可以在 F12 主控台看到所有滑鼠事件

 

 

接著不停的划,划到又出現空洞臉

從資料中發現 x 的值變成 NaN 了

接著再從 onMouseMove device

這個關鍵字去搜尋

 

 

發現在 728 行左右

原來是變數 n 在某些情況下,會發生計算錯誤,出現 NaN

 

為了證實是 NaN 造成

所以先使用 n = NaN; 測試

果不奇然,畫面重整後,每次划滑鼠,都變空洞臉…XD

 

所以在最終計算結果,加入二行

if(isNaN(n)) n = 1;    //By Feather Mountain

 if(isNaN(s)) s = 1;    //By Feather Mountain 

 

如果是 NaN ,就無腦變成 1 吧

前因後果就不管他了...

 

 

 同樣的語法在 762 行左右又出現了一次

不知道這二邊有啥不一樣,所以二邊都加上

總算之後再怎麼划,都不會出現空洞臉了^_^~

 

修正後的 js 檔:

https://3wa.tw/inc/javascript/live2d_demo/assets/live2d.min.js

 

P.S:最後要再記得把剛才506行的,改回來,免得 F12 一堆 debug 內容

DEBUG_LOG: !1,

DEBUG_MOUSE_LOG: !1, 

首頁  上十頁  上一頁  1 下一頁    最末頁 (總共有...1頁)

第 1 頁

有話要說  看留言 【0】

其他分類
當月訓練
(2021-10-27)
【電腦應用】羅技 M585 滑鼠按鍵維修

(2021-10-25)
【網頁設計心得】live2d 空洞臉問題修正

(2021-10-25)
【NSR 150】NSR150 線圈、脈波線圈、激磁線圈

(2021-10-25)
【NSR 150】NSR150 碼表溫度計、油表電阻

(2021-10-25)
【機車綜合相關】SJ4000 4K Air 行車紀錄器

(2021-10-17)
【酷龍 150】酷龍換機油 34015km

(2021-10-04)
【電腦應用】Netflix 字幕加大心得

(2021-10-04)
【NSR 150】NSR150 自製可程式 CDI 程式說明

(2021-10-02)
【KTM 390】KTM RC390 更換打檔桿油封

最新訓練
(2021-11-21)
【NSR 150】NSR150 自製 RC 線組 Part 2

(2021-11-20)
【山葉 XMAX 300】XMAX 300 更換來令片

(2021-11-20)
【酷龍 150】酷龍整理前煞車

(2021-11-14)
【NSR 150】NSR150 更換活塞 - Part1

(2021-11-14)
【電腦應用】利用Serial控制Relay關閉插座-斷線終結者

(2021-10-27)
【電腦應用】羅技 M585 滑鼠按鍵維修

(2021-10-25)
【網頁設計心得】live2d 空洞臉問題修正

(2021-10-25)
【NSR 150】NSR150 線圈、脈波線圈、激磁線圈

(2021-10-25)
【NSR 150】NSR150 碼表溫度計、油表電阻

(2021-10-25)
【機車綜合相關】SJ4000 4K Air 行車紀錄器