See what ZingChart's 50+ built-in chart types & modules can do for your data visualization projects. Create animated & interactive charts with hundreds of thousands of data records using the ZingChart JavaScript charting library. Try for free or See our pricing See More Demos Create a ZingChart using a simple to understand JSON configuration Basics Quickly and easily create a basic chart { "type": "bar ", "title": { "text": "Hello World!" }, "plot": { "value-box": { "text": "%v " }, "tooltip": { "text": "%v " } }, "legend": { "toggle-action": "hide ", "header": { "text": "Legend Header" }, "item": { "cursor": "pointer" }, "draggable": true, "drag-handler": "icon" }, "scale-x": { "values": [ "Mon", "Wed", "Fri" ] }, "series": [ { "values": [3,6,9], "text": "apples" }, { "values": [1,4,3], "text": "oranges" } ] } Hello World! Mon Fri Wed 0 9 1 2 3 4 5 6 7 8 3 6 9 1 4 3 Legend Header apples oranges Basics Mixed Chart 3D Animation Labels Markers Scales Zooming Choose from Over 50 Built-In Chart Types and Modules VIEW ALL CHART TYPES Area 3D Area Bar 3D Bar 100% Stacked Box Plot Bubble Pie Bubble Bubble Pack Bullet Calendar Chord Depth Flame Funnel Gauge Grid Heat Map Heatmap Plugin Maps Line 3D Line Mixed Nested Pie Network Diagrams Pareto Pie 3D Pie Pop. Pyramids Radar Range Rankflow Scatter Scorecard Stock Stream Tile Map Tree Treemaps Variwide Vector Plot Venn Diagrams Violin Waterfall Word Cloud ZingChart is Packed with Helpful Features VIEW FEATURES Scalable, Big Data Optimized for data sets ranging from 10,000 to 100,000 records. Built-In Interactivity High-performance real-time charts with interactive, drill-down features. API Events and Methods Make your charts come alive by modifying them with your custom code. Dependency-Free 100% dependency-free: No need for third-party frameworks or plugins. ZingChart Integrates with Popular JavaScript Development Stacks ZingChart is dependency free and pure JavaScript. Install via NPM npm install zingchart After downloading package locally, include the script using ES6 Modules: import {zingchart, ZC} from './zingchart/es6.js'; // Modules must be imported EXPLICITLY when using es6 version import './zingchart/modules-es6/zingchart-pareto.min.js'; For quickest download, use the ZingChart CDN : <script src="https://cdn.zingchart.com/zingchart.min.js"></script> Add your chart element wrapper <div id="myChart"></div> Include the library in your HTML document and then render your chart! <!-- Just before the closing body tag is best --> <script src="https://cdn.zingchart.com/zingchart.min.js"></script> <script> zingchart.render({ id: 'myChart', data: { type: 'line', series: [ { values: [54,23,34,23,43] }, { values: [10,15,16,20,40] } ] } }); </script> </body> View on GitHub More Details We've been trusted with advanced data-visualization solutions for worldwide organizations since 2008 We've Got Your Business Concerns Covered Pricing That Suits You Our prices fit a variety of use cases, from starting small to going big. Custom Development Need us to build a feature for you or build your project? We can do that! Support Available We offer advanced support options for sophisticated solutions. Consulting Services As experts in the data visualization space, we offer project consulting. Product News 2.9.7 Released September 21, 2021 Full Change Log Download Recent Communication @ZingChart Made with Love in San Diego, California ABOUT THE COMPANY We created ZingChart because other JavaScript charting libraries didn’t suit our needs as developers and data-visualization professionals. 2105 Garnet Avenue San Diego, CA 92109 +1 (858) 490-5281 sales@zingsoft.com PRODUCT Features Gallery Docs Support Pricing Download Learn More About v2.9.7 COMPANY Blog About Us Contact Legal Privacy Updates ACCOUNT Log In Sign Up CONNECT WITH US OTHER PRODUCTS © 2009 - 2021 ZingSoft, Inc.