Time series visualization with Timeplot


Posted in: data, javascript | Save to del.icio.us | Twit This! 18 Apr 2008

Using lines, points and other geometrical objects to visualize data has always fascinated me; specially time series. Time series charts let you visualize data points separated by time intervals.

The following image shows an example of a time series data representing the salary of software engineers for a particular duration.
TimePlot

Timeplot is a javascript widget which lets you visualize time series data in a colorful manner with many options to tweak the final output. In this post we will build a time series plot for visualizing yearly US immigrant population. You can download the raw data here.
Lets start with creating a time series plot.

Shown below is a sample excerpt from the data file.
timeplot data
STEP 1. Creating the basic container.
The basic setup is simple. A javascript library and a container to hold the plot as shown below.

timeplot1

STEP 2. The main display block.
The main display code is executed in the onLoad event. There are many options to tweak the display but the one shown below will get you started. You can save the below code in a separate file or embeded in a script tag.
timeplot2

The final output is show below.
<br /> Your browser does not support inline frames or is currently configured not to display inline frames.<br />

Download code

Share this post

Share on Facebook
Share on Twitter
Share on StumbleUpon
Share on Delicious
Share on Digg
Share on Technorati
Share on Reddit
Feeds RSS Subscribe to site Feed

Other related posts

  • No Related Post

2 Responses

1

Dave

April 24th, 2008 at 5:41 am

Very good. Thank you. I’m sure you’ve seen the following, bu t just in case…

http://twist.flaptor.com/freq?gram=twitter%2C%20friendfeed%2C%20facebook

– David

2

timeplots

May 14th, 2008 at 6:52 pm

[...] series visualization with TimeplotJavaScript widget for displaying time series datahttp://www.codediesel.com/data/timeplot/DynCyc97 - 6. What happens without the slow-fast hypothesisBelow the streamline visualizing the [...]

Comment Form

About this blog

This site is a digital habitat of Sameer, a freelance web developer working from Pune.More

On Twitter

Posting tweet...


  • Users Online

    • 4 Users Online
    • 2 Guests, 2 Bots
  • Categories