Using Multi-Column Data with D3 Part 2

Okay, so after reading my previous tutorial we are now capable of loading in a CSV file with multi-column data and completely reconstructing it.

That's great! but... what about being able to categorize, filter, (somewhat) transition, and color the representation of that data? That's what this tutorial is all about! :)

Using Multi-Column Data with D3 Part 1

In my previous tutorial, I showed how to import data from a CSV file or a text file. However, oftentimes the type of data that you need to use has multiple columns, like so:

Column 1 Title, Column 2 Title, Column 3 Title
1, 2, 3
4, 5, 6

rather than being in a single column format, like this:

1
2
3
4
5
6

One common reason for having multi-column data is if all of the data can be split into categories and you need to visually show which category each piece of data is in, through colors, spacing, positioning, highlighting, font size, or etc.

In this tutorial, I'm just going to show you how to fully reconstruct the data by accessing it in memory, as it's not entirely the simplest thing for a beginner to do. Once we're able to access individual pieces of data, we'll be able to create multi-column/multi-category graphs, filter out certain categories of data, color them, etc.

Interacting with a MySQL Database Table in PHP

Now that you can create HTML forms and receive HTTP POST data and properly set up a table in a MySQL database, you are ready for the next step: interacting with this MySQL database through the use of an HTML form. All that's left for you to know and do is run MySQL queries from PHP code. Here's the script we're going to be looking at in this tutorial: