js類庫大全（js代碼庫）

本文目錄一覽：

• 1、js 做3D的柱狀圖和餅狀圖的js庫有哪些？求大神們介紹。只限制js庫，或者純javascript。謝謝~~
• 2、有哪些用 JavaScript 實現的圖形庫
• 3、北大青鳥設計培訓：JavaScript編程開發常用的庫？
• 4、北大青鳥設計培訓：JSP編程開發包含哪些常用的庫？
• 5、7大優秀的JavaScript庫？

js 做3D的柱狀圖和餅狀圖的js庫有哪些？求大神們介紹。只限制js庫，或者純javascript。謝謝~~

推薦基於webGL的3D框架類庫！three.js的知名度很高，在開源中國、思否、掘金等技術社區會有很多應用指導案例，很多人問我是不是需要學webGL，three.js正是對webgl進行了封裝，提供更高層的渲染接口，不用重新學習3D繪圖底層邏輯。

題主沒有提供太多背景信息，是否具備中高級前端開發基礎？three.js相對於初學者門檻很高，需要花費更多的時間，一個加載模型、調光、選擇模型彈框的功能，就能寫出Threejs上百行代碼。

有一個針對前端轉3D開發初學者的解決方案，推薦thingjs在線平台，開發體驗比較如下：

提醒一下，three.js並沒有特定的行業應用，屬於技術研究範疇；thingjs專註於物聯網3D可視化領域，對於智慧城市、智慧工廠、安全消防、城市交通可視化應用開發者非常友好！做前端技術應用，推薦物聯網3D商業項目方向，15萬個開發者的一致選擇！

有哪些用 JavaScript 實現的圖形庫

JS圖形、圖標庫推薦：

1. JS Charts

JS Charts 是個基於JavaScript的圖表生成器，不需要任何編碼。JS Charts 非常容易使用，只要用戶使用客戶端腳本（比如，在 web 瀏覽器中執行）。它不需要多餘的插件和服務器模塊，只需要下載 JS Charts 的腳本，準備好 XML，JSON 或者 JavaScript 數組數據。

2. Canvasjs

CanvasJS 是個易用的 HTML5 JavaScript 圖表庫，基於 Canvas 元素。Graphs 可以通過設備渲染，包括 iPhone，iPad，Android，Windows Phone，Microsoft Surface，Desktops 等等。它允許用戶創建適用於所有設備，不影響 web 應用程序的功能和可維護性的富儀錶盤。CanvcasJS 有着非常漂亮的主題和超過傳統的 Flash 和 SVG 圖表 10x 倍以上的速度——生成輕量級，漂亮和響應式的儀錶圖。

3. Chart.js

Chart.js 是個簡單的，面向對象的客戶端圖形庫，用戶可以用 6 中不同的方式來可視化數據。每個方式都是動畫效果的，完全自定義，而且看起來非常好看，即使在 retina 顯示。它使用 HTML5 canvas 元素，支持所有現代瀏覽器，並且支持 IE7/8。

4. Aristochart

Aristochart 是個高度自定義，靈活的折線 Canvas 圖表庫，允許用戶集中精力在圖表的審美方面，後台工作做得非常好。Aristochart 有個持續進步的社區，提供許多不斷增長的主題給用戶選擇。

5. xCharts

xCharts 是一個使用 D3.js 來構建漂亮的可定製的數據驅動的 JavaScript圖表庫，他使用HTML，CSS，SVG實現圖表，xCharts 被設計為一個動態的、流暢的、開放的和可定製化的庫。

6. BonsaiJS

BonsaiJS 是個輕量級的 JavaScript圖形庫，提供直觀的圖形 API 和 SVG 渲染器。主要特性包括：架構分離的運行器和渲染器；iFrame，Worker 和 Node 運行上下文；形狀，路徑，Assets（音頻，圖像，字體，subMovies），Keyframe 和常規動畫，等等。支持現代化瀏覽器： Safari, Chrome 和 Firefox。

