Vector Graphics for Web Design
Using SVG with CSS3 and HTML5 starts with the basics, explaining how simple shapes and icons are defined in SVG, and then builds upon that foundation to create complex graphics and interactive, animated applications. It covers all the features you're likely to come across in web design, while avoiding areas with poor browser support. « less
* Learn to use the facilities provided by D3.js to create data-driven visualizations
* Explore the concepts of D3.js through examples that enable you to quickly create visualizations including charts, network diagrams, and maps
* Get practical examples of visualizations using real-world more » data sets that show you how to use D3.js to visualize and interact with information to glean its underlying meaning
This book will take you through all the concepts of D3.js starting with the most basic ones and progressively building on them in each chapter to expand your knowledge of D3.js.
Starting with obtaining D3.js and creating simple data bindings to non-graphical HTML elements, you will then master the creation of graphical elements from data. You'll discover how to combine those elements into simple visualizations such as bar, line, and scatter charts, as well as more elaborate visualizations such as network diagrams, Sankey diagrams, maps, and choreopleths.
Using practical examples provided, you will quickly get to grips with the features of D3.js and use this learning to create your own spectacular data visualizations with D3.js.
WHAT YOU WILL LEARN
* Install and use D3.js to create HTML elements within the document
* Use development tools such as JSBIN and Chrome Developer Tools to create D3.js applications
* Retrieve JSON data and use D3.js selections and data binding to create visual elements from data
* Create and style graphical elements such as circles, ellipses, rectangles, lines, paths, and text using SVG
* Turn your data into bar and scatter charts, and add margins, axes, labels, and legends
* Use D3.js generators to perform the magic of creating complex visualizations from data
* Add interactivity to your visualizations, including tool-tips, sorting, hover-to-highlight, and grouping and dragging of visuals
ABOUT THE AUTHOR
Michael Heydt is an independent consultant, programmer, educator, and trainer. He has a passion for learning and sharing his knowledge of new technologies. Michael has worked in multiple industry verticals, including media, finance, energy, and healthcare. Over the last decade, he worked extensively with web, cloud, and mobile technologies and managed user experience, interface design, and data visualization for major consulting firms and their clients. Michael's current company, Seamless Thingies (www.seamlessthingies.tech), focuses on IoT development and connecting everything with everything.
He is the author of numerous articles, papers, and books, such as Instant Lucene. NET, Learning Pandas, and Mastering Pandas for Finance, all by Packt Publishing, on technology. Michael is also a common speaker at .NET user groups and various mobile, cloud, and IoT conferences and delivers webinars on advanced technologies. He can be reached through his website e-mails, firstname.lastname@example.org and email@example.com and on Twitter at @mikeheydt.
TABLE OF CONTENTS
1. Getting Started with D3.js
2. Selections and Data Binding
3. Creating Visuals with SVG
4. Creating a Bar Graph
5. Using Data and Scales
6. Creating Scatter and Bubble Plots
7. Creating Animated Visuals
8. Adding User Interactivity
9. Complex Shapes Using Paths
10. Using Layouts to Visualize Series and Hierarchical Data
11. Visualizing Information Networks
12. Creating Maps with GeoJSON and TopoJSON
13. Combining D3.js and AngularJS « less
Build stunning maps and visualizations using D3.js
D3.js is a visualization library used for the creation and control of dynamic and interactive graphical forms. It is a library used to manipulate HTML and SVG documents based on data. A consolidated resource on obtaining geographic data, modifying it to your convenience, and visualizing it with augmented more » data using D3.js, this book will meet your mapping needs.
Starting with a working map, you will explore the tools required to start the construction process, further moving on to cover the fundamentals of SVG and understanding its relation to creating maps using D3. Equipped with this overview, you will learn to make optimum use of D3's mapping, covering the main enter, update, and exit methods that allow D3.js to do its magic. Dealing with data joining and pairing with HTML and SVG, you will be introduced to different aspects of GEO data, along with the common file formats and converting data into GeoJSON and TopoJSON. You will learn to apply interactivity to your maps and create stunning visualizations before finally ensuring problem-free development with a chapter on troubleshooting. « less
Native Interactivity and Animation for the Web
Flash is fading fast as Canvas continues to climb. The 2nd edition of this popular book gets you started with HTML5 Canvas by showing you how to build interactive multimedia applications. You'll learn how to draw, render text, manipulate images, and create animation - all in the course of building an more » interactive web game throughout the book.
Over 70 code examples to create vector graphics and data visualizations!
Raphael is an exceptional library that makes drawing vector graphics in the browser straightforward. It boasts a large number of methods that facilitate drawing and animating graphics, allowing developers to create flexible, interactive web applications and data visualizations.
Learning Raphael JS more » Vector Graphics takes you from being a complete vector graphics novice to an accomplished vector graphics developer. Packed with illustrations and code demos, this book covers a wide array of concepts and takes you through them by example. The Raphael library is covered in detail and in the context of its real-world applicability. « less
Graphics and Visualization on the Web
Get to grips with RaphaelJS - a powerful cross-browser compatible vector graphics library, to create interactive 2D graphics and animations with ease
Learn something new in an Instant! A short, fast, focused guide delivering immediate results. Create cross-browser imageless drawings and animations, with DOM access. Create your own shape, almost any shape, with simple and illustrated techniques. Write once and run in almost any browsers including more »IE6. « less
Add Interactivity and Motion to Your Web Applications
Creating Data-Driven Documents
Using historical tables, geographical information, and other data, you'll graph bus breakdowns and accidents and the percentage of subway trains running on time, among other examples. By the end of the book, you'll be prepared to build your own web-based data visualizations with D3. « less