麻豆小视频在线观看_中文黄色一级片_久久久成人精品_成片免费观看视频大全_午夜精品久久久久久久99热浪潮_成人一区二区三区四区

首頁 > 編程 > JavaScript > 正文

推薦10 款 SVG 動畫的 JavaScript 庫

2019-11-20 12:52:13
字體:
來源:轉載
供稿:網友

SVG 通常可以用作跨分辨率視頻。這意味著在一塊高分屏幕上不會降低圖片的銳度。此外,你甚至可以讓SVG動起來,通過使用一些javascript類庫。下面,我們分享一些javascript類庫,這些類庫會幫助我們將SVG動畫提高一個等級。

Vivus

Vivus 是一個能動畫js類庫,它能夠給SVG圖像顯示出被畫出來的過程。Vivus是沒有其他類庫依賴的(比如jQuery)。你僅僅需要在頁面中加入這個.js文件,然后傳入需要被用來動畫的SVG部分就行。同時通過指定一些配置,它能夠在頁面加載后直接顯示動畫效果。

Bonsai

Bonsai 是一個功能豐富的 JS 類庫,你能夠用它來畫和 animate 動態內容在網站上。這些內容包括了 HTML5 video、變化的 Canvas 和 SVG。通過 Bonsai 框架,你能畫一個簡單的矩形、甚至一段矩形,如果你喜歡甚至可以畫一個豐富的多人卡通游戲進去。

Velocity

Velocity 是一個 JS 類庫,它是用來做頻繁動畫用的。Velocity 的 js 動畫“速度”是非常快的。它比JQuery 快,甚至比 CSS 動畫還要快。Velocity 的 API 和 $.fn.animate 很像,都是通過$()來操作。velocity()是另一種方法,相比 $().animate()。總而言之,你應該使用一致的animate效果,包括 fadeIn 和 fadeOut 方法(譯者:Velocity 提供了 fadeIn 和 fadeOut 方法)。

Raphael

RaphaelJS 也通常是用來在網頁上畫SVG圖和動畫的。它兼容各種windows瀏覽器一直到IE6,因為如此,Raphael成為了市面上最受信賴的js(svg)類庫。有了它,你可以制作分析圖表、地圖、游戲就像在廚房做飯一樣。

Snap

SnapSVG 是另一個知名 JS 類庫,它是由 Dmitry Baranovskiy 開發的(Raphael 同樣也是)。同樣它也是 Adobe Web Software Group 來維護。和 Raphael 不同的是,它只提供了 ie 最新版支持。這使得 SnapSVG 在體積上小了許多(相比 Raphel)以實現相同的功能(比如 trim)和支持最新的功能。

Lazy Line Painter

Laid back Range Painter 是一個 jQuery 插件,通常被用來作繪制圖集,有點像 Vivus。通常你會吐槽的是它的也就只有這么一個特殊的功能。讓我來解釋下,如果你是用Illustrator 或者Inkscape制作的SVG圖像,而且SVG圖像沒有任何顏色上的變化,僅僅是軌跡的變化,可以用它。

SVG.js

SVG.js 是一個輕量級的操作和動畫 SVG 類庫。你能夠操作變化方向、位置和顏色。這還沒完,你甚至可以自己實現插件等一些其他功能。這個實例可以attach一些插件,比如svg.filter.js,他可以為你的圖片實現 Gaussian blur, desaturase, compare, sepia 等等功能。

Walkway

Walkway 支持3種方式,path,line和用polyline來畫的svg線。它提供了一個很好的例子,繪制了一個PlayStation 的集合動畫。

Progressbar.js

ProgressBar.js 是一個可愛的和易于接受的增長曲線圖用來繪制卡通SVG線條。有了它,各種形狀都可以用作增長曲線。它集成了一些實用的形狀如Range,Circle和Block,你甚至可以自行開發一個增長圖通過Illustrator或者其他的矢量圖繪制工具。ProgressBar.js 是輕量級,MIT許可的而且支持IE9+。你可以通過它修改大型柱狀增長圖。你還可以改變屬性生成動畫,比如stroke breadth,load opacity, load coloring等等。

Chartlist.js

Chartist.js 是一個簡單的容易被接受的圖標庫,它是通過SVG繪制的。Chartist的宗旨是提供一個簡單的,輕量級的,非侵入式的圖表庫。你需要提供一些javascript配置對象做一些自定義配置,要不然它會使用默認的配置,即已經默認是排序過后的。

Chartist是通過 inline-SVG繪制的,所以它對DOM操作影響很小,相對于它提供的功能來說。而且意味著Chartist不會提供個人控制、水印、行為等等一些你能夠通過簡單的HTML, JavaScript and CSS實現的。

以上所述就是本文給大家推薦的SVG動畫的javascript庫了,希望能夠對大家學習javascript有所幫助。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 一级黄色淫片 | 日本aaaa片毛片免费观蜜桃 | 成人三级电影在线 | 看免费的毛片 | 亚洲成人高清在线观看 | 免费a级片视频 | 婷婷亚洲一区二区三区 | 爱逼爱操综合网 | 成人在线视频精品 | 久久综合网址 | 中国老女人一级毛片视频 | 国产v综合v亚洲欧美久久 | 国产一级淫片免费看 | 亚洲第一成网站 | 一本色道精品久久一区二区三区 | 久久久久久久久国产精品 | 日韩黄色影视 | 高清国产午夜精品久久久久久 | 在线91视频 | 一区二区三区欧美日韩 | 精品在线视频观看 | 依依成人精品视频 | 亚洲啊v在线观看 | 日韩一级成人 | 99精品国产小情侣高潮露脸在线 | 国产91在线播放九色 | 久久人人爽人人爽人人片av高请 | 免费欧美一级视频 | 色婷婷久久一区二区 | 久国产| 91精品国产乱码久久久久 | 国产一级毛片高清视频完整版 | 宅男噜噜噜66国产免费观看 | 性欧美大战久久久久久久免费观看 | 精品久久中文字幕 | 亚洲第一视频 | 久久久综| 欧美成人一二三区 | 免费放黄网站在线播放 | 国产一区视频在线观看免费 | 欧洲精品久久 |