7. Sigma.js

Sigma.js 是個免費開源的 JavaScript圖形庫，使用 HTML5 canvas 元素。它的設計是特別為了在 web 界面分享交互式網絡 Map 和動態展示網絡數據庫。

8. Morris.js

Morris.js 是個輕量級的 JavaScript庫，使用 jQuery 和 Raphaenuml 來繪製時序圖。 Morris.js 生命周期是從代碼驅動 howmanyleft.co.uk 圖表開始的。它支持的瀏覽器有： IE6+, Safari/Chrome/Firefox, iOS 3+ 和 Android 3+。它的公共 API 非常的小，只有一個函數： Morris.Line(選項)，包括了許多配置選項。

9. Paper.js

Paper.js 是一個開源的向量圖形腳本框架，基於 HTML5Canvas 開發。提供清晰的場景圖、DOM和大量強大的功能用來創建各種向量圖和貝塞爾曲線。

10. AmCharts

AmCharts 是個高級圖表庫，適用於所有數據的可視化。AmCharts 包括： Column, Bar, Line, Area, Step, Step without risers, Smoothed line, Candlestick, OHLC, Pie/Donut, Radar/ Polar, XY/Scatter/Bubble, Bullet, Funnel/Pyramid 等等。

11. Smoothie Charts

Smoothie Charts是個極小的圖表庫，專為實時流媒體數據設計的。Joe Walnes 想展示 WebSocket推動的實時的流數據。雖然很多圖表庫允許用戶動態更新數據，但是沒有一個是可以優化源源不斷的流數據。

12. Dygraphs

Dygraphs 是個快速，靈活，開源的 JavaScript 圖表庫。它允許用戶展示和解析密集的數據集。可以高亮需要強調的數據集。可以使用鼠標點擊或者用鼠標拖動來縮放圖表；可以修改數值或者點擊條目來調整平均周期。

13. Grafico

Grafico 是 Grafico 是一個基於 Raphaël 和 Prototype.js 構建的 JavaScript 圖表庫，提供了各種圖表類型。這些漂亮的圖表，有利於傳遞他們的信息。

14. Highchart JS

Highcharts JS 是一個製作圖表的純 Javascript類庫，主要特性如下：兼容性：兼容當今所有的瀏覽器，包括 iPhone、IE 和火狐等等；對個人用戶完全免 費；純JS，無BS；支持大部分的圖表類型：直線圖，曲線圖、區域圖、區域曲線圖、柱狀圖、餅裝圖、散布圖；跨語言：不管是 PHP、Asp.net 還是 Java 都可以使用。

15. Flotr

Flotr 是一個基於 Prototype 開發的 JavaScript繪圖工具。支持圖例，鼠標跟蹤，圖片區域選擇，圖片縮放，添加事件鉤子（event hook），通過CSS設置樣式等。

16. Flot

Flot 是受 Plotr 和 PlotKit 的 啟發，Ole Laursen 基於 jquery 開發了一個圖表繪製(WEB Chart)插件並命名為 flot。 flot 是個純 JavaSript 庫，專註於簡單的使用方式，迷人的外觀和交互式特性。支持的瀏覽器有： Internet Explorer 6+, Chrome, Firefox 2+, Safari 3+ and Opera 9.5+。

17. jFreeChart

JFreeChart 主要用來各種各樣的圖表，這些圖表包括：餅圖、柱狀圖(普通柱狀圖以及堆棧柱狀圖)、線圖、區域圖、分布圖、混合圖、甘特圖以及一些儀錶盤等等。JFreeChart 項目歷史悠久，而且有大量的開發者在維護。

18. Plotkit

PlotKit 是一個純 JavaScript 繪圖工具包。它支持 HTML Canvas 和 Adobe SVG。有着很完整的文檔，方便用戶使用。

19. Planetary.js

