1. tweenmax.js干什麼用
TweenMax.js是動畫插件庫GSAP(GreenSockAnimationPlatform)的核心文件,載入後即可使用四個主要運動類TweenLite、TweenMax、TimelineLite、TimelineMax和一些其他插件。可對一個或多個物件進行動畫,或添加至時間軸中設計復雜的影片。
GSAP最初在flash時代(2004-2006)是作為flash軟體的插件用來增添動畫效果,當時的名字是「GreenSockTweeningPlatform」(GreenSock補間平台)。後來Flash逐漸沒落,在網頁上的應用,除了游戲和視頻播放之外不斷減少。出於自身發展考慮,GreenSock在v12(第十二版)中,加入了JavaScript的Class,也就是說我們可以在HTML網頁中使用TweenLite或TweenMax…等來製作動畫,也藉此版本把發展計劃的名稱更名為「GreenSockAnimationPlatform」(GreenSock動畫平台),主要是把「Tweening」換成「Animation」,因為前者主要為Flash在使用的名詞,而後者就屬於比較廣義的「動畫」,後來逐步發展為全平台均可應用的動畫庫。
最新的v2.x版本則全面支持html5和css3動畫,並適應於主流的瀏覽器。
在網頁上GreenSock目前提供使用的有「TweenLite」、「TweenMax」、「TimelineLite」、「TimelineMax」這四個項目,雖比Flash來的少,不過也是最常用的幾項,相信可以幫助設計師們在不使用Flash的情形之下,製作許多不同凡響的動畫效果,另外關於這四項的差別也跟Flash版本一樣
TweenMax.js的優勢在於性能強勁和使用簡便。
tweenmax中文網
2. 使用svg和js畫一個圓環
var path = svgdoc.createElement("path");
path.setAttribute("d","M400 400 L400 300 A400 400 90 0 1 500 400 Z");
path.setAttribute("style","fill:none;stroke:#00f;stroke-width:2");
svgdoc.rootElement.appendChild(path);
這個代碼是畫四分之一個圓,圓環你自己算下坐標,用PATH畫,A是畫弧線的
path的相關知識,你網路你裡面看下,這里就不多說了
3. threejs載入geojson
1.GPS坐標WGS84 EPSG:4326 (單位:度分秒)
2.墨卡托投影(平面投影) EPSG:3857(單位:米)
(另網路、高德等對應的EPSG自行網路不做介紹)
可以採用proj4來進行經緯度的轉換
1.根據經緯度的最大與最小值來計算偏差值
2.經緯度分別減去偏差值得出校準後坐標
3.也可藉由相機位置來直接修正位置(不建議)
可由obj,mtl格式導入模型及材質,使用three-obj-mtl-loader庫進行導入,導入完成後即和自行創建mesh一樣(注意坐標軸對應關系)
threejs不支持直接方式輸入中文字
1.可通過canvas來達到效果
2.通過new THREE.FontLoader()來載入json格式字體
(字體格式在線轉換地址 https://gero3.github.io/facetype.js/ )
可藉由tweenjs來實現動畫效果
demo: https://github.com/Xyifeng/threejs-geomap