CODEWITHSUNDEEP
javascriptcanvaschartssvgd3.js
iJade
iJade

Reputation: 23791

Simple d3.js sample chart to get started

I have looking through all the chart examples on the d3.js site but it's too much complex to understand. All i want is to plot x axis and y axis and plot a json data like

{count:100,year:1999}
{count:240,year:2010}
{count:290,year:2009}

Count on x axis and year on y axis.Can any one provide a simple sample to get started.

Upvotes: 3

Views: 4401

Answers (3)

PhoebeB
PhoebeB

Reputation: 8570

These two sandboxs are helpful for understanding d3 - http://phrogz.net/js/d3-playground/#VerticalBars_HTML (although some examples don't work anymore) and http://enjalot.com - Tributary.

Here is the start of a bar chart based on your data : http://enjalot.com/inlet/4125640/

Upvotes: 3

gotohales
gotohales

Reputation: 3695

Have you taken a look at this tutorial? It seems to break it down fairly simply, going from a rudimentary chart to a more complex svg example. Once those seem to make sense, you could try replacing the data variable with your JSON and go from there.

Upvotes: 0

Shamis Shukoor
Shamis Shukoor

Reputation: 2515

This is what I use with nvd3 

  [{values: 
              [{"value":3,"label":"17 hr"},
               {"value":2,"label":"18 hr"},
               {"value":1,"label":"19 hr"}]
    }];

Here label is the x axis and value is the y axis

Upvotes: 0

Related Questions