Planetary.js 是個令人稱奇的創建交互式 web 地球儀的 JavaScript庫。它使用 D3 和 TopoJSON 來解析和渲染地理信息。Planetary.js 使用基於插件的架構，甚至默認自身就是個插件！這使得 Planetary.js 非常靈活，而且它是允許用戶完全自定義，包括顏色，大小，rotation 等等。更重要的是，用戶可以在任意位置使用自定義的顏色和大小來顯示動畫“pings”；它還支持鼠標拖動和縮放，100% 免費和開源。

20. Ember Charts

Ember Charts 是個圖表庫，使用 Ember.js 和 d3.js 框架構建的。它包括時間線，條形圖，餅圖和散點圖，非常容易擴展和修改。這些圖表組件都是開箱即用的，在圖表交互和演示方面應用的很好。

21. Sparky

Sparky 是個免費的 JavaScript 波形圖庫，依賴於 Raphaël ，非常容易使用。支持多個圖表類型（折線，條形，area），折線和區域圖可以有多個顏色選擇。

22. Envision.js

Envision.js 是個 JavaScript 庫，用來簡化，快速創建交互式的 HTML5 可視化圖表。它包括兩個圖表類型：時序圖和 Finance ，提供 API 給開發者，用戶可以直接自定義創建圖表。這個庫氏基於 Flotr2 和 HTML5 Canvas 的。它與框架無關，依賴於幾個小的 JavaScript 庫。

23. Dc.js

dc.js 是個 JavaScript 圖表庫，有着原生的 crossfilter， 支持和允許高效展示大型多維數據集（基於 crossfilter 的示例）；圖表使用 dc.js 渲染，是使用原生數據驅動，所以能得到用戶的實時反饋；dc.js 最大的亮點在於能提供一個簡單而強大的 JavaScript 庫，能進行數據可視化和分析；不僅支持桌面瀏覽器還支持移動端。

24. ElyCharts

Elycharts 是一個易於使用的，可定製的 JavaScript圖表繪製組件。這個組件可用於繪製大部分常用的圖表類型包括：line, column, are, bar, pie, sparklines and combinations。它支持多種交互式功能包括：鼠標跟蹤、事件處理、利用各種動畫高亮顯示選擇中的區域，Tooltip，HTML錨點等。可以動 態修改數據，並以漂亮的動畫效果展示圖表中的變化。圖表利用SVG/VML技術生成，基於jQuery + Raphaël開發。

25. AwesomeChartJS

AwesomeChartJS Awesome Chart JS 是一個 JavaScript生成圖表的類庫，它利用了 HTML5 的 canvas 標籤來創建統計圖表。此類庫就是為了減輕開發者的工作量，使用它只需書寫幾行代碼便能生成漂亮的圖表。

26. Arbor.js

Arbor.js 是一個利用 Web Works 和 jQuery創建的可視化圖形庫，它為圖形組織和屏幕刷新處理提供了一個高效的、力導向的布局算法。

27. CanvasXpress

canvasXpress 是一個基於HTML5 canvas標籤實現的 JavaScript圖表類庫，它能夠支持線性圖、柱形圖、餅圖和熱點圖等多種常見的圖表類型。它所生成的圖表交互性很強，鼠標放 上去時會動態顯示值。除此之外，它也具有相當高的可定製性，可設置圖表的文字、顏色和要顯示/隱藏的元素等。當然更重要的一點是，雖然它使用了 HTML5，但是依然支持IE6瀏覽器。

28. JSXGraph

JSXGraph 是一個支持各種瀏覽器的交互式幾何圖庫繪製。JSXGraph 使用 SVG 和 VML。

29. Rickshaw

Rickshaw 是一個用於繪製時序圖的簡單 jS 庫，基於 Mike Bostock’s delightful D3 庫構建。

30. rGraph

