background preloader

JavaScript

Facebook Twitter

Interactive Data Visualization for the Web. Copyright © 2013 Scott Murray Printed in the United States of America. O’Reilly books may be purchased for educational, business, or sales promotional use. Online editions are also available for most titles ( For more information, contact our corporate/institutional sales department: 800-998-9938 or <corporate@oreilly.com>. Nutshell Handbook, the Nutshell Handbook logo, the cover image, and the O’Reilly logo are registered trademarks of O’Reilly Media, Inc. Interactive Data Visualization for the Web, the cover image of a long-tail bushtit, and related trade dress are trademarks of O’Reilly Media, Inc. Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks. While every precaution has been taken in the preparation of this book, the publisher and author assume no responsibility for errors or omissions, or for damages resulting from the use of the information contained herein.

Raphaël—JavaScript Library. RGraph: HTML5 charts library (Open Source!) Incharts3d - 3d interactive charts library. NVD3.js :: re-usable charts for d3.js. Flot: Attractive JavaScript plotting for jQuery. RGraph: HTML5 charts library (Open Source!) Cubism.js. Time Series Visualization foo7.6 bar−6.2 foo + bar1.4 foo - bar14 Cubism.js is a D3 plugin for visualizing time series. Use Cubism to construct better realtime dashboards, pulling data from Graphite, Cube and other sources. Cubism is available under the Apache License on GitHub. Scalable Cubism fetches time series data incrementally: after the initial display, Cubism reduces server load by polling only the most recent values. Effective Cubism also scales in terms of perception: small multiples aligned by time facilitate rapid comparison.

Area (120px)7.6 Area (30px)7.6 In contrast, horizon charts reduce vertical space without losing resolution. Horizon, 1-band (120px)7.6 Horizon, 2-band (60px)7.6 Horizon, 3-band (40px)7.6 Horizon, 4-band (30px)7.6 By combining position and color, horizon charts improve perception: position is highly effective at discriminating small changes, while color differentiates large changes. Flexible Cubism is data-source agnostic. Want to learn more? D3.js - Data-Driven Documents. Highcharts - Interactive JavaScript charts for your webpage.