35 JavaScript Graphics Library worthy of web Developer collection

Source: Internet
Author: User
Tags polyline require javascript array

A graph is a graphical representation of data, such as a bar chart, a line chart, a pie chart, and so on, through an image chart. Visualization charts can help developers understand complex data more easily, improve productivity and reliability of Web applications and projects.

In this article, we have compiled a library of 35 JavaScript graphic charts that are worthy of web Developer's collection, and are suitable for a variety of charting needs. Most of them are free and open source, and hopefully you'll find JavaScript charts and graphics libraries that fit your needs in the list below.

1. JS Charts

JS Charts is a JavaScript-based chart generator that does not require any coding. JS Charts is very easy to use, as long as the user uses client-side scripting (for example, in a Web browser). It does not require redundant plugins and server modules, just download the JS Charts script and prepare the Xml,json or JavaScript array data.

2. Canvasjs

Canvasjs is an easy-to-use HTML5 & JavaScript library based on Canvas elements. Graphs can be rendered through the device, including Iphone,ipad,android,windows Phone,microsoft surface,desktops, and so on. It allows users to create rich dashboards that apply to all devices without compromising the functionality and maintainability of the Web application. Canvcasjs has a very beautiful theme and more than 10x faster than the traditional Flash and SVG charts-generating a lightweight, beautiful and responsive meter diagram.

3. Chart.js

Chart.js is a simple, object-oriented client-side graphics library that allows users to visualize data in 6 different ways. Each method is animated, fully customizable, and looks very nice, even if the retina is displayed. It uses HTML5 canvas elements, supports all modern browsers, and supports IE7/8.

4. Aristochart

Aristochart is a highly customizable, flexible line Canvas Chart library that allows users to focus on the aesthetic aspects of the chart and work very well in the background. Aristochart has a continuously evolving community that offers a number of growing themes for users to choose from.

5. Xcharts

Xcharts is a library that uses d3.js to build a beautiful, customizable data-driven JavaScript chart, using Html,css,svg to implement charts, Xcharts is designed as a dynamic, fluid, open, and customizable library.

6. Bonsaijs

Bonsaijs is a lightweight JavaScript graphics library that provides an intuitive graphical API and SVG renderer. Key features include: schema-detached runner and renderer, Iframe,worker and Node run contexts, shapes, paths, Assets (audio, images, fonts, submovies), keyframe and regular animations, and more. Support for modern browsers: Safari, Chrome and Firefox.

7. Sigma.js

Sigma.js is a free, open source JavaScript graphics library that uses HTML5 canvas elements. It is designed specifically to share interactive network maps and dynamic presentation network databases in a Web interface.

8. Morris.js

Morris.js is a lightweight JavaScript library that uses JQuery and RAPHA&ENUML to draw time series diagrams. The Morris.js life cycle starts with a code-driven howmanyleft.co.uk chart. The browsers it supports are: ie6+, Safari/chrome/firefox, IOS and Android. Its public API is very small and has only one function: morris.line (option), which includes many configuration options.

9. Paper.js

Paper.js is an open source vector graphics scripting framework, based on Html5canvas development. Provides a clear scene map, Dom, and a number of powerful features to create various vector and Bezier curves.

Ten. Amcharts

Amcharts is a high-level chart library for visualizing all data. Amcharts includes: Column, Bar, line, area, step, step without risers, smoothed line, Candlestick, OHLC, Pie/donut, Radar/polar , Xy/scatter/bubble, Bullet, Funnel/pyramid and so on.

Smoothie Charts

Smoothie charts is a minimal library of charts designed for real-time streaming media data. Joe Walnes wanted to show real-time streaming data driven by WebSocket. While many chart libraries allow users to dynamically update data, none of them can optimize the flow of streaming data.

Dygraphs.

Dygraphs is a fast, flexible, open source JavaScript Library of graphs. It allows users to present and parse dense datasets. You can highlight the data set you want to emphasize. You can use your mouse to click or drag to zoom the chart, you can change the value or click on the item to adjust the average period.

Grafico.

Grafico is Grafico is a library of JavaScript charts based on Raphaël and prototype.js, providing a variety of chart types. These pretty charts help to pass on their information.

Highchart JS

Highcharts JS is a pure JavaScript library making charts, the main features are as follows: Compatibility: Compatible with all today's browsers, including the IPhone, IE and Firefox, and so on, completely free for individual users, pure JS, no BS; support for most chart types: line graph, graph, Area map, area graph, histogram, pie chart, scatter map; cross-language: PHP, ASP. NET or Java can be used.

Flotr.

Flotr is a JavaScript drawing tool based on the Prototype development. Support legend, mouse tracking, image area selection, Image zoom, add event hooks (events hook), set style via CSS, etc.

Flot.

Flot is inspired by PLOTR and Plotkit, and Ole Laursen has developed a chart-drawing (WEB chart) plug-in based on jquery and named Flot. Flot is a pure Javasript library that focuses on simple usage, attractive appearance and interactive features. Supported browsers are: Internet Explorer 6+, Chrome, Firefox, Safari and Opera 9.5+.

Jfreechart.

