In my previous tutorial, I showed you conceptually how to average the data such that the 3 pieces of data in each row are averaged together and only 1 bar and text is shown per row for each average. This time I'm actually going to backtrack to the code I was using in the tutorial before that so that I can show you another way of averaging the data.
What we're going to average this time are not the 3 pieces of data per row (we're going to leave those alone this time); instead, we're going to average all of the elements each with a unique "Site Type" and "Media Type" value together.
*** View this blog with HTTP instead of HTTPS to see the code formatted nicely. ***
Showing posts with label multi. Show all posts
Showing posts with label multi. Show all posts
Thursday, September 27, 2012
Saturday, September 15, 2012
Averaging Multidimensional Data for D3
Building from the example in my previous tutorial, I am only going to slightly modify a few aspects of the graph. My goal for this tutorial is to show how to code the graph differently such that the 3 pieces of data per row are averaged together into 1 piece of data per row.
Saturday, September 1, 2012
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! :)
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! :)
Labels:
array,
attribute,
categorize,
column,
CSV,
D3,
data,
filter,
JavaScript,
multi,
numeric,
transition,
values
Friday, August 17, 2012
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:
rather than being in a single column format, like this:
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.
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.
Labels:
array,
associative,
categorize,
column,
CSV,
D3,
data,
filter,
JavaScript,
multi,
multidimensional,
numeric,
values
Subscribe to:
Posts (Atom)