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