Jfreechart is used primarily for a variety of charts, including Pie, histogram (regular histogram and stack histogram), line, area, map, mixed, Gantt, and some dashboards. The Jfreechart project has a long history and a large number of developers are maintaining it.

Plotkit.

Plotkit is a pure JavaScript drawing toolkit. It supports HTML Canvas and Adobe SVG. Has a very complete document for user-friendly use.

Planetary.js.

Planetary.js is an amazing JavaScript library that creates an interactive web globe. It uses D3 and Topojson to parse and render geographic information. Planetary.js uses a plugin-based architecture, and even the default itself is a plugin! This makes planetary.js very flexible, and it allows users to fully customize, including color, size, rotation, and so on. More importantly, users can use custom colors and sizes anywhere to display the animated "pings"; it also supports mouse drag and zoom, 100% free and open source.

Ember Charts

Ember Charts is a chart library, built using the Ember.js and d3.js frameworks. It includes timelines, bar charts, pie charts, and scatter plots, which are very easy to extend and modify. These diagram components are out-of-the-box and are well-applied in chart interaction and presentation.

Sparky.

Sparky is a free JavaScript waveform library that relies on Raphaël and is very easy to use. Support for multiple chart types (polyline, bar, area), polyline and region charts can have multiple color selections.

Envision.js.

Envision.js is a JavaScript library for simplifying and quickly creating interactive HTML5 visualizations. It includes two chart types: Time series diagrams and Finance, providing APIs to developers who can directly customize the creation of charts. This library is based on FLOTR2 and HTML5 Canvas. It is independent of the framework and relies on several small JavaScript libraries.

Dc.js.

Dc.js is a JavaScript library with native crossfilter that supports and allows efficient presentation of large cubes (based on the crossfilter example); The chart uses dc.js rendering, which is driven by native data, so it can get real-time feedback from users. Dc.js's biggest highlight is the ability to provide a simple and powerful JavaScript library for data visualization and analysis, as well as support for the mobile side of the desktop browser.

Elycharts.

Elycharts is an easy-to-use, customizable JavaScript diagram drawing component. This component can be used to draw most commonly used chart types including: line, column, is, bar, pie, sparklines and combinations. It supports a variety of interactive features including mouse tracking, event handling, highlighting selected areas with various animations, tooltip,html anchor points, and more. You can dynamically modify the data and display the changes in the chart with a nice animated effect. Charts are generated using SVG/VML technology and are developed based on jquery + Raphaël.

Awesomechartjs.

Awesomechartjs Awesome Chart JS is a JavaScript-generated class library that uses HTML5 's canvas tags to create statistical charts. This type of library is designed to ease the developer's workload by writing a few lines of code to produce beautiful graphs.

Arbor.js.

Arbor.js is a visual graphics library created with Web Works and jquery, which provides an efficient, force-oriented layout algorithm for graphics organization and screen refresh processing.

Canvasxpress.

Canvasxpress is a JavaScript chart class library based on the HTML5 Canvas label, which supports a variety of common chart types such as linear, column, pie, and heat maps. It generates graphs that are highly interactive and display values dynamically when the mouse is placed. In addition, it also has a very high level of customization, you can set the chart text, color and to show/hide elements and so on. Of course, the more important thing is that although it uses HTML5, it still supports the IE6 browser.

JSXGraph.

JSXGraph is an interactive geometry library drawing that supports a variety of browsers. JSXGraph uses SVG and VML.

Rickshaw.

Rickshaw is a simple JS library for plotting time series diagrams based on the Mike Bostock ' s delightful D3 library.

RGraph.

RGraph is a HTML5 Canvas graphics library based on the HTML5 canvas label, supporting 20 different types of visualizations. Using the canvas label, RGraph creates a "HTML5 chart" that means faster Web page loading and fewer Web server loads. This can help reduce the size of web pages, low power consumption, and faster browsing speeds.

Fusion Chart

The Fusioncharts Suite XT is a professional JavaScript library that can create any type of chart. It creates charts that can be completely customized, tags, fonts, borders, and so on, can be modified. It has strong interactivity, there are many informative tips, clickable legend keywords, as well as dril-down, zoom/Scroll and click to print the chart function.

. Graph Dracula

Dracula is a series of tools to display and layout interactive diagrams, including a variety of related algorithms. It's just plain JavaScript and SVG, and no Flash,java, other plugins. It's very easy to use, and the user can easily customize any element.

Bluff.

Bluff is a JavaScript Ruby Gruff graphing library port. It supports all gruff features, but has minimal dependencies. Users only need to run a third-party script: JS. The Class copy (only 2.6kB after compression) and Google's Excanvas copy are used to support canvas in IE. Both scripts are downloaded in the Bluff. The size of the Bluff itself after compression is about 11KB.

Pizza Pie Chart

Pizza Pie Charts is a responsive pie chart that, based on the Adobe Snap SVG Framework, replaces JavaScript objects with HTML markup and CSS to make it easier to integrate advanced technologies.

Jgraph.

HTML5 diagram component, fully supports L IE 6-8 and touch screen devices. Jgraph has been providing state-of-the-art charting software components since 2001 and is the first popular Jgraph Swing library. Then in 2005 years walk in the forefront of the era of development mxgraph.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.