RGraph 是基於HTML5 canvas標籤的HTML5 canvas圖形庫，支持 20 種不同的可視化類型。使用 canvas 標籤，RGraph 創建“HTML5 圖表”，意味着更快的 web 頁面加載和更少的 web 服務器加載。這能幫助減小 web 頁面的大小，低能耗和更快的瀏覽速度。

31. Fusion Chart

FusionCharts Suite XT 是個專業的 JavaScript圖表庫，能創建任何類型的圖表。它創建的圖表都是可以進行完全自定義的，標籤，字體，邊界等等，都可以進行修改。它有很強的交互功能，有許多信息提示，可 點擊的 legend 關鍵字，還有 dril-down，縮放/滾動 和單擊打印圖表功能。

32. Graph Dracula

Dracula 是用一系列的工具來顯示和布局互動圖表，包括各種相關的算法。它只是純 JavaScript 和 SVG ，並無 Flash，Java，其他插件。它非常容易使用，用戶可以很簡單的自定義任意的元素。

33. Bluff

Bluff 是個 JavaScript 的 Ruby 的 Gruff graphing library端口。它支持所有 Gruff 的特性，但是有着最小的依賴。用戶只需要運行一個第三方腳本： JS.Class 副本(壓縮後只有 2.6kB ) 和 Google 的 ExCanvas 副本，用來支持 IE 中的 canvas。這兩個腳本在 Bluff 中都有下載。Bluff 自身壓縮後大小大概有 11KB 。

34. Pizza Pie Chart

Pizza Pie Charts 是個響應式餅圖圖表，基於 Adobe Snap SVG 框架，通過 HTML 標記和 CSS 來替代 JavaScript 對象，更容易集成各種先進的技術。

35. jGraph

HTML5 圖表組件，完全支持l IE 6-8 和觸屏設備。 JGraph 自2001年來就一直提供最先進的圖表軟件組件，是第一個流行的 JGraph Swing 庫。然後在 2005 年走在時代的前沿開發 mxGraph。

北大青鳥設計培訓：JavaScript編程開發常用的庫？

隨着互聯網編程開發技術的不斷發展，關於軟件編程的框架和庫的種類也在不斷的增加。

今天我們就一起來了解一下，常見的JavaScript編程開發都有哪些庫。

1、ReactJS(Star:59989,Fork:10992)React.js(React)是一個用來構建用戶界面的JavaScript庫，主要用於構建UI，很多人認為React是MVC中的V(視圖)。

React起源於Facebook的內部項目，用來架設Instagram的網站，並於2013年5月開源。

React擁有較高的性能，代碼邏輯非常簡單，越來越多的人已開始關注和使用它。

React特點：1.聲明式設計?React採用聲明範式，可以輕鬆描述應用。

2.高效?React通過對DOM的模擬，大限度地減少與DOM的交互。

3.靈活?React可以與已知的庫或框架很好地配合。

4.JSX?JSX是JavaScript語法的擴展。

React開發不一定使用JSX，但我們建議使用它。

5.組件?通過React構建組件，使得代碼更加容易得到復用，能夠很好的應用在大項目的開發中。

6.單向響應的數據流?React實現了單向響應的數據流，從而減少了重複代碼，這也是它為什麼比傳統數據綁定更簡單。

2、AngularJS(Star:54769,Fork:27292)AngularJS(Angular.JS)是一組用來開發Web頁面的框架、模板以及數據綁定和豐富UI組件。

它支持整個開發進程，提供Web應用的架構，無需進行手工DOM操作。

AngularJS很小，只有60K，兼容主流瀏覽器，與jQuery配合良好。

3、Vue.js(Star:43608,Fork:5493)Vue.js是構建Web界面的JavaScript庫，提供數據驅動的組件，還有簡單靈活的API，使得MVVM更簡單。

主要特性：可擴展的數據綁定將普通的JS對象作為model簡潔明了的API組件化UI構建配合別的庫使用4、jQuery(Star:43432,Fork:12117)JQuery是輕量級的js庫(壓縮後只有21k)，它兼容CSS3，還兼容各種瀏覽器(IE6.0+,FF1.5+,Safari2.0+,Opera9.0+)。

