HTML5 Graphics & Data Visualization Cookbook396 Pages Ben Fhala(Author)
- live help when you get stuck.
- Reviewed homework.
- Code reviewe by your assigned trainer.
Our goal is that by the end of this book you will have a strong foundation; knowing when to create a chart on your own from scratch and when it would be a good idea to depend on other APIs.
We finish our book in our last two chapters exploring Google maps and integrating everything we learnt into a full project.
Who this HTML5 Data visualization book for?
Chapter 1 Drawing Shapes in Canvas
This chapter's main focus is to break you into the world of canvas . We will spend the majority of our time in this chapter understanding how canvas works and how to create lines and shapes in canvas. This learning will help us in future chapters to create advance charts using canvas.
In this chapter, we will master the basic shapes and styles of drawing with the canvas API. This chapter will be the graphic's backbone to the rest of the book, so if at any stage you feel you need a refresher you could come back to this chapter. Drawing lines can be ... well not very thrilling. What better way to make it more dramatic, than to integrate a theme into this chapter as a subtopic: creating flags!
Chapter 2 Advanced Drawing in Canvas
This chapter is the last Chapter that we dig deep into canvas as the remaining chapters will be focused on building charts and interactive charts.
In this chapter we will continue mastering our skills with canvas by adding to our tool belt working with curves, images , text and even pixel manipulation.
Chapter 3 Creating Cartesian Based Graphs
Our first graph/chart under the microscope is the most popular and most simple one to create. We can put them all roughly under the Cartesian-based graphs. Altogether this graph style is relatively simple; it opens the door to creating amazingly creative ways of exploring data. In this chapter we will lay down the foundations to building charts in general and hopefully motivate you to come up with your own ideas on how to create engaging data visualizations.
Chapter 4 Let's Curve Things Up
In the last chapter we built a component for linear graphs ranging from dots, lines and bars. Most of the data we worked with was 2 dimensional while we ended our lesson with a 4 dimensional chart; it was still represented using linear art. In this chapter we will leverage the capability of creating non-linear data to represent data.
Chapter 5 Getting out of the Box
We covered our bases with the majority of the standard common charts. At this stage, it's time for us to become more creative with our charts. From this chapter and on we will progress into more out of the box, less commonly used charts and revisit some of our old charts to incorporate into them dynamic data or change their layout.
Chapter 6 Bringing Static Things to Life
Until now the importance of keeping things organized and clean wasn't as important as getting our projects done as we had relatively small projects. This chapter will break us into a few new habits by first making everything dynamic followed by creating a more Object Oriented Program program so it's easier for us to separate between tasks and reduce our code footprint. After all this hard work we will revisit our application and start adding extra logic geared at making our application animated layer by layer.
This chapter is a great recourse for refactoring practice. In the first half of this chapter we will be focused on improving our code structure to make it possible for us to have the level of control we will need in the second half of the chapter.
Chapter 7 Depending on the Open Source Sphere
The open-source HTML5 data visualization community is extremely rich and detailed with so many options and some really amazing libraries. Each library has its strong points and its disadvantages some are stand alone codes while other depend on other platforms such as Jquery. Some are really big, some are really small - there isn't one option that is perfect for all opportunities but with such a rich amount of options the most important thing is to figure out what library is the right one for you.
There is always a give way when working with open source libraries mainly when it comes to file sizes and having just too much features that drag down the speed of your application, load time and such but with the richness and creativeness of the community its hard to avoid really fantastic charts that can be created in minutes instead of hours.
In this chapter we will explore working with some of these options. Instead of using the libraries according to the documentation of the projects our goal will be to try to find ways to override the built in libraries to enable us better control over our applications in case we can't find a suitable solution in the documentation of an application. The goal in this chapter then will be double: To find ways to do things that aren't naturally set to work. To find ways to bypass problems.
One more important thing to note all of these open source libraries have copy rights. It is advised that you check the legal documentation of the project before you go ahead with it.
Chapter 8 Playing with Google Charts
In this chapter we will explore the Google visualization API task by task. We will look at the steps involved to create a chart and integrate with with the charting API.
Chapter 9 Using Google Maps
This chapter will be dedicated to explore some of the features available on Google maps to get us ready to work with mapping in general. Mapping on its own isn't data visualization but after we establish our base understanding how to work with maps we will have a very stable background that would enable us to create many cutting edge cool projects integrating data and data visualization.
In this chapter we will explore the main ways to create maps in the Google sphere.
Chapter 10 Maps in Action
In this chapter on mapping, we will tie in more deeply to our topic of data visualization. One of the most popular ways to visualize data these days is by using maps. In this chapter, we will explore a few ideas on how to integrate data into maps using the Google Maps platform.
Apendix: Picking your Graphics Technology
Until recently Flash was the only viable solution to create dynamic and interactive graphics, but with the new surge of supported technologies in HTML5 I thought it would be a good place to start by giving an overview of animation/drawing styles in HTML5. These days HTML5 offers a large array of options that are becoming an alternative to Flash.
Although this book will mainly be focused on creating graphics using Canvas and open source tools, we wanted to explore in this chapter alternative options. This chapter is not an exhaustive consideration of these alternatives but instead can be used as a guide to other options in creating content in HTML5.Book Source
Act now save your seat before someone else takes yours.