This is some little toys in Javascript
Demo: https://balachuang.github.io/myJsToys/index.html
因為 Github 的代管只能用靜態網頁, 所以就把 javascript 相關的小東西放在這裡. 單純為了好玩. 所有的內容都在下面的網址裡:
https://balachuang.github.io/myJsToys/index.html
說明如下:
-
SVG:
- FloatingBox: 一組方格陣列, 會隨著遊標移動產生不同的陰影
- SwingText: 一個會產生神龍擺尾動畫的文字串.
- WorkingTime: 計算目前離下一次週末假日還有多久.
- SwingLine: 一條會產生神龍擺尾動畫的線, 可以使用很多參數來調整神龍擺尾動畫的計算方式.
- Metaballs: 計算二維 Metaball, 一樣可以用多個參數調整產生方式. 按 Add Ball 可以建立一個新的圖型.
- LineFunctions: 各種方程式組成的美麗線條
- FlowerLine: 摸擬花朵曲線 (不確定這個有沒有正式的名稱) 的產生. 按著小圖圓心並拖動, 就可以看到產生的曲線.
- Maze Generator: 產生迷官, 主要是為了實作迷官產生演算法.
- Hezagon Grid:
-
three.js:
- Web 3D Play: 為了熟悉 three.js 用的.
- RoundingPoints - I: 模擬行星運動, 用亂數決定行星數量及與太陽距離, 並由距離決定公轉速度.
- RoundingPoints - II: 模擬複雜的行星運動, 每個行星除了繞中央公轉外, 還會繞另一條主要公轉軌道做次要公轉.
- Earth Simulation: 模擬地球自轉, 可以切換是否摸擬日夜交替及雲層動畫.
- Bloom Light Test: 使用 three.js 建立發光物體的動畫.
- GLB File Display: 讀取並顯示 GLB 檔案, 同時自動產生 X-Y 平面及尺吋. GLB 檔案可以用 Blender 匯出.
- Game: Walk in Maze: 套用迷官產生演算法, 並產生 3D 迷宮讓使用者可以在迷宮裡走動.
- Game: Fly in Space: 使用方向鍵移動視角並閃躲前方接近的石頭.
- Walk in Scenes: on-going
-
D3
- Sort Algorithm: 實作各種排序演算法, 可以自訂間隔時間, 觀察每個步驟的過程.
- Working Time in Art: 用不同的方法顯示 WorkingTime
- Fish Eye Deformation: 一個放大鏡特效, 可以用放大鐘週圍三個小把手來控制放大鏡的倍率, 大小, 和位置.
-
HTML5 Web Audio API
- Audio Play: Web Audio 練習作品.
- Frequency Generator: 產生單獨的音頻. 也可以一次設定多個頻, 勾選後同步播放.
- Simple Piano: 一個簡單的鋼琴, 提供一些 Web Audio API 專用的參數調整.
-
A-Frame
- My Hello A-Frame: A-Frame 的練習作品, A-Frame 是一個提供 Web AR 的網頁 3D API.
-
WebGPU
- My Hello WebGPU: WebGPU 的練習作品.
-
PhotoSwipe
- My 3D Gallery: 放一些我用 Blender 作品的地方.
-
temp km sunset
- set doc app readonly
- issue new tkms upload
- keep file migration
jira sunset
- f12 jira add announcement
- be jira ...
- pid jira
- check usage
- mail to sponsor for migration
- fed jira
- check usage
- mail to sponsor for migration
- mail to sponsor for old issue purge
- confirm project sponsor
- confirm solution PM / functions
- confirm EAR / BKMP approach