課程大綱： Three.js(webgl threejs)webpack培訓(xùn)
第1章 課程介紹及示例演示
1 threejs 3d地圖課程介紹及示例演示
第2章 Webpack 快速入門
2 搭建 webpack 腳手架和配置 webpack.configjs 文件
3 webpack 通過 loader 處理圖片格式文件
4 webpack-dev-server 啟動網(wǎng)頁和 source-Map 調(diào)試程序
5 區(qū)分模式打包,Config配置文件細(xì)分開發(fā)和生產(chǎn)模式
6 通過 Babel 把 ES6 轉(zhuǎn)換為 ES5 實(shí)現(xiàn)瀏覽器兼容
7 babel-polyfill優(yōu)化,閉包 plugin-transform-runtime
第3章 Three.js 3d 地圖案例講解
8 導(dǎo)入 threejs 庫及 threejs 常用的插件
9 通過簡單示例實(shí)現(xiàn) threejs 場景 3D 動畫
10 面向?qū)ο缶幊虒?shí)現(xiàn) 3D 場景中輔助坐標(biāo)
11 通過 jquery 和 axios 在界面中引入 geojson 數(shù)據(jù)
12 geoJson 講解及點(diǎn)線面等在線效果演示
13 墨卡托坐標(biāo)介紹和經(jīng)緯度轉(zhuǎn)換三維坐標(biāo)方法實(shí)現(xiàn)
14 對原始數(shù)據(jù)處理獲取經(jīng)緯度數(shù)據(jù)再轉(zhuǎn)換成三維坐標(biāo)
15 用 geoJson 數(shù)據(jù)在 3d 場景中繪制簡單多邊形
16 用 geoJson 數(shù)據(jù)在 3d 場景中繪制多多邊形
17 用geoJson數(shù)據(jù)在3d場景中繪制多線條
18 用 geoJson 數(shù)據(jù)在場景中繪制中國地圖
19 繪制長沙地圖及為多邊形邊框加線條
20 光線投射 Raycaster 鼠標(biāo)點(diǎn)擊地圖中某個(gè)區(qū)域時(shí)改變該區(qū)域的顏色
21 地圖區(qū)域內(nèi)中心點(diǎn)生成光柱特效 1
22 地圖區(qū)域內(nèi)中心點(diǎn)生成光柱特效 2
23 地圖區(qū)域內(nèi)中心點(diǎn)生成光柱特效 3
24 地圖模型角度調(diào)整和光柱底盤繪制
25 三維二次貝塞爾曲線 QuadraticBezierCurve3 繪制地圖飛行線
加入高級會員獲得助教答疑
