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.
Showing posts with label attribute. Show all posts
Showing posts with label attribute. Show all posts
Saturday, September 15, 2012
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! :)
Thursday, July 26, 2012
Introduction to D3
This tutorial is in response to a request by someone who wanted a basic introduction to D3. I've never used D3 before, but I've learned a bit about it so far and this is just an introduction to get you started anyways.
Basically, what I've found is that D3 is a lot like JQuery in many regards. You can select existing (and not-yet-existing) elements, manipulate them graphically, perform animations, etc. The best aspect of D3 seems to be that although the learning curve is rather steep for anyone who's a beginning coder, it actually ends up making most tasks of displaying/arranging data on a web page very simple and easy - you just have to know how. :)
Basically, what I've found is that D3 is a lot like JQuery in many regards. You can select existing (and not-yet-existing) elements, manipulate them graphically, perform animations, etc. The best aspect of D3 seems to be that although the learning curve is rather steep for anyone who's a beginning coder, it actually ends up making most tasks of displaying/arranging data on a web page very simple and easy - you just have to know how. :)
Thursday, January 12, 2012
Changing Page Content with JQuery
This tutorial is in response to a specific request by someone. Here is the summarized version of their request:
In order to change page content with JQuery, you must first import JQuery and know the basics of how to use it, all of which I discussed here.
We will also need two images to test this out with and a section of content to change dynamically when the mouse moves over and out of this image. Here is the code we will use for our initial image:
How would you use JQuery to create an image that changes when the mouse is over it and also changes the content (text/image(s)) in a different section of the page dynamically (without refreshing the page)?
In order to change page content with JQuery, you must first import JQuery and know the basics of how to use it, all of which I discussed here.
We will also need two images to test this out with and a section of content to change dynamically when the mouse moves over and out of this image. Here is the code we will use for our initial image:
Subscribe to:
Posts (Atom)