Building a Horizontal calendar

[Harish Gowda]

Hi Group,

   I am trying to build a horizontal calendar to indicate people on vacations. I have placed the mockup below with annotation of key feature, I'm trying to incorporate.

1. Legend Y - Indicates the person
2. Legend X - Indicates the Month and year
3. The calendar part (not including legend area) should be draggable.
4. Also each calendar item should be marked w/ right background to indicated weekends, vacations and holidays.

Being a newbie to d3. I have got rough implementation going...don't know if I am going in the right direction.

I am able to get the first horizontal calendar, I don't know, how to stack each other on top of them. How do I go about it?

Code:

http://jsbin.com/xumabavo/1/edit

Please guide me.

Thanks,
_harish