Coffee data

_.md

[ Launch: Coffee data ] 6757746 by dwskau
[ Launch: Tabletop test ] 6743715 by roundrobin
[ Launch: Tabletop test ] 6743612 by roundrobin

chart.css

.chart-heading{
    fill: #808080;
	font-size: 14px;
	font-family: Arial;
}

.tick text{
    fill:#808080;
	font-size: 10px;
	font-family: Arial;
}

.tick line{
      fill: "none";
  	  stroke: #474747;
  	  stroke-width: 1px;
}


.domain{
      fill: none;
  	  stroke: #474747;
  	  stroke-width: 1px;
}

config.json

{"description":"Coffee data","endpoint":"","display":"svg","public":true,"require":[{"name":"Tabletop","url":"https://raw.github.com/jsoma/tabletop/master/src/tabletop.js"}],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"test.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"chart.css":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"thumbnail":"http://i.imgur.com/7dfvQ6F.png"}

inlet.js

//Pull the data
var data = tributary.test;

//Chart Attributes
var chartWidth = 426;
var chartHeight = 176;
var barColor = "#4AACD3";
var paddingBetweenBarsPerc = 0.3;
var chartX = 100;
var chartY = 100;


// Here do you see one responsive chart behavior.
// if the chartHeight goes below those contraints
// the number of ticks in the y axis changes accordingly
var nrOfTicks = 10;
if(chartHeight <= 100) nrOfTicks = 5;
if(chartHeight <= 50) nrOfTicks = 2;
if(chartHeight <= 20) nrOfTicks = 1;

//Define which type of coffe you want?
//var coffeeType = "arusha-lbs";
//var coffeeType = "k7-lbs";
var coffeeType = "mokka-lbs";


//Pull the max value of all Mokka-lbs data
var maxValue = _.chain(data)
				.map(function(d,i){ return _.pick(d,coffeeType)})
                .map(function(d,i){ return parseFloat(d[coffeeType])})
                .max()
                .value();

//Pull all te dates value of our data array
var dates =  _.chain(data)
				.map(function(d,i){ 
                  return new Date(_.values(_.pick(d,"date"))[0]);
                })
                .sortBy(function(d,i){
                  return d;
                })
				.value();

//Assign start and end date
var startDate = _.first(dates);
var endDate = _.last(dates);


//Define helpful Scales
var yScale = d3.scale
			   .linear()
               .domain([maxValue,0])
               .range([chartHeight,0]);

var yScaleInverse = d3.scale
                      .linear()
                      .domain([0,maxValue])
                      .range([chartHeight, 0]);


var barWidth = d3.scale.ordinal()
				.domain(d3.range(data.length))
			    .rangeBands([0, chartWidth], paddingBetweenBarsPerc);

var x = d3.time.scale()
    .domain([d3.time.day.offset(startDate, 0),  endDate])
    .range([0, chartWidth]);


//Define and Create Axis elements on the left and bottom of the chart

var yAxis = d3.svg
.axis()
.scale(yScaleInverse)
.tickSize(10)
.ticks(nrOfTicks)
.orient("left");

var xAxis = d3.svg
.axis()
.scale(x)
.ticks(d3.time.months)
.tickSize(15, 0)
.tickFormat(d3.time.format("%B"))
.orient("bottom");


var barGroup = g.append("g")
  .attr({
    transform: "translate("+[chartX,chartY]+")",
    "class": "group"
  })


barGroup.append("g")
  .attr({
    transform: "translate("+[-20,0]+")"
  })
  .call(yAxis);

var XAxisGroup = barGroup.append("g")
  .attr({
	transform: "translate("+[0, chartHeight + 4]+")"
  })
  .call(xAxis);

XAxisGroup
  .selectAll("text")
    .attr("y", 0)
    .attr("x", 14)
    .attr("dy", "1.498em")
    .attr("transform", "rotate(55)")
    .style("text-anchor", "start");

var barGroupSelection = barGroup.selectAll(".bars")
  .data(data)
  .enter();

barGroup.append('text')
.text("How many lbs of Mokka sold per month?")
.attr({"class":"chart-heading",
       y: -20});

barGroupSelection
.append("rect")
.attr({
  width: function(d,i){
  return barWidth.rangeBand();
  },
  height: function(d,i){
    return yScale(d[coffeeType]);
  },
    fill: barColor,
    transform: function(d,i){
      var x1 = x(new Date(d.date))-barWidth.rangeBand()/2;
      var y = chartHeight - yScale(d[coffeeType]);
	  return "translate("+[x1, y ]+")";
    }
}); 

test.json

[{
	"date":"1/1/2012",
	"mokka-lb":8.12,
	"mokka-lbs":27,
	"arusha-lb":9.18,
	"arusha-lbs":23,
	"ethiopianyirgacheffe-lb":8.32,
	"ethiopianyirgacheffe-lbs":28,
	"k7-lb":5.86,
	"k7-lbs":12,
	"pacas-lb":6.41,
	"pacas-lbs":23,
	"uganda-lb":5.56,
	"uganda-lbs":18,
	"rowNumber":1
},
{
	"date":"2/1/2012",
	"mokka-lb":9.08,
	"mokka-lbs":23,
	"arusha-lb":10.69,
	"arusha-lbs":16,
	"ethiopianyirgacheffe-lb":9.67,
	"ethiopianyirgacheffe-lbs":19,
	"k7-lb":6.6,
	"k7-lbs":22,
	"pacas-lb":6,
	"pacas-lbs":17,
	"uganda-lb":3.71,
	"uganda-lbs":9,
	"rowNumber":2
},
{
	"date":"3/1/2012",
	"mokka-lb":9.66,
	"mokka-lbs":28,
	"arusha-lb":11.68,
	"arusha-lbs":22,
	"ethiopianyirgacheffe-lb":10.72,
	"ethiopianyirgacheffe-lbs":17,
	"k7-lb":7.71,
	"k7-lbs":31,
	"pacas-lb":7.21,
	"pacas-lbs":13,
	"uganda-lb":2.52,
	"uganda-lbs":0,
	"rowNumber":3
},
{
	"date":"4/1/2012",
	"mokka-lb":9.59,
	"mokka-lbs":35,
	"arusha-lb":11.99,
	"arusha-lbs":30,
	"ethiopianyirgacheffe-lb":11.72,
	"ethiopianyirgacheffe-lbs":15,
	"k7-lb":8.47,
	"k7-lbs":31,
	"pacas-lb":8.07,
	"pacas-lbs":20,
	"uganda-lb":4.52,
	"uganda-lbs":5,
	"rowNumber":4
},
{
	"date":"5/1/2012",
	"mokka-lb":7.69,
	"mokka-lbs":42,
	"arusha-lb":10.83,
	"arusha-lbs":38,
	"ethiopianyirgacheffe-lb":10.47,
	"ethiopianyirgacheffe-lbs":23,
	"k7-lb":6.88,
	"k7-lbs":38,
	"pacas-lb":6.81,
	"pacas-lbs":20,
	"uganda-lb":4.43,
	"uganda-lbs":1,
	"rowNumber":5
},
{
	"date":"6/1/2012",
	"mokka-lb":9.41,
	"mokka-lbs":34,
	"arusha-lb":11.57,
	"arusha-lbs":29,
	"ethiopianyirgacheffe-lb":12.28,
	"ethiopianyirgacheffe-lbs":16,
	"k7-lb":7.09,
	"k7-lbs":44,
	"pacas-lb":6.42,
	"pacas-lbs":21,
	"uganda-lb":5.21,
	"uganda-lbs":5,
	"rowNumber":6
},
{
	"date":"7/1/2012",
	"mokka-lb":10.81,
	"mokka-lbs":26,
	"arusha-lb":13.14,
	"arusha-lbs":24,
	"ethiopianyirgacheffe-lb":11.36,
	"ethiopianyirgacheffe-lbs":11,
	"k7-lb":7.75,
	"k7-lbs":34,
	"pacas-lb":7.71,
	"pacas-lbs":17,
	"uganda-lb":7.18,
	"uganda-lbs":7,
	"rowNumber":7
},
{
	"date":"8/1/2012",
	"mokka-lb":9.61,
	"mokka-lbs":36,
	"arusha-lb":14.11,
	"arusha-lbs":31,
	"ethiopianyirgacheffe-lb":11.03,
	"ethiopianyirgacheffe-lbs":18,
	"k7-lb":6.82,
	"k7-lbs":33,
	"pacas-lb":6.45,
	"pacas-lbs":8,
	"uganda-lb":6.81,
	"uganda-lbs":13,
	"rowNumber":8
},
{
	"date":"9/1/2012",
	"mokka-lb":10.13,
	"mokka-lbs":33,
	"arusha-lb":12.41,
	"arusha-lbs":23,
	"ethiopianyirgacheffe-lb":9.8,
	"ethiopianyirgacheffe-lbs":23,
	"k7-lb":5.38,
	"k7-lbs":23,
	"pacas-lb":5.27,
	"pacas-lbs":1,
	"uganda-lb":7.13,
	"uganda-lbs":9,
	"rowNumber":9
},
{
	"date":"10/1/2012",
	"mokka-lb":9.56,
	"mokka-lbs":42,
	"arusha-lb":12.95,
	"arusha-lbs":28,
	"ethiopianyirgacheffe-lb":10.01,
	"ethiopianyirgacheffe-lbs":26,
	"k7-lb":3.9,
	"k7-lbs":21,
	"pacas-lb":5.51,
	"pacas-lbs":6,
	"uganda-lb":5.3,
	"uganda-lbs":18,
	"rowNumber":10
},
{
	"date":"11/1/2012",
	"mokka-lb":7.56,
	"mokka-lbs":41,
	"arusha-lb":12.76,
	"arusha-lbs":34,
	"ethiopianyirgacheffe-lb":9.9,
	"ethiopianyirgacheffe-lbs":26,
	"k7-lb":5.13,
	"k7-lbs":28,
	"pacas-lb":4.15,
	"pacas-lbs":10,
	"uganda-lb":4.23,
	"uganda-lbs":14,
	"rowNumber":11
},
{
	"date":"12/1/2012",
	"mokka-lb":6.72,
	"mokka-lbs":34,
	"arusha-lb":14.35,
	"arusha-lbs":42,
	"ethiopianyirgacheffe-lb":8.32,
	"ethiopianyirgacheffe-lbs":27,
	"k7-lb":3.96,
	"k7-lbs":32,
	"pacas-lb":2.36,
	"pacas-lbs":4,
	"uganda-lb":4.83,
	"uganda-lbs":20,
	"rowNumber":12
},
{
	"date":"1/1/2013",
	"mokka-lb":5.74,
	"mokka-lbs":36,
	"arusha-lb":13.58,
	"arusha-lbs":39,
	"ethiopianyirgacheffe-lb":7.01,
	"ethiopianyirgacheffe-lbs":17,
	"k7-lb":2.85,
	"k7-lbs":38,
	"pacas-lb":2.97,
	"pacas-lbs":0,
	"uganda-lb":4.44,
	"uganda-lbs":10,
	"rowNumber":13
},
{
	"date":"2/1/2013",
	"mokka-lb":6.28,
	"mokka-lbs":27,
	"arusha-lb":14.99,
	"arusha-lbs":33,
	"ethiopianyirgacheffe-lb":5.53,
	"ethiopianyirgacheffe-lbs":23,
	"k7-lb":0.970000000000001,
	"k7-lbs":37,
	"pacas-lb":3.8,
	"pacas-lbs":8,
	"uganda-lb":6.19,
	"uganda-lbs":11,
	"rowNumber":14
},
{
	"date":"3/1/2013",
	"mokka-lb":6,
	"mokka-lbs":37,
	"arusha-lb":16.73,
	"arusha-lbs":31,
	"ethiopianyirgacheffe-lb":3.9,
	"ethiopianyirgacheffe-lbs":25,
	"k7-lb":0.829999999999999,
	"k7-lbs":34,
	"pacas-lb":2.09,
	"pacas-lbs":1,
	"uganda-lb":4.54,
	"uganda-lbs":1,
	"rowNumber":15
},
{
	"date":"4/1/2013",
	"mokka-lb":4.96,
	"mokka-lbs":39,
	"arusha-lb":16.22,
	"arusha-lbs":26,
	"ethiopianyirgacheffe-lb":4.29,
	"ethiopianyirgacheffe-lbs":21,
	"k7-lb":0.449999999999999,
	"k7-lbs":30,
	"pacas-lb":2.47,
	"pacas-lbs":2,
	"uganda-lb":2.68,
	"uganda-lbs":5,
	"rowNumber":16
},
{
	"date":"5/1/2013",
	"mokka-lb":6.46,
	"mokka-lbs":49,
	"arusha-lb":15.58,
	"arusha-lbs":33,
	"ethiopianyirgacheffe-lb":2.55,
	"ethiopianyirgacheffe-lbs":19,
	"k7-lb":0.150000000000001,
	"k7-lbs":30,
	"pacas-lb":3.63,
	"pacas-lbs":8,
	"uganda-lb":3.03,
	"uganda-lbs":14,
	"rowNumber":17
},
{
	"date":"6/1/2013",
	"mokka-lb":6.09,
	"mokka-lbs":49,
	"arusha-lb":15.44,
	"arusha-lbs":35,
	"ethiopianyirgacheffe-lb":3.52,
	"ethiopianyirgacheffe-lbs":18,
	"k7-lb":1.36,
	"k7-lbs":21,
	"pacas-lb":3.93,
	"pacas-lbs":17,
	"uganda-lb":4.5,
	"uganda-lbs":14,
	"rowNumber":18
},
{
	"date":"7/1/2013",
	"mokka-lb":4.16,
	"mokka-lbs":51,
	"arusha-lb":14.48,
	"arusha-lbs":37,
	"ethiopianyirgacheffe-lb":2.63,
	"ethiopianyirgacheffe-lbs":27,
	"k7-lb":0.410000000000001,
	"k7-lbs":18,
	"pacas-lb":4.39,
	"pacas-lbs":9,
	"uganda-lb":3.49,
	"uganda-lbs":15,
	"rowNumber":19
},
{
	"date":"8/1/2013",
	"mokka-lb":2.37,
	"mokka-lbs":47,
	"arusha-lb":13.32,
	"arusha-lbs":31,
	"ethiopianyirgacheffe-lb":1.65,
	"ethiopianyirgacheffe-lbs":34,
	"k7-lb":1.02,
	"k7-lbs":14,
	"pacas-lb":4.78,
	"pacas-lbs":16,
	"uganda-lb":3.27,
	"uganda-lbs":21,
	"rowNumber":20
},
{
	"date":"9/1/2013",
	"mokka-lb":4.15,
	"mokka-lbs":54,
	"arusha-lb":13,
	"arusha-lbs":34,
	"ethiopianyirgacheffe-lb":3.41,
	"ethiopianyirgacheffe-lbs":37,
	"k7-lb":1.35,
	"k7-lbs":18,
	"pacas-lb":3.18,
	"pacas-lbs":6,
	"uganda-lb":4.11,
	"uganda-lbs":17,
	"rowNumber":21
},
{
	"date":"10/1/2013",
	"mokka-lb":2.65,
	"mokka-lbs":54,
	"arusha-lb":14.04,
	"arusha-lbs":33,
	"ethiopianyirgacheffe-lb":3.46,
	"ethiopianyirgacheffe-lbs":47,
	"k7-lb":2.56,
	"k7-lbs":26,
	"pacas-lb":4.34,
	"pacas-lbs":4,
	"uganda-lb":4,
	"uganda-lbs":18,
	"rowNumber":22
},
{
	"date":"11/1/2013",
	"mokka-lb":2.74,
	"mokka-lbs":56,
	"arusha-lb":13.15,
	"arusha-lbs":39,
	"ethiopianyirgacheffe-lb":4.68,
	"ethiopianyirgacheffe-lbs":47,
	"k7-lb":2.77,
	"k7-lbs":29,
	"pacas-lb":4.83,
	"pacas-lbs":3,
	"uganda-lb":4.31,
	"uganda-lbs":22,
	"rowNumber":23
},
{
	"date":"12/1/2013",
	"mokka-lb":2.71,
	"mokka-lbs":50,
	"arusha-lb":14.01,
	"arusha-lbs":37,
	"ethiopianyirgacheffe-lb":4.89,
	"ethiopianyirgacheffe-lbs":49,
	"k7-lb":1.28,
	"k7-lbs":26,
	"pacas-lb":5.91,
	"pacas-lbs":12,
	"uganda-lb":4.97,
	"uganda-lbs":15,
	"rowNumber":24
}]