junkwhinger · July 25, 2015 08:36
diff --git a/date_frequency.csv b/date_frequency.csv
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <meta charset="utf-8">
 <head><h1>The Hacking Team: # of emails regarding 'SKA' - 2,197 emails</h1></head>

 <style>
 body {
 font: 10px sans-serif;
 }

 .axis {
  font: 11px sans-serif;
 }

 .axis path,
 .axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
 }

 div.tooltip {   
  position: absolute;           
  text-align: left;           
  width: 400px;                  
  height: 28px;                 
  padding: 2px;             
  font: 12px sans-serif;   
  border: 0px;      
  border-radius: 8px;           
  pointer-events: none;         
 }

 </style>

 <body>
 	
 <script src="http://d3js.org/d3.v3.min.js"></script>

 <script>

 var margin = {top: 20, right: 20, bottom: 70, left: 40},
    width = 960 - margin.left - margin.right,
    height = 500 - margin.top - margin.bottom;

 // Parse the date / time
 var	parseDate = d3.time.format("%Y-%m").parse;
 var formatTime = d3.time.format("%Y-%m");

 var x = d3.time.scale().range([0, width])
 var y = d3.scale.linear().range([height, 0]);

 var xAxis = d3.svg.axis()
    .scale(x)
    .orient("bottom")
    .tickFormat(d3.time.format("%Y-%m"))
    .ticks(20);

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

 var svg = d3.select("body").append("svg")
    .attr("width", width + margin.left + margin.right)
    .attr("height", height + margin.top + margin.bottom)
  .append("g")
    .attr("transform", 
          "translate(" + margin.left + "," + margin.top + ")");

 var div = d3.select("body").append("div")   
    .attr("class", "tooltip")               
    .style("opacity", 0);



 d3.csv("date_frequency.csv", function(error, data) {

    data.forEach(function(d) {
        d.date = parseDate(d.date_x);
        d.value = +d.freq;
        d.from = d.from
        d.to = d.to
        d.subject = d.subject
        d.id = d.id
    });

    console.log(d3.extent(data, function(d){ return d.date}))
 	

  x.domain(d3.extent(data, function(d){ return d.date}))
  y.domain([0, d3.max(data, function(d) { return d.value; })]);

  svg.append("g")
      .attr("class", "x axis")
      .attr("transform", "translate(0," + height + ")")
      .call(xAxis)
    .selectAll("text")
      .style("text-anchor", "end")
      .attr("dx", "-.8em")
      .attr("dy", "-.55em")
      .attr("transform", "rotate(-90)" );

  svg.append("g")
      .attr("class", "y axis")
      .call(yAxis)
    .append("text")
      .attr("transform", "rotate(-90)")
      .attr("y", 6)
      .attr("dy", ".71em")
      .style("text-anchor", "end")
      .text("# of emails sent");

  svg.selectAll("bar")
      .data(data)
    .enter().append("rect")
      .style("fill", "steelblue")
      .attr("x", function(d) { return x(d.date); })
      .attr("width", 10)
      .attr("y", function(d) { return y(d.value); })
      .attr("height", function(d) { return height - y(d.value); })
      .on("mouseover", function(d,i) {
        d3.select(this).style("fill","red");

        div.transition()        
                .duration(200)      
                .style("opacity", .9);      
            div .html('<strong>Date: </strong>'+formatTime(d.date) + " / <strong># of emails sent: </strong>"  + d.freq + "<br/>" 
                        + "<strong>[longest email conversation - </strong>" + d.id + "]<br/>"
                        + "<strong>from: </strong>" + d.from + "<br/><strong>to: </strong>" + d.to + "<br/>" 
                        + "<strong>subject: </strong>" + d.subject)  
                .style("left", "70px")     
                .style("top", "65px");    
            }) 
      .on("mouseout", function(d,i) {
        d3.select(this).style("fill","steelblue");

      })

 });

 </script>

 </body>
date_x	freq	date_date	date_y	from	id	subject	to	date_time	convo_length
2010-08	9	2010-08	2010-08-25 08:29:58	m.bettini@hackingteam.it	440959	R: RE: Nanatech	['emanuele.marcozzi@area.it', 'paolo.mandelli@area.it', 'nazareno.saguato@area.it', 'm.luppi@hackingteam.it']	2010-08-25 08:29:58	2
2010-09	26	2010-09	2010-09-08 08:15:11	m.luppi@hackingteam.it	440767	R: Nanatech	['nanatechp@paran.com']	2010-09-08 08:15:11	1
2010-10	3	2010-10	2010-10-26 06:59:46	m.luppi@hackingteam.it	440886	R: Nanatech	['nanatechp@paran.com', 'rsales@hackingteam.it']	2010-10-26 06:59:46	1
2010-11	21	2010-11	2010-11-05 03:17:50	nanatechp@paran.com	440940	Re: R: Nanatech	['m.luppi@hackingteam.it']	2010-11-05 03:17:50	2
2010-12	7	2010-12	2010-12-02 01:26:03	nanatechp@paran.com	441020	Re: R: Meeting in Seoul	['m.luppi@hackingteam.it', 'nanatech@paran.com', 'nanatechhan@paran.com']	2010-12-02 01:26:03	2
2011-01	2	2011-01	2011-01-19 10:48:39	m.luppi@hackingteam.it	441112	R: BULK Nanatech	['nanatechp@paran.com']	2011-01-19 10:48:39	1
2011-02	7	2011-02	2011-02-25 10:23:35	m.luppi@hackingteam.it	441159	R: Nanatech	['nanatechp@paran.com']	2011-02-25 10:23:35	1
2011-03	5	2011-03	2011-03-02 23:10:50	nanatech@paran.com	441372	Re: R: BULK Re: Fwd: R: Nanatech	['m.luppi@hackingteam.it', 'nanatechhan@paran.com', 'nanatechp@paran.com']	2011-03-02 23:10:50	5
2011-05	5	2011-05	2011-05-21 01:00:25	nanatech@paran.com	441390	Re: R: Nanatech	['m.luppi@hackingteam.it', 'nanatechco@paran.com']	2011-05-21 01:00:25	2
2011-06	6	2011-06	2011-06-30 00:54:43	nanatechco@paran.com	440946	Re: R: R: Hello, it' from Nanatech	['m.luppi@hackingteam.it']	2011-06-30 00:54:43	3
2011-07	7	2011-07	2011-07-15 02:02:27	nanatechco@paran.com	440860	Re: R: R: R: R: Hello, it' from Nanatech	['m.luppi@hackingteam.it']	2011-07-15 02:02:27	5
2011-08	14	2011-08	2011-08-13 05:57:46	m.bettini@hackingteam.it	440897	R: Re: R: R: it's from Nanatech	['m.luppi@hackingteam.it']	2011-08-13 05:57:46	4
2011-09	7	2011-09	2011-09-20 04:42:39	nanatechco@paran.com	440970	Re: R: Reply about visit	['m.luppi@hackingteam.it']	2011-09-20 04:42:39	2
2011-10	29	2011-10	2011-10-24 09:15:33	m.luppi@hackingteam.it	441077	R: R: R: Hello, it's from Nanatech.	['m.valleri@hackingteam.it', 'naga@hackingteam.it', 'rsales@hackingteam.it']	2011-10-24 09:15:33	3
2011-11	20	2011-11	2011-11-07 17:45:03	m.luppi@hackingteam.it	440636	R: BULK Re: R: BULK Hello, It's NANATECH	['nanatechco@paran.com', 'rsales@hackingteam.it']	2011-11-07 17:45:03	3
2011-12	125	2011-12	2011-12-21 09:13:50	m.luppi@hackingteam.it	441035	R: R: R: R: R: BULK Re: Re: BULK Re: Re: contract	['nanatech@paran.com']	2011-12-21 09:13:50	9
2012-01	102	2012-01	2012-01-18 10:22:52	f.busatto@hackingteam.it	588949	R: Re: R: Re: R: Re: R: Re: R: Certificato Symbian per SKA	['alberto@hackingteam.it', 'g.russo@hackingteam.it', 'delivery@hackingteam.it', 'm.luppi@hackingteam.it']	2012-01-18 10:22:52	9
2012-02	37	2012-02	2012-02-15 13:24:37	g.russo@hackingteam.it	440870	Re: Fwd: Re: R: 2nd payment	['nanatech@paran.com', 'm.luppi@hackingteam.it', 'm.bettini@hackingteam.it']	2012-02-15 13:24:37	4
2012-03	23	2012-03	2012-03-20 10:35:17	nanatech@paran.com	441407	Re: R: R: R: quote maintenance	['m.luppi@hackingteam.it']	2012-03-20 10:35:17	4
2012-04	32	2012-04	2012-04-17 10:14:22	nanatech@paran.com	960672	Re: Re: Very Urgent	['f.busatto@hackingteam.it']	2012-04-17 10:14:22	2
2012-05	99	2012-05	2012-05-24 07:59:02	nanatech@paran.com	440954	Re: R: Re: Information	['m.luppi@hackingteam.it']	2012-05-24 07:59:02	3
2012-06	23	2012-06	2012-06-29 06:06:46	a.scarafile@hackingteam.it	761917	Re: R: Seoul 9-11 July	['nanatech@paran.com']	2012-06-29 06:06:46	2
2012-07	76	2012-07	2012-07-24 13:08:27	m.luppi@hackingteam.it	441311	R: Re: R: New	['nanatech@paran.com', 'm.bettini@hackingteam.it']	2012-07-24 13:08:27	3
2012-08	53	2012-08	2012-08-27 09:38:54	bruno@hackingteam.it	440944	Re: I: Re: Re: Contract (Urgent)	['m.luppi@hackingteam.it', 'delivery@hackingteam.it']	2012-08-27 09:38:54	3
2012-09	31	2012-09	2012-09-14 13:45:02	nanatechheo@daum.net	829116	RE: Re: R: Re: Additional Order	['a.scarafile@hackingteam.com']	2012-09-14 13:45:02	4
2012-11	1	2012-11	2012-11-27 09:44:03	bruno@hackingteam.it	440953	Richiesta di SKA - Dispositivi Android che supportano la registrazione della chiamata	['zeno@hackingteam.it', 'a.pelliccione@hackingteam.it', 'rcs-support@hackingteam.com']	2012-11-27 09:44:03	0
2012-12	14	2012-12	2012-12-11 08:28:39	g.russo@hackingteam.it	440734	Re: I: R: R: New Order (URGENT)	['m.luppi@hackingteam.it', 'm.bettini@hackingteam.it']	2012-12-11 08:28:39	3
2013-01	58	2013-01	2013-01-16 02:52:12	s.woon@hackingteam.com	727025	Re: Fw: RE: RE: Maintenance Contract(URGENT)	['daniel']	2013-01-16 02:52:12	4
2013-02	74	2013-02	2013-02-13 07:53:03	nanatechheo@daum.net	441401	RE: RE: RE: RE: Re: Re: Connector	['d.maglietta@hackingteam.com', 'm.luppi@hackingteam.it']	2013-02-13 07:53:03	6
2013-03	37	2013-03	2013-03-20 06:11:46	d.maglietta@hackingteam.com	606424	RE: RE: RE: RE: Training	['nanatechheo@daum.net', 'rsales@hackingteam.com']	2013-03-20 06:11:46	4
2013-04	21	2013-04	2013-04-12 11:09:13	g.russo@hackingteam.it	449488	Commissions to our agent/broker was Re: Ordine x commissioni Nanatech	['d.maglietta@hackingteam.com', 'a.capaldo@hackingteam.it', 'm.bettini@hackingteam.com', 'amministrazione@hackingteam.it', 'rsales@hackingteam.it']	2013-04-12 11:09:13	1
2013-05	8	2013-05	2013-05-16 01:24:18	nanatechheo@daum.net	440791	RE: RE: Re: Training (Urgent)	['d.maglietta@hackingteam.com', 'm.luppi@hackingteam.it']	2013-05-16 01:24:18	3
2013-07	1	2013-07	2013-07-19 03:20:59	s.woon@hackingteam.com	729366	Re: Help	['nanatech', 'daniel']	2013-07-19 03:20:59	1
2013-08	14	2013-08	2013-08-07 03:00:56	daniel@hackingteam.com	346024	Re: 2nd Payment	['fulvio@hackingteam.it', 'd.maglietta@hackingteam.com', 'russo@hackingteam.it', 'm.catino@hackingteam.com', 'f.degiovanni@hackingteam.com', 'marco.bettini@hackingteam.it', 'rsales@hackingteam.com']	2013-08-07 03:00:56	1
2013-09	67	2013-09	2013-09-17 09:45:08	d.maglietta@hackingteam.com	18783	Re: RE: RE: RE: Further items	['nanatechheo@daum.net', 'rsales@hackingteam.com']	2013-09-17 09:45:08	4
2013-10	32	2013-10	2013-10-10 04:25:07	d.maglietta@hackingteam.com	18895	Re: RE: Further items	['nanatechheo@daum.net', 'rsales@hackingteam.com']	2013-10-10 04:25:07	2
2013-11	17	2013-11	2013-11-01 10:25:33	g.russo@hackingteam.com	392626	Re: R: Fwd: FW: RE: Re: Invoice	['s.gallucci@hackingteam.com']	2013-11-01 10:25:33	5
2013-12	41	2013-12	2013-12-17 01:41:12	nanatechheo@daum.net	441339	RE: RE: RE: RE: RE: RE: RE: RE: RE: Re: Offer	['d.maglietta@hackingteam.com', 'm.luppi@hackingteam.it']	2013-12-17 01:41:12	10
2014-01	53	2014-01	2014-01-29 13:59:17	nanatechheo@daum.net	440825	RE: Re: RE: RE: RE: RE: RE: RE: Maintenance	['d.maglietta@hackingteam.com', 'm.luppi@hackingteam.it']	2014-01-29 13:59:17	8
2014-02	57	2014-02	2014-02-08 05:37:05	d.maglietta@hackingteam.com	18934	RE: RE: Re: RE: RE: RE: RE: RE: RE: Maintenance	['nanatechheo@daum.net', 'rsales@hackingteam.com']	2014-02-08 05:37:05	9
2014-03	108	2014-03	2014-03-14 07:38:38	d.maglietta@hackingteam.it	691508	FW: RE: RE: RE: Top Urgent	['serge@hackingteam.com']	2014-03-14 07:38:38	3
2014-04	13	2014-04	2014-04-21 04:00:12	nanatechheo@daum.net	692654	RE: Re: RE: RE: Tactical\xa0Network\xa0Injector	['d.maglietta@hackingteam.it', 's.woon@hackingteam.it']	2014-04-21 04:00:12	4
2014-05	6	2014-05	2014-05-02 08:24:26	f.cornelli@hackingteam.it	710963	Re: Samsung Knox and local root	['s.woon@hackingteam.it', 'bug@hackingteam.com']	2014-05-02 08:24:26	1
2014-06	15	2014-06	2014-06-25 10:52:13	m.valleri@hackingteam.it	470961	R: Re: sample su VT	['a.mazzeo@hackingteam.it', 'd.milan@hackingteam.it', 'a.ornaghi@hackingteam.it', 'naga@hackingteam.it', 'cod@hackingteam.it']	2014-06-25 10:52:13	2
2014-07	21	2014-07	2014-07-29 07:28:23	b.muschitiello@hackingteam.com	959731	Fwd: Re: Fwd: TNI	['marco', 'daniel']	2014-07-29 07:28:23	3
2014-08	13	2014-08	2014-08-25 00:14:04	d.maglietta@hackingteam.com	203540	Fw: Invoice	['amministrazione@hackingteam.it', 'rsales@hackingteam.com']	2014-08-25 00:14:04	1
2014-09	16	2014-09	2014-09-26 14:07:48	f.busatto@hackingteam.com	1001854	Re: SKA opportunity	['daniel', 'serge', 'marco']	2014-09-26 14:07:48	1
2014-10	4	2014-10	2014-10-30 13:56:56	g.russo@hackingteam.com	46211	Fwd: Re: Next meeting alternative dates	['anita', 'david']	2014-10-30 13:56:56	2
2014-11	52	2014-11	2014-11-28 08:27:20	d.maglietta@hackingteam.com	145064	RE: RE:\xa0\xa0RE:\xa0RE:\xa0Re:\xa0Re:\xa0Answer	['nanatechheo@daum.net', 'rsales@hackingteam.com']	2014-11-28 08:27:20	6
2014-12	146	2014-12	2014-12-02 19:19:12	a.dipasquale@hackingteam.com	987044	R: Re: R: Re: R: LVM	['f.busatto@hackingteam.com']	2014-12-02 19:19:12	5
2015-01	81	2015-01	2015-01-26 06:19:50	d.maglietta@hackingteam.com	18854	RE: RE: RE: RE: RE: RE: Maintenance	['nanatechheo@daum.net', 'rsales@hackingteam.com']	2015-01-26 06:19:50	6
2015-02	44	2015-02	2015-02-26 07:54:02	d.maglietta@hackingteam.com	18931	RE: RE: RE: RE: Question	['nanatechheo@daum.net', 'simonetta@hackingteam.com', 'rsales@hackingteam.com']	2015-02-26 07:54:02	4
2015-03	59	2015-03	2015-03-02 10:44:11	s.gallucci@hackingteam.com	26529	R: RE: FW: RE: RE: RE: RE: RE: RE: Question	['d.maglietta@hackingteam.com', 'g.russo@hackingteam.com']	2015-03-02 10:44:11	8
2015-04	19	2015-04	2015-04-06 18:16:05	m.bettini@hackingteam.com	22576	R: Re: R: Fwd: !SIX-648-45157: Support portal available time	['f.busatto@hackingteam.com', 'g.russo@hackingteam.com', 'm.bettini@hackingteam.it']	2015-04-06 18:16:05	4
2015-05	10	2015-05	2015-05-07 14:07:57	l.guerra@hackingteam.com	642183	Re: SKA: Servers change for Proxy System	['c.vardaro@hackingteam.com', 'b.muschitiello@hackingteam.com', 'f.busatto@hackingteam.com']	2015-05-07 14:07:57	1
2015-06	145	2015-06	2015-06-09 11:05:28	nanatechheo@daum.net	1052404	RE: RE: Re: RE: Maintenance	['d.maglietta@hackingteam.com']	2015-06-09 11:05:28	4
2015-07	94	2015-07	2015-07-01 04:43:42	nanatechheo@daum.net	1135900	RE: RE: RE: Re: RE: Maintenance	['d.maglietta@hackingteam.com']	2015-07-01 04:43:42	5
	<!DOCTYPE html>
	<meta charset="utf-8">
	<head><h1>The Hacking Team: # of emails regarding 'SKA' - 2,197 emails</h1></head>

	<style>
	body {
	font: 10px sans-serif;
	}

	.axis {
	font: 11px sans-serif;
	}

	.axis path,
	.axis line {
	fill: none;
	stroke: #000;
	shape-rendering: crispEdges;
	}

	div.tooltip {
	position: absolute;
	text-align: left;
	width: 400px;
	height: 28px;
	padding: 2px;
	font: 12px sans-serif;
	border: 0px;
	border-radius: 8px;
	pointer-events: none;
	}

	</style>

	<body>

	<script src="http://d3js.org/d3.v3.min.js"></script>

	<script>

	var margin = {top: 20, right: 20, bottom: 70, left: 40},
	width = 960 - margin.left - margin.right,
	height = 500 - margin.top - margin.bottom;

	// Parse the date / time
	var parseDate = d3.time.format("%Y-%m").parse;
	var formatTime = d3.time.format("%Y-%m");

	var x = d3.time.scale().range([0, width])
	var y = d3.scale.linear().range([height, 0]);

	var xAxis = d3.svg.axis()
	.scale(x)
	.orient("bottom")
	.tickFormat(d3.time.format("%Y-%m"))
	.ticks(20);

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

	var svg = d3.select("body").append("svg")
	.attr("width", width + margin.left + margin.right)
	.attr("height", height + margin.top + margin.bottom)
	.append("g")
	.attr("transform",
	"translate(" + margin.left + "," + margin.top + ")");

	var div = d3.select("body").append("div")
	.attr("class", "tooltip")
	.style("opacity", 0);



	d3.csv("date_frequency.csv", function(error, data) {

	data.forEach(function(d) {
	d.date = parseDate(d.date_x);
	d.value = +d.freq;
	d.from = d.from
	d.to = d.to
	d.subject = d.subject
	d.id = d.id
	});

	console.log(d3.extent(data, function(d){ return d.date}))


	x.domain(d3.extent(data, function(d){ return d.date}))
	y.domain([0, d3.max(data, function(d) { return d.value; })]);

	svg.append("g")
	.attr("class", "x axis")
	.attr("transform", "translate(0," + height + ")")
	.call(xAxis)
	.selectAll("text")
	.style("text-anchor", "end")
	.attr("dx", "-.8em")
	.attr("dy", "-.55em")
	.attr("transform", "rotate(-90)" );

	svg.append("g")
	.attr("class", "y axis")
	.call(yAxis)
	.append("text")
	.attr("transform", "rotate(-90)")
	.attr("y", 6)
	.attr("dy", ".71em")
	.style("text-anchor", "end")
	.text("# of emails sent");

	svg.selectAll("bar")
	.data(data)
	.enter().append("rect")
	.style("fill", "steelblue")
	.attr("x", function(d) { return x(d.date); })
	.attr("width", 10)
	.attr("y", function(d) { return y(d.value); })
	.attr("height", function(d) { return height - y(d.value); })
	.on("mouseover", function(d,i) {
	d3.select(this).style("fill","red");

	div.transition()
	.duration(200)
	.style("opacity", .9);
	div .html('<strong>Date: </strong>'+formatTime(d.date) + " / <strong># of emails sent: </strong>" + d.freq + "<br/>"
	+ "<strong>[longest email conversation - </strong>" + d.id + "]<br/>"
	+ "<strong>from: </strong>" + d.from + "<br/><strong>to: </strong>" + d.to + "<br/>"
	+ "<strong>subject: </strong>" + d.subject)
	.style("left", "70px")
	.style("top", "65px");
	})
	.on("mouseout", function(d,i) {
	d3.select(this).style("fill","steelblue");

	})

	});

	</script>

	</body>