jQuery使用戶能更方便地處理HTMLdocuments、events、實現動畫效果，並且方便地為網站提供AJAX交互。

jQuery還有一個比較大的優勢是，它的文檔說明很全，而且各種應用也說得很詳細，同時還有許多成熟的插件可供選擇。

長沙IT培訓認為jQuery能夠使用戶的html頁保持代碼和html內容分離，也就是說，不用再在html裡面插入一堆js來調用命令了，只需定義id即可。

北大青鳥設計培訓：JSP編程開發包含哪些常用的庫？

隨着網絡程序設計開發技術的發展，有關軟件程序設計的框架和程序庫的種類也在增加。

今天，石家莊石家莊IT培訓大家了解典型JSP編程開發中有哪些庫。

1、ReactJSReact.js（React）是一個JavaScript庫，它主要使用MVC的V（視圖）React構建UI。

React起源於架設Instagram網站，2013年5月開放源代碼化的Facebook內部項目。

石家莊java培訓發現React提供了高性能，代碼邏輯非常簡單，並且越來越多的人開始關注並使用它。

2、AngularJSAngularJS是一組框架、模板、數據綁定和豐富的UI組件，用於開發Web頁。

支持整個開發過程並提供Web應用程序架構，而無需手動DOM操作。

石家莊石家莊UI設計培訓發現AngularJS非常小，只有60K，與主流瀏覽器兼容，與jQuery相配。

3、Vue.jsVue.js是一個JavaScript庫，用於構建Web界面，提供數據驅動組件，並提供簡單靈活的API以簡化MVVM。

4、Angular2Angular是一個非常流行且易於使用的Web前端框架，現在由Google維護。

北大青鳥發現此條目包含Angular2及其後續版本。

因為Angular2和Angular.js的早期版本是單獨管理的（它們的GitHub地址和項目主頁不相同），所以它們都有此頁。

7大優秀的JavaScript庫？

現在有很多各種各樣的JavaScript庫，但這裡將介紹7個很優秀的可用於你下一個JavaScript項目的庫。

儀錶盤是用於目標或業務流程的視覺指示工具，也用於切割雜亂無章的數據，從而分割出要點的重要工具。它可幫助評估信息，並及時做出正確的決定。實時可視化的儀錶盤由圖標、測繪圖、圖形符號，以及數據表格等組成。

目前有一些開源或商業的庫用於創建儀錶盤。在本文中，我們將會展示一些可幫助創建美觀且可自定義的儀錶盤的JavaScript庫。

1.Gridster.js

Gridster是一個jQuery插件，可以從跨多個列的元素構建直觀的可拖拽布局。

它可以讓你從網格中動態添加或刪除小部件，甚至可以獲得一個具有所有小部件位置的對象的JavaScript數組，從而可以在以後使用這些數組來加載小部件。

2.angular-gridster

這是一個用於AngularJS的格子狀小部件的實現。它具有jQuerygridster插件等功能，也具有一些其他的功能。

它完全使用Angular指令重寫，還可以使用Angular的數據綁定功能。

3.gridstack.js

gridstack.js是一個用於小部件布局的jQuery插件，靈感來自gridster.js。這是一個可拖放的多列網格，可讓你構建可拖拽的響應式Bootstrapv3的友好布局，

它還適用於knockout.js,angular.js和觸摸設備。

4.jQueryGridly

Gridly是一個jQuery插件，電腦培訓建議可用於拖放以及在網格中調整大小。

5.Packery

Packery是一個JavaScript庫和jQuery插件，可用於生成無縫且可拖拽的布局。它使用bin-packing算法來填充空隙。

它適合用於創建一個可拖拽的儀錶盤和無縫的“磚石圖像畫廊”布局。