iT邦幫忙

three.js相關文章
共有 142 則文章
3 Like 0 留言 7082 瀏覽
鐵人賽 Modern Web DAY 11
用 Three.js 來當個創世神 系列 第 11 篇

技術 用 Three.js 來當個創世神 (10)：專案實作#5 - 光影效果

今天將延續昨天的光源主題，在專案中實作光影效果，並透過移動點光源的動畫，讓光影效果的內容更有趣！ Photo by Kristine Weilert o...

ckchuang ‧ 2018-10-26 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
3 Like 0 留言 8034 瀏覽
鐵人賽 Modern Web DAY 10
用 Three.js 來當個創世神 系列 第 10 篇

技術 用 Three.js 來當個創世神 (09)：光源（Light）

今天將介紹四種基礎光源：「環境光（AmbientLight）、點光源（PointLight）、聚光燈（SpotLight）、平行光（DirectionalLi...

ckchuang ‧ 2018-10-25 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
4 Like 1 留言 6225 瀏覽
鐵人賽 Modern Web DAY 9
用 Three.js 來當個創世神 系列 第 9 篇

技術 用 Three.js 來當個創世神 (08)：專案實作#4 - 人物材質與貼圖

在瞭解了材質的種類及屬性後，今天要透過專案實作，來幫前面所建立的苦力怕模型貼上材質與皮膚，讓人物的還原度更高一些！ Photo by Manolo Ch...

ckchuang ‧ 2018-10-24 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
2 Like 0 留言 6590 瀏覽
鐵人賽 Modern Web DAY 8
用 Three.js 來當個創世神 系列 第 8 篇

技術 用 Three.js 來當個創世神 (07)：材質（Material）

在準備幫專案的人物貼上皮膚前，今天先來了解一下材質的種類以及屬性吧！ Photo by Patrick Tomasso on Unsplash 這是...

ckchuang ‧ 2018-10-23 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
3 Like 3 留言 9736 瀏覽
鐵人賽 Modern Web DAY 7
用 Three.js 來當個創世神 系列 第 7 篇

技術 用 Three.js 來當個創世神 (06)：專案實作#3 - OrbitControls、stats.js

今天主要是設定方面的內容，要加上的工具包含 OrbitControls 與 stats.js。一個是軌道控制器，透過拖移及縮放調整相機位置；另一個是畫面刷新頻...

ckchuang ‧ 2018-10-22 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
3 Like 1 留言 10031 瀏覽
鐵人賽 Modern Web DAY 6
用 Three.js 來當個創世神 系列 第 6 篇

技術 用 Three.js 來當個創世神 (05)：專案實作#2 - 基本人物模型

昨天了解了整個專案的架構，首先就從基本的人物模型開始動手吧！ Photo by Jeremy Thomas on Unsplash 這是本系列第 0...

ckchuang ‧ 2018-10-21 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
4 Like 0 留言 9285 瀏覽
鐵人賽 Modern Web DAY 5
用 Three.js 來當個創世神 系列 第 5 篇

技術 用 Three.js 來當個創世神 (04)：專案實作#1 - 專案介紹及初步規劃

今天開始專案實作第一天，先來聊聊接下來的這整個專案要做些什麼吧！ Photo by rawpixel on Unsplash 這是本系列第 04 篇...

ckchuang ‧ 2018-10-20 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
7 Like 1 留言 14450 瀏覽
鐵人賽 Modern Web DAY 4
用 Three.js 來當個創世神 系列 第 4 篇

技術 用 Three.js 來當個創世神 (03)：Hello Three.js!

在程式語言的學習過程中，第一步當然就是先寫個「Hello world」了！本篇文章將手把手的透過簡單的範例，逐行分析程式碼，建立本系列的第一個 3D 場景及物...

ckchuang ‧ 2018-10-19 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
1 Like 0 留言 14843 瀏覽
鐵人賽 Modern Web DAY 3
用 Three.js 來當個創世神 系列 第 3 篇

技術 用 Three.js 來當個創世神 (02)：Three.js 基本元素介紹

在開始動手寫 Three.js 之前，先來簡單了解一些 Three.js 中基本元素的概念：Scene、Camera、Object、Geometry、Mate...

ckchuang ‧ 2018-10-18 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
3 Like 0 留言 30686 瀏覽
鐵人賽 Modern Web DAY 2
用 Three.js 來當個創世神 系列 第 2 篇

達標好文 技術 用 Three.js 來當個創世神 (01)：Three.js 簡介

Three.js 是一套基於 WebGL 開發出的 Javascript 函式庫，它提供了比 WebGL 更簡單的 Javascript API，讓開發者能夠...

ckchuang ‧ 2018-10-17 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
4 Like 0 留言 6264 瀏覽
鐵人賽 Modern Web DAY 1
用 Three.js 來當個創世神 系列 第 1 篇

技術 用 Three.js 來當個創世神 (00)：關於此系列文

此系列文將從 Three.js 基本觀念切入，前面幾篇會簡單介紹如何用 Three.js 的基本元素在網頁上畫出 3D 場景與物體，之後直接透過實作遊戲專案，...

ckchuang ‧ 2018-10-16 ‧團隊浪流連九程式匠自然產生的佛系碼農專區
0 Like 0 留言 1778 瀏覽
鐵人賽 Modern Web DAY 22
重新學習網頁設計 系列 第 22 篇

技術 DAY 22. Three.js 總結

DAY 22. Three.js 總結 前面連續幾天陸陸續續介紹了關於Three最重要的幾個重點因為每天時間有限的關係沒辦法給予很詳細的介紹，但希望有給大家一些...

Cian ‧ 2017-12-25
0 Like 0 留言 4017 瀏覽
鐵人賽 Modern Web DAY 21
重新學習網頁設計 系列 第 21 篇

技術 DAY 21. Three.js 載入器 Loader

DAY 21. Three.js 載入器 Loader 雖然Three提供了很多Geometory供我們使用，但真實世界的需求當然不可能那麼簡單，我們很有可能需...

Cian ‧ 2017-12-24
0 Like 0 留言 4820 瀏覽
鐵人賽 Modern Web DAY 20
重新學習網頁設計 系列 第 20 篇

技術 DAY 20. Three.js 紋理 Texture

DAY 20. Three.js 紋理 Texture 紋理 Texture 紋理Texture並不是建立一個3D場景必要的存在, 沒有紋理Texture一樣可...

Cian ‧ 2017-12-23
1 Like 0 留言 6097 瀏覽
鐵人賽 Modern Web DAY 19
重新學習網頁設計 系列 第 19 篇

技術 DAY 19. Three.js 材質 Material

DAY 19. Three.js 材質 Material 材質 Material 3D場景中所看到的任何物件都是幾何Geometry加上材質Material的...

Cian ‧ 2017-12-22
0 Like 0 留言 4104 瀏覽
鐵人賽 Modern Web DAY 18
重新學習網頁設計 系列 第 18 篇

技術 DAY 18 Three.js 幾何 Geometry

DAY 18 Three.js 幾何 Geometry 幾何 Geometry 3D場景中所看到的任何物件都是幾何Geometry加上材質Material的呈現...

Cian ‧ 2017-12-21
0 Like 0 留言 4602 瀏覽
鐵人賽 Modern Web DAY 17
重新學習網頁設計 系列 第 17 篇

技術 DAY 17. Three.js 光源 Light

DAY 17. Three.js 光源 Light 在3D的應用當中, 光源Light是相當普遍的運用, 如果該3D場景Scene沒有光源, 通常會是黑漆漆的一...

Cian ‧ 2017-12-20
0 Like 1 留言 7381 瀏覽
鐵人賽 Modern Web DAY 16
重新學習網頁設計 系列 第 16 篇

技術 DAY 16. Three.js 相機 Camera

DAY 16. Three.js 相機Camera 相機 Camera 在3D的環境中可以把它當成視角, 我們可以給它定位、關注點, 也可以搭配相機的位置角度來...

Cian ‧ 2017-12-19
0 Like 0 留言 6640 瀏覽
鐵人賽 Modern Web DAY 15
重新學習網頁設計 系列 第 15 篇

技術 DAY 15. Three.js 渲染器 Renderer

DAY 15. Three.js 渲染器 Renderer 在Three.js 初探文中, 我在最後寫了這麼一段程式來渲染整個場景 // 定義渲染器 let r...

Cian ‧ 2017-12-18
0 Like 0 留言 2454 瀏覽
鐵人賽 Modern Web DAY 14
重新學習網頁設計 系列 第 14 篇

技術 DAY 14. Three.js 初探

DAY 14. Three.js 初探 用來建立3D場景的函數庫其實很多，Three.js是其中之一關於Three.js的介紹網路上有很多，在此就不多贅述直接從...

Cian ‧ 2017-12-17
1 Like 0 留言 4090 瀏覽
鐵人賽 Modern Web DAY 25
WebGL 與 Three.js 初探 系列 第 25 篇

技術 [Day25] webVR 中的 jquery - aframe.js introduction

隨著 VR 的技術越來越進步，VR 的應用已經逐漸融入我們的生活中，像是不久前 google 推出的 CardBoard，HTC 的HTC Vive、Oculu...

愷開 ‧ 2017-01-08
0 Like 1 留言 5041 瀏覽
鐵人賽 Modern Web DAY 6
WebGL 與 Three.js 初探 系列 第 6 篇

技術 [Day6] three.js 前置 webGL 修羅道（3) - 動畫與 varying

[Day6] webGL 修羅道(3) - Animation 與 varying demo 昨天我們介紹完了如何傳遞資料給著色器，並且透過著色器畫了三個點，昨...

愷開 ‧ 2016-12-20
iThome鐵人賽
參賽組數
1123 組
團體組數
52 組
累計文章數
23096 篇
完賽人數
656 人
iT+看影片追技術 看影片追技術 看更多
熱門tag 看更多
15th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽 鐵人賽 2019鐵人賽 2018鐵人賽 javascript 2017鐵人賽 python windows php c# windows server linux css 程式設計 react vue.js
熱門問題
熱門回答
熱門文章
IT邦幫忙