Diffusion

_.md

[ Launch: Diffusion ] 03586df86c2ca42d3af770b999315230 by piotch

config.json

{"description":"Diffusion","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"test.csv":{"default":true,"vim":false,"emacs":false,"fontSize":12},"style.css":{"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}},"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,"ajax-caching":true,"inline-console":true,"thumbnail":"http://i.imgur.com/yrI2RBp.png"}

inlet.js

var start_year = 2007,	end_year = 2016;

var margin = {top: 40, right: 200, bottom: 0, left: 20},
	width = 300,
	height = 3000;

var csv = tributary.test

// Format CSV data into a JS objects.
data = []
csv.forEach(function(d) {
	var cols = Object.keys(d), 
        row = {"articles": [], "name": d.name, "total": d.total};
	cols.forEach(function(c) {
      if (c !== "name" && c !== "total"){
        var count = !parseInt(d[c],10) ? 0:parseInt(d[c],10);
        row.articles.push([parseInt(c,10), count]);	
      }
    });
	data.push(row);
});

// Layout of the graph
var svg = d3.select("svg")
	.attr("width", width + margin.left + margin.right)
	.attr("height", height + margin.top + margin.bottom)
	.style("margin-left", margin.left + "px")
	.append("g")
	.attr("transform", "translate(" + margin.left + "," + margin.top + ")");

// Configuration of axes and scales
var c = d3.scale.category20c();

var x = d3.scale.linear().range([0, width]);
x.domain([start_year, end_year]);

var formatYears = d3.format("0000");
var xAxis = d3.svg.axis().scale(x).orient("top");
xAxis.tickFormat(formatYears);

svg.append("g")
	.attr("class", "x axis")
	.attr("transform", "translate(0," + 0 + ")")
	.call(xAxis);

var xScale = d3.scale.linear().domain([start_year, end_year]).range([0, width]);
var rScale = d3.scale.linear().domain([0, 4]).range([0, 9]);

// Start drawing each line
for (var j = 0; j < data.length; j++) {
	var g = svg.append("g").attr("class","journal");

	var circles = g.selectAll("circle")
		.data(data[j]['articles'])
		.enter()
		.append("circle");

	var text = g.selectAll("text")
		.data(data[j]['articles'])
		.enter()
		.append("text");

	//var rScale = d3.scale.linear()
	//	.domain([0, d3.max(data[j]['articles'], function(d) { return d[1]; })])
	//	.range([0, 9]);

	circles
		.attr("cx", function(d, i) { return xScale(d[0]); })
		.attr("cy", j*20+20)
        .attr("r", function(d) { return rScale(d[1]); })
		.style("fill", function(d) { return c(j); });

	text
		.attr("y", j*20+25)
		.attr("x",function(d, i) { return xScale(d[0])-5; })
		.attr("class","value")
		.text(function(d){ return d[1]; })
		.style("fill", function(d) { return c(j); })
		.style("display","none");

	g.append("text")
		.attr("y", j*20+25)
		.attr("x",width+20)
		.attr("class","label")
		.text(data[j]['name'],30,"...")
		.style("fill", function(d) { return c(j); })
		.on("mouseover", mouseover)
		.on("mouseout", mouseout);
}

// Define what happens on mouse events
function mouseover(p) {
	var g = d3.select(this).node().parentNode;
	d3.select(g).selectAll("circle").style("display","none");
	d3.select(g).selectAll("text.value").style("display","block");
}

function mouseout(p) {
	var g = d3.select(this).node().parentNode;
	d3.select(g).selectAll("circle").style("display","block");
	d3.select(g).selectAll("text.value").style("display","none");
}

style.css

svg{font-family: Arial, sans-serif;font-size:10px;}
.axis path,.axis line {fill: none;stroke:#b6b6b6;shape-rendering: crispEdges;}
.tick text{fill:#999;}
g.journal.active{cursor:pointer;}
text.label{font-size:12px;font-weight:bold;cursor:pointer;}
text.value{font-size:12px;font-weight:bold;}

test.csv

name,2007,2008,2009,2010,2011,2012,2013,2014,2015,2016,total
ACS Chemical Neuroscience,,,,,,1,,,,1,,2
Angewandte Chemie - International Edition,,,,,,,,,2,,,2
Applied Mechanics and Materials,,,,,,,,1,,,,1
Behavioural Brain Research,,,,,,,2,,,,,2
Biological Psychiatry,,,,,,2,,,,,,2
Biologie Aujourd'hui,,,,,,,1,,,,,1
Brain Research,,,,1,,,2,,1,,,4
Brain Structure and Function,,,,,,,,,1,1,,2
British Journal of Neurosurgery,,,,1,,,,,,,,1
Cardiovascular Research,,,,,,,,,2,,,2
Epilepsia,,,,,,,,,,2,,2
Epilepsy Research,,,,,,,,,1,,,1
Frontiers in Cellular Neuroscience,,,,,,1,,1,1,,,3
Frontiers in Molecular Neuroscience,,,,,,,1,,,,,1
Frontiers in Neural Circuits,,,,,,1,3,,,2,,6
Frontiers in Neuroanatomy,,,,,,,,,1,,,1
Frontiers in Neuroscience,,,,,,,2,,,,,2
Frontiers in Systems Neuroscience,,,,,1,,,2,,,,3
Future Neurology,,,,,,1,1,,,,,2
IEEE Photonics Journal,,,,,,,1,,,,,1
IEEE Reviews in Biomedical Engineering,,,,,,,,1,,,,1
IEEE Transactions on Biomedical Circuits and Systems,,,,1,,,,,,,,1
IET Conference Publications,,,,,,,,,1,,,1
Journal of Neurophysiology,,,,,2,1,1,,,1,,5
Journal of Neuroscience,,,,,1,,1,4,2,3,,11
Journal of Neuroscience Methods,,,1,,1,1,,1,,,,4
Methods in Molecular Biology,,,,,,,,,1,4,,5
Proceedings of SPIE - The International Society for Optical Engineering,,,,,,,,,2,,,2
Proceedings of the National Academy of Sciences of the United States of America,,,,,,,1,2,1,,,4
Progress in Biomedical Optics and Imaging - Proceedings of SPIE,,,,,,1,3,,1,1,,6