| @@ -0,0 +1,39 @@ | ||
| '#ffff53','#9aff84','#c3a16e','#00ffd5','#9fd8ef','#a4eeda','#d25d00','#ffb762','#ff6b02','#00db97','#ffff84','#6eccdc','#007b75',#ff5a3b','#ffffad','#6da16e','#a8b1c0','#c55a3b','#ffb486','#00a48d','#deff84','#34ed5c','#b7d2ee',#ffd1c5','#ffbdac','#bcebae','#00c9bb','#b9ff53','#ff804f','#99ebae','#ffa16e','#b7d2ee',#ffd1c5','#ffbdac','#bcebae','#00c9bb','#b9ff53','#ff804f','#99ebae','#ffa16e','#ff8400','#69e275','#daf741' | ||
|
|
||
|
|
||
|
|
||
|
|
||
| 007b75 | ||
| 00a48d | ||
| 00c9bb | ||
| 00ffd5 | ||
| 89d1c5 | ||
| 6eccdc | ||
| a8b1c0 | ||
| 9fd8ef | ||
| b7d2ee | ||
| a4eeda | ||
| 99ebae | ||
| bcebae | ||
| 9aff84 | ||
| 00db97 | ||
| 69e275 | ||
| 6da16e | ||
| 34ed5c | ||
| b9ff53 | ||
| daf741 | ||
| ffff53 | ||
| deff84 | ||
| ffff84 | ||
| ffb762 | ||
| ffffad | ||
| c7a169 | ||
| ffb8a8 | ||
| ffcec3 | ||
| ffaf7f | ||
| ff804f | ||
| d25d00 | ||
| c55a3b | ||
| ff5a3b | ||
| fa5300 | ||
| fa7600 |
| @@ -0,0 +1,7 @@ | ||
| (function($){ | ||
| $(function(){ | ||
|
|
||
| $('.button-collapse').sideNav(); | ||
|
|
||
| }); // end of document ready | ||
| })(jQuery); // end of jQuery name space |
| @@ -0,0 +1,139 @@ | ||
| var margin = {top: 20, right: 100, bottom: 30, left: 40}, | ||
| width = 870 - margin.left - margin.right, | ||
| height = 500 - margin.top - margin.bottom; | ||
|
|
||
| var x = d3.scale.ordinal() | ||
| .rangeRoundBands([0, width], .05); | ||
|
|
||
| var y = d3.scale.linear() | ||
| .rangeRound([height, 0]); | ||
|
|
||
| var color = d3.scale.ordinal().range(['#ffff53','#ffffad','#ffff84','#deff84','#9aff84','#bcebae','#99ebae','#00db97','#69e275','#34ed5c','#6da16e','#c3a16e','#ffa16e','#00c9bb','#00ffd5','#89d1c5','#6eccdc','#a8b1c0','#9fd8ef','#b7d2ee','#a4eeda','#b9ff53','#daf741','#d25d00','#ff5a3b','#c55a3b','#ffd1c5','#ffb762','#ff8400','#ff804f','#ffb486','#ffbdac','#ff6b02','#007b75','#00a48d']); | ||
|
|
||
| var xAxis = d3.svg.axis() | ||
| .scale(x) | ||
| .orient("bottom") | ||
| .tickSize(0, 0, 0) | ||
| .tickPadding(6); | ||
|
|
||
| var yAxis = d3.svg.axis() | ||
| .scale(y) | ||
| .orient("left") | ||
| .tickFormat(d3.format(".0%")) | ||
| .tickSize(0, 0, 0) | ||
| .tickPadding(-1); | ||
|
|
||
| var svg = d3.select("body #percentage_stack_cont").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 + ")"); | ||
|
|
||
| d3.csv("static/files/stack_bar.txt", function(error, data) { | ||
| var categories = d3.keys(data[0]).filter(function(key) { return key !== "Sample"; }); | ||
| var categories_shift = categories; | ||
| console.log(categories); | ||
| color.domain(categories); | ||
| // color.range(colorbrewer.Spectral[categories.length]); | ||
|
|
||
| data.forEach(function(d) { | ||
| var y0 = 0; | ||
| d.genes = color.domain().map(function(name) { return {name: name, y0: y0, y1: y0 += +d[name]}; }); | ||
| d.genes.forEach(function(d) { d.y0 /= y0; d.y1 /= y0; }); | ||
| }); | ||
| data.sort(function(a, b) { return b.genes[0].y1 - a.genes[0].y1; }); | ||
|
|
||
| x.domain(data.map(function(d) { return d.Sample; })); | ||
|
|
||
| svg.append("g") | ||
| .attr("class", "x axis") | ||
| .attr("transform", "translate(0," + height + ")") | ||
| .call(xAxis); | ||
|
|
||
| svg.append("g") | ||
| .attr("class", "y axis") | ||
| .call(yAxis); | ||
|
|
||
| var rotate = function(arr){ | ||
| var temp = arr.shift(); | ||
| arr.push(temp); | ||
| } | ||
|
|
||
| var sample = svg.selectAll(".sample") | ||
| .data(data) | ||
| .enter().append("g") | ||
| .attr("class", "sample") | ||
| .attr("transform", function(d) { return "translate(" + x(d.Sample) + ",0)"; }); | ||
|
|
||
| sample.selectAll("rect") | ||
| .data(function(d) { return d.genes; }) | ||
| .enter().append("rect") | ||
| .attr("width", x.rangeBand()) | ||
| .attr("y", function(d) { return y(d.y1); }) | ||
| .attr("height", function(d) { return y(d.y0) - y(d.y1); }) | ||
| .style("fill", function(d) { return color(d.name);}) | ||
| .on("click", function(d) { | ||
| var gene_index = categories_shift.indexOf(d.name); | ||
| moveStuff(gene_index); | ||
| }); | ||
|
|
||
| var moveStuff = function(gene_index){ | ||
| categories_shift = categories; | ||
| for (var i=0; i<gene_index; i++){ | ||
| rotate(categories_shift); | ||
| } | ||
| data.forEach(function(d) { | ||
| var y0 = 0; | ||
| d.genes = categories_shift.map(function(name) { return {name: name, y0: y0, y1: y0 += +d[name]}; }); | ||
| d.genes.forEach(function(d) { d.y0 /= y0; d.y1 /= y0; }); | ||
| }) | ||
| data.sort(function(a, b) { return b.genes[0].y1 - a.genes[0].y1; }); | ||
| x.domain(data.map(function(d) { return d.Sample; })); | ||
| svg.select(".x.axis") | ||
| .transition() | ||
| .duration(1000) | ||
| .call(xAxis); | ||
| sample = svg.selectAll(".sample") | ||
| .data(data) | ||
| .attr("transform", function(d) { return "translate(" + x(d.Sample) + ",0)"; }); | ||
|
|
||
| sample.selectAll("rect") | ||
| .data(function(d) { return d.genes; }) | ||
| .transition() | ||
| .delay(function(d, i) { return i * 50}) | ||
| .attr("y", function(d) {return y(d.y1);}) | ||
| .attr("height", function(d) { return y(d.y0) - y(d.y1); }) | ||
| .style("fill", function(d) { return color(d.name);}); | ||
|
|
||
| last_sample = data[data.length - 1]; | ||
| }; | ||
|
|
||
|
|
||
|
|
||
| console.log(data); | ||
| console.log(data[data.length - 1].genes); | ||
| var last_sample = data[data.length - 1]; | ||
| console.log( x(last_sample.Sample)); | ||
| svg.selectAll("text") | ||
| .data(last_sample.genes) | ||
| .enter() | ||
| .append("text") | ||
| .text(function(d) { | ||
| return d.name; | ||
| }) | ||
| .attr("x", function(d) { | ||
| return x(last_sample.Sample) + x.rangeBand() + 15; | ||
| }) | ||
| .attr("y", function(d) { | ||
| return (y(d.y0) + y(d.y1)) / 2; | ||
| }) | ||
| .attr("font-size", "11px") | ||
| .attr("fill", "black"); | ||
|
|
||
|
|
||
| }); | ||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
| @@ -0,0 +1,27 @@ | ||
|
|
||
| with open("maptime.csv", "r") as ins: | ||
| target = open('percent_data.csv', 'w') | ||
|
|
||
| for line in ins: | ||
| array = [] | ||
| events = line.split(',') | ||
| # for each investor co, for each coCountry, add them up | ||
|
|
||
| inverstorCo = events[4] | ||
| companyCo = events[1] | ||
| amount = events[8] | ||
|
|
||
| array.append(inverstorCo+"-"+companyCo+":"+amount) | ||
|
|
||
|
|
||
| for line in array: | ||
|
|
||
|
|
||
| target.write(line) | ||
|
|
||
|
|
||
|
|
||
| # obj[4] investor country | ||
| # obj[1] compary country | ||
| # obj[8] amount | ||
| # array.append(line) |
| @@ -0,0 +1,41 @@ | ||
| Sample,ARE,ARG,ARM,AUS,AUT,AZE,BEL,BGD,BGR,BMU,BRA,CAN,CHE,CHL,CHN,COL,CRI,CZE,DEU,DNK,DZA,EGY,ESP,EST,FIN,FRA,GBR,GHA,GRC,GTM,HKG,HRV,HUN,IDN,IND,IRL,ISL,ISR,ITA,JPN,KEN,KOR,LBN,LTU,LVA,MAR,MEX,MKD,MYS,NGA,NLD,NOR,NZL,PAK,PER,PHL,POL,PRT,ROM,RUS,SAU,SGP,SLV,SVK,SWE,THA,TUR,TWN,UKR,USA | ||
| ARG,0,29117500,0,0,0,0,0,0,0,0,23550000,0,75000,11060000,0,25000,0,0,0,0,0,0,25000,0,0,0,195000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,710000 | ||
| AUS,0,0,0,107565269,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,3137342,6500000,0,0,0,0,0,0,0,0,19740000,0,0,0,0,0,0,0,416222833 | ||
| AUT,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,514640,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,128660,0,0,0,0,800000,0,0,0,0,1801240,0,0,0 | ||
| AZE,0,0,0,0,0,100000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| BEL,0,0,0,26000000,0,0,68790507,0,0,0,0,0,47200000,0,0,0,0,0,62500000,0,0,0,32442500,0,0,31510350,26365374,0,3900000,0,0,0,0,0,161200000,0,0,0,0,0,0,0,0,0,0,3200000,0,0,350000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,66800000 | ||
| BGR,0,0,64177,0,0,0,65665,0,3996856,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,618180,0,132173,0,0,64525,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,38484,0,0,0,0,0,0,0,0,0,0,76968,0,0,0,0,0,0,0,0,0,0,250963 | ||
| BRA,0,1440000,0,0,0,0,0,0,0,0,40050000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1100000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2750000 | ||
| CAN,0,0,0,0,0,0,0,0,0,0,70000000,2356903665,0,0,0,0,0,0,190798947,0,0,0,0,0,0,15439200,19032336,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,250000,0,3000000,0,0,0,0,101650000,0,0,1077562189 | ||
| CHE,0,0,0,0,25732000,0,0,0,0,0,0,0,130142635,0,0,0,0,0,155988700,10000000,0,0,0,2150000,260000000,89780200,180219911,0,0,0,0,0,0,0,0,94265400,0,35000000,1286600,0,0,0,0,0,0,0,0,0,0,0,39884600,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1000000,0,0,1383300266 | ||
| CHL,0,6960000,0,40000,40000,0,40000,0,0,0,770000,1120000,0,5050000,40000,0,40000,0,80000,40000,200000,0,500000,80000,0,120000,320000,0,40000,0,40000,0,80000,0,280000,80000,0,0,120000,0,0,0,0,0,0,0,80000,0,0,0,80000,40000,80000,0,80000,0,0,40000,0,80000,0,40000,40000,0,0,0,0,0,0,9303000 | ||
| CHN,0,0,0,0,0,0,0,0,0,0,30000000,0,0,0,3010572300,0,0,0,62500000,0,0,0,0,0,0,0,3030502,0,0,0,105000000,0,0,0,364000000,0,0,11000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,21000000,0,0,0,0,0,0,0,981550000 | ||
| COL,0,47500,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| CYM,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,88485564 | ||
| CZE,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,427320,0,0,0,0,0,0,0,0,0,0,0,0,0,0,10000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,5000000,0,0,0,0,0,0,0,0,0,2440000 | ||
| DEU,0,0,0,0,35132000,0,0,0,0,0,39500000,29300000,4483240,0,10000000,0,0,0,667908315,7719600,0,0,1350930,0,6602480,85990420,44222011,0,0,0,0,0,0,0,17000000,48382700,0,0,1286600,0,0,0,0,0,0,0,50000000,0,314000000,0,9000000,0,6500000,0,0,0,104000,0,0,238400000,0,0,0,0,8909112,0,0,0,0,968525806 | ||
| DNK,0,0,0,0,0,0,0,0,0,0,0,0,40936960,0,0,0,0,0,62500000,86589920,0,0,1310000,0,0,0,34849443,0,0,0,0,0,0,0,0,47132700,0,0,0,0,0,0,0,0,0,0,0,0,0,0,9000000,0,0,0,0,0,0,0,0,0,0,0,0,0,1000000,0,0,0,0,404250000 | ||
| ESP,0,558544,0,0,0,0,0,0,0,0,732454,103016,0,308035,0,278903,0,104624,1850326,0,53016,0,128335476,0,0,189385,11001848,0,0,0,0,0,50000,0,0,424352,0,0,25025,0,0,0,0,0,0,0,3521190,0,0,0,5918360,0,0,0,90000,0,0,0,1200000,0,0,3000000,0,247309,0,0,0,0,0,66009782 | ||
| EST,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,20395,0,0,0,0,2925973,13259,0,22410000,0,0,0,0,0,0,0,19889,0,0,0,13596,0,0,0,0,20395,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| FIN,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,147581282,0,9000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,13000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2900000,0,0,3000000,0,0,0,0,33244000 | ||
| FRA,0,150000,0,150000,25732000,0,34079650,0,0,0,150000,3600000,166162841,0,21125000,0,0,0,118980700,0,0,0,2098400,200000,13946020,875485194,173575043,0,0,0,40552159,0,0,0,500000,3859800,0,9400000,1413176,12000000,0,0,0,0,0,0,0,0,0,0,8000000,0,0,150000,0,0,0,0,0,4500000,0,0,0,0,0,0,26230000,0,0,526814712 | ||
| GBR,0,13300000,0,19615,300000,0,13738559,0,0,0,11450000,78494969,106998000,0,31000000,0,0,0,372625428,20467771,0,102000000,524801,0,146322615,128263215,1984470866,1219615,0,0,0,0,0,0,161000000,20234015,0,58150000,7781306,12000000,0,0,0,0,323406,0,0,0,250000000,0,211956567,24000000,0,0,0,0,19299,1152245,0,107200000,0,0,0,0,20200000,0,30000000,0,0,1768865556 | ||
| GRC,0,0,0,0,0,0,0,0,0,0,390360,0,0,0,0,0,0,0,0,0,0,0,559880,0,0,0,0,0,2083315,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,78000 | ||
| HKG,0,0,0,0,0,0,0,0,0,0,0,11600000,0,0,38000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,349015000,0,0,0,5000000,0,0,84200000,0,6100000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1100000,0,0,0,0,0,0,0,166350000 | ||
| IND,0,0,0,0,0,0,15439200,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,356850532,0,0,15000000,0,900000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,3859800,0,0,0,0,0,0,0,167244730 | ||
| IRL,0,0,0,0,0,0,0,0,0,0,0,0,47200000,0,0,0,0,0,0,0,0,0,0,0,0,6359310,2972580,0,0,0,0,0,0,0,0,95539953,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,251300000 | ||
| ISL,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,6500000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| ISR,0,0,0,0,0,0,0,0,0,0,0,30000000,13400000,0,2000000,0,0,0,3600000,0,0,0,0,0,0,0,9650000,0,0,0,0,0,0,0,0,0,0,685742500,0,1200000,0,0,0,0,0,0,0,13500000,0,0,0,0,0,0,0,0,0,0,0,5000000,0,7200000,0,0,0,0,0,0,0,555655400 | ||
| ITA,0,0,0,0,0,0,0,0,0,0,2830520,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,32165,0,0,0,0,0,0,0,0,0,0,0,24614757,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,4764721 | ||
| JOR,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,4153219 | ||
| JPN,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,9000000,75000000,128660000,0,20000000,0,205177365,0,5028862,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,132815000,0,0,0,6200000,1801240,0,0,3365722852 | ||
| KEN,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,235000,3000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| KHM,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,3369900 | ||
| KOR,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1000000,0,0,0,0,0,0,0,0,0,0,8800000,0,0,0,33448105,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,15000000,0,327621200 | ||
| KWT,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,19000000,0,0,0,0,0 | ||
| LBN,1095000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,300000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,375000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,500000,0,0,0,0,0,0,0,0,0 | ||
| LTU,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1721414,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| LUX,0,0,0,0,0,0,15439200,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1801240,0,0,6111350,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,61800000 | ||
| MEX,0,0,0,0,0,0,0,0,0,0,0,0,40000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,60000000,0,0,0,0,0,0,0,0,52250000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,43000000 | ||
| MUS,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,171850000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,15500000 | ||
| MYS,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,152278,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0, |
| @@ -0,0 +1,78 @@ | ||
| .inline_img { | ||
|
|
||
| width: 100%; | ||
| border: solid 1px #CECECE; | ||
|
|
||
| } | ||
|
|
||
| figcaption { | ||
| font-family: 'Roboto Slab', serif; | ||
| } | ||
|
|
||
| h5 { | ||
| font-size: 1.7rem; | ||
| } | ||
| .title { | ||
| border-bottom: solid 1px #CECECE; | ||
| } | ||
|
|
||
| h6 { | ||
| font-size: 2rem; | ||
| line-height: 110%; | ||
| margin: 0.5rem 0 0.4rem 0; | ||
| } | ||
|
|
||
| h7 { | ||
| font-size: 1.6rem; | ||
| display: block; | ||
| padding-bottom: .5em; | ||
|
|
||
| } | ||
|
|
||
| h7.subtitle { | ||
| font-style: italic; | ||
| font-size: 1rem; | ||
|
|
||
| } | ||
|
|
||
| a { | ||
| color: #263238; | ||
| } | ||
|
|
||
|
|
||
|
|
||
| .outline { | ||
| text-align: center; | ||
| border: solid 1px #CECECE; | ||
| background-color: #cfd8dc; | ||
| } | ||
|
|
||
| #copyright { | ||
| text-align: right; | ||
| font-size: .8rem; | ||
| } | ||
|
|
||
|
|
||
| .logo { | ||
| height: 6em; | ||
| } | ||
|
|
||
| .feature { | ||
| color: #607d8b; | ||
| } | ||
|
|
||
| .feature_text { | ||
| font-size: .9rem; | ||
| text-align: left; | ||
| } | ||
|
|
||
| a.feature_text_link { | ||
| color: #607d8b; | ||
| text-decoration: underline; | ||
|
|
||
| } | ||
| img#logo { | ||
| height: 30px; | ||
| } | ||
|
|
||
|
|
| @@ -0,0 +1,23 @@ | ||
| body { | ||
| font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; | ||
| margin: auto; | ||
| position: relative; | ||
| width: 960px; | ||
| } | ||
|
|
||
| text { | ||
| font: 10px sans-serif; | ||
| } | ||
|
|
||
| .axis path, | ||
| .axis line { | ||
| fill: none; | ||
| stroke: #000; | ||
| shape-rendering: crispEdges; | ||
| } | ||
|
|
||
| form { | ||
| position: absolute; | ||
| right: 10px; | ||
| top: 10px; | ||
| } |
| @@ -0,0 +1,143 @@ | ||
| body { | ||
| background-color: #2f3939; | ||
| color: white; | ||
| } | ||
|
|
||
| #headerr { | ||
| color: #2f3939; | ||
| font-family:'Buenard', serif; | ||
| } | ||
|
|
||
| nav .brand-logo { | ||
| color: #2f3939; | ||
| } | ||
|
|
||
| nav ul a { | ||
| color: #2f3939; | ||
| } | ||
|
|
||
| .box { | ||
| border: solid #acebae 4px; | ||
| } | ||
|
|
||
| .flex-container { | ||
| display: -webkit-flex; | ||
| display: flex; | ||
| } | ||
|
|
||
| .flex-item { | ||
| height: 100%; | ||
| } | ||
|
|
||
| #map_contain { | ||
| margin-top: 20px; | ||
| z-index: 0; | ||
|
|
||
| } | ||
|
|
||
| #map_contain img{ | ||
| margin-top: 20px; | ||
| z-index: -10; | ||
|
|
||
| } | ||
|
|
||
| #stacked_bar_contain { | ||
| margin-top: -40px; | ||
| padding-top: 30px; | ||
| } | ||
|
|
||
|
|
||
|
|
||
| body { | ||
| font: 14px sans-serif; | ||
| } | ||
| .axis line { | ||
| fill: none; | ||
| stroke: #000; | ||
| shape-rendering: crispEdges; | ||
| } | ||
| .bar { | ||
| fill: steelblue; | ||
| } | ||
| .x.axis path { | ||
| display: none; | ||
| } | ||
| .y.axis path { | ||
| display: none; | ||
| } | ||
| .legend line { | ||
| stroke: #000; | ||
| shape-rendering: crispEdges; | ||
| } | ||
|
|
||
| .tabs { | ||
| background-color: rgba(0,0,0,0); | ||
| font-size: 1em; | ||
| width: 70%;; | ||
| } | ||
|
|
||
| .tabs a{ | ||
| font-size: 2em; | ||
| } | ||
|
|
||
| #page_title { | ||
| font-family:'Buenard', serif; | ||
| line-height: 90%; | ||
| font-size: 7em; | ||
| color: #acebae; | ||
| margin-left: 60px; | ||
| } | ||
|
|
||
| #map_title{ | ||
| margin-bottom: -150px; | ||
|
|
||
| position: relative; | ||
|
|
||
| } | ||
|
|
||
| .sectionTitle { | ||
|
|
||
| font-family: 'Fira Sans', sans-serif; | ||
| z-index: 900 important!; | ||
| font-size: 5em; | ||
| position: relative; | ||
| line-height: 90%; | ||
|
|
||
| } | ||
|
|
||
| #markets_nada_cont { | ||
| text-align: right; | ||
| margin-bottom: -130px; | ||
|
|
||
| } | ||
|
|
||
| #markets_nada { | ||
|
|
||
| } | ||
|
|
||
|
|
||
|
|
||
|
|
||
| #sections { | ||
| position: relative; | ||
| display: inline-block; | ||
| width: 250px; | ||
| top: 0px; | ||
| z-index: 90; | ||
| } | ||
|
|
||
| .step { | ||
| margin-bottom: 200px; | ||
| } | ||
|
|
||
| #vis { | ||
| display: inline-block; | ||
| position: fixed; | ||
| top: 60px; | ||
| z-index: 1; | ||
| margin-left: 0; | ||
|
|
||
| height: 600px; | ||
| width: 600px; | ||
| background-color: #ddd; | ||
| } |
| @@ -0,0 +1,41 @@ | ||
| Sample,ARE,ARG,ARM,AUS,AUT,AZE,BEL,BGD,BGR,BMU,BRA,CAN,CHE,CHL,CHN,COL,CRI,CZE,DEU,DNK,DZA,EGY,ESP,EST,FIN,FRA,GBR,GHA,GRC,GTM,HKG,HRV,HUN,IDN,IND,IRL,ISL,ISR,ITA,JPN,KEN,KOR,LBN,LTU,LVA,MAR,MEX,MKD,MYS,NGA,NLD,NOR,NZL,PAK,PER,PHL,POL,PRT,ROM,RUS,SAU,SGP,SLV,SVK,SWE,THA,TUR,TWN,UKR,USA | ||
| ARG,0,29117500,0,0,0,0,0,0,0,0,23550000,0,75000,11060000,0,25000,0,0,0,0,0,0,25000,0,0,0,195000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,710000 | ||
| AUS,0,0,0,107565269,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,3137342,6500000,0,0,0,0,0,0,0,0,19740000,0,0,0,0,0,0,0,416222833 | ||
| AUT,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,514640,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,128660,0,0,0,0,800000,0,0,0,0,1801240,0,0,0 | ||
| AZE,0,0,0,0,0,100000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| BEL,0,0,0,26000000,0,0,68790507,0,0,0,0,0,47200000,0,0,0,0,0,62500000,0,0,0,32442500,0,0,31510350,26365374,0,3900000,0,0,0,0,0,161200000,0,0,0,0,0,0,0,0,0,0,3200000,0,0,350000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,66800000 | ||
| BGR,0,0,64177,0,0,0,65665,0,3996856,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,618180,0,132173,0,0,64525,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,38484,0,0,0,0,0,0,0,0,0,0,76968,0,0,0,0,0,0,0,0,0,0,250963 | ||
| BRA,0,1440000,0,0,0,0,0,0,0,0,40050000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1100000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2750000 | ||
| CAN,0,0,0,0,0,0,0,0,0,0,70000000,2356903665,0,0,0,0,0,0,190798947,0,0,0,0,0,0,15439200,19032336,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,250000,0,3000000,0,0,0,0,101650000,0,0,1077562189 | ||
| CHE,0,0,0,0,25732000,0,0,0,0,0,0,0,130142635,0,0,0,0,0,155988700,10000000,0,0,0,2150000,260000000,89780200,180219911,0,0,0,0,0,0,0,0,94265400,0,35000000,1286600,0,0,0,0,0,0,0,0,0,0,0,39884600,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1000000,0,0,1383300266 | ||
| CHL,0,6960000,0,40000,40000,0,40000,0,0,0,770000,1120000,0,5050000,40000,0,40000,0,80000,40000,200000,0,500000,80000,0,120000,320000,0,40000,0,40000,0,80000,0,280000,80000,0,0,120000,0,0,0,0,0,0,0,80000,0,0,0,80000,40000,80000,0,80000,0,0,40000,0,80000,0,40000,40000,0,0,0,0,0,0,9303000 | ||
| CHN,0,0,0,0,0,0,0,0,0,0,30000000,0,0,0,3010572300,0,0,0,62500000,0,0,0,0,0,0,0,3030502,0,0,0,105000000,0,0,0,364000000,0,0,11000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,21000000,0,0,0,0,0,0,0,981550000 | ||
| COL,0,47500,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| CYM,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,88485564 | ||
| CZE,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,427320,0,0,0,0,0,0,0,0,0,0,0,0,0,0,10000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,5000000,0,0,0,0,0,0,0,0,0,2440000 | ||
| DEU,0,0,0,0,35132000,0,0,0,0,0,39500000,29300000,4483240,0,10000000,0,0,0,667908315,7719600,0,0,1350930,0,6602480,85990420,44222011,0,0,0,0,0,0,0,17000000,48382700,0,0,1286600,0,0,0,0,0,0,0,50000000,0,314000000,0,9000000,0,6500000,0,0,0,104000,0,0,238400000,0,0,0,0,8909112,0,0,0,0,968525806 | ||
| DNK,0,0,0,0,0,0,0,0,0,0,0,0,40936960,0,0,0,0,0,62500000,86589920,0,0,1310000,0,0,0,34849443,0,0,0,0,0,0,0,0,47132700,0,0,0,0,0,0,0,0,0,0,0,0,0,0,9000000,0,0,0,0,0,0,0,0,0,0,0,0,0,1000000,0,0,0,0,404250000 | ||
| ESP,0,558544,0,0,0,0,0,0,0,0,732454,103016,0,308035,0,278903,0,104624,1850326,0,53016,0,128335476,0,0,189385,11001848,0,0,0,0,0,50000,0,0,424352,0,0,25025,0,0,0,0,0,0,0,3521190,0,0,0,5918360,0,0,0,90000,0,0,0,1200000,0,0,3000000,0,247309,0,0,0,0,0,66009782 | ||
| EST,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,20395,0,0,0,0,2925973,13259,0,22410000,0,0,0,0,0,0,0,19889,0,0,0,13596,0,0,0,0,20395,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| FIN,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,147581282,0,9000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,13000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2900000,0,0,3000000,0,0,0,0,33244000 | ||
| FRA,0,150000,0,150000,25732000,0,34079650,0,0,0,150000,3600000,166162841,0,21125000,0,0,0,118980700,0,0,0,2098400,200000,13946020,875485194,173575043,0,0,0,40552159,0,0,0,500000,3859800,0,9400000,1413176,12000000,0,0,0,0,0,0,0,0,0,0,8000000,0,0,150000,0,0,0,0,0,4500000,0,0,0,0,0,0,26230000,0,0,526814712 | ||
| GBR,0,13300000,0,19615,300000,0,13738559,0,0,0,11450000,78494969,106998000,0,31000000,0,0,0,372625428,20467771,0,102000000,524801,0,146322615,128263215,1984470866,1219615,0,0,0,0,0,0,161000000,20234015,0,58150000,7781306,12000000,0,0,0,0,323406,0,0,0,250000000,0,211956567,24000000,0,0,0,0,19299,1152245,0,107200000,0,0,0,0,20200000,0,30000000,0,0,1768865556 | ||
| GRC,0,0,0,0,0,0,0,0,0,0,390360,0,0,0,0,0,0,0,0,0,0,0,559880,0,0,0,0,0,2083315,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,78000 | ||
| HKG,0,0,0,0,0,0,0,0,0,0,0,11600000,0,0,38000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,349015000,0,0,0,5000000,0,0,84200000,0,6100000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1100000,0,0,0,0,0,0,0,166350000 | ||
| IND,0,0,0,0,0,0,15439200,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,356850532,0,0,15000000,0,900000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,3859800,0,0,0,0,0,0,0,167244730 | ||
| IRL,0,0,0,0,0,0,0,0,0,0,0,0,47200000,0,0,0,0,0,0,0,0,0,0,0,0,6359310,2972580,0,0,0,0,0,0,0,0,95539953,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,251300000 | ||
| ISL,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,6500000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| ISR,0,0,0,0,0,0,0,0,0,0,0,30000000,13400000,0,2000000,0,0,0,3600000,0,0,0,0,0,0,0,9650000,0,0,0,0,0,0,0,0,0,0,685742500,0,1200000,0,0,0,0,0,0,0,13500000,0,0,0,0,0,0,0,0,0,0,0,5000000,0,7200000,0,0,0,0,0,0,0,555655400 | ||
| ITA,0,0,0,0,0,0,0,0,0,0,2830520,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,32165,0,0,0,0,0,0,0,0,0,0,0,24614757,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,4764721 | ||
| JOR,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,4153219 | ||
| JPN,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,9000000,75000000,128660000,0,20000000,0,205177365,0,5028862,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,132815000,0,0,0,6200000,1801240,0,0,3365722852 | ||
| KEN,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,235000,3000000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| KHM,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,3369900 | ||
| KOR,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1000000,0,0,0,0,0,0,0,0,0,0,8800000,0,0,0,33448105,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,15000000,0,327621200 | ||
| KWT,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,19000000,0,0,0,0,0 | ||
| LBN,1095000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,300000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,375000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,500000,0,0,0,0,0,0,0,0,0 | ||
| LTU,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1721414,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 | ||
| LUX,0,0,0,0,0,0,15439200,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1801240,0,0,6111350,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,61800000 | ||
| MEX,0,0,0,0,0,0,0,0,0,0,0,0,40000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,60000000,0,0,0,0,0,0,0,0,52250000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,43000000 | ||
| MUS,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,171850000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,15500000 | ||
| MYS,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,152278,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0, |
| @@ -0,0 +1,16 @@ | ||
| Sample,CDH3,COMP,MMP13,CXCL14,PDGFD,DIO2,IGLC3,IGHG2,RP11-731F5.2,IGHGP | ||
| Norm1,68.0090578441956,7.88510815584877,1.97127703896219,12.8133007532542,43.3680948571682,34.4973481818384,46.3250104156115,29.5691555844329,5.91383111688658,2.95691555844329 | ||
| Norm2,90.2840571212405,5.37405101912146,4.29924081529717,5.37405101912146,41.9175979491474,27.9450652994316,219.261281580155,304.171287682274,62.3389918218089,17.1969632611887 | ||
| Norm3,271.537010398429,10.202257616126,12.5566247583089,71.4158033128817,52.5808661754184,46.302553796264,367.281274180535,418.292562261164,109.870466635203,15.6957809478861 | ||
| Norm4,71.9420186396439,18.3525557754194,0.734102231016774,15.4161468513523,46.2484405540568,8.80922677220129,332.548310650599,182.791455523177,49.1848494781239,16.150249082369 | ||
| Norm5,40.1239338346327,11.6488840165063,9.06024312394931,12.9432044627847,25.8864089255695,51.7728178511389,86.7194699006577,240.743603007796,72.4819449915945,19.4148066941771 | ||
| Norm6,295.891252851361,42.4018617793227,5.53067762338992,16.5920328701698,53.4632170261026,23.9662697013563,201.869733253732,279.299219981191,70.9770295001707,8.29601643508489 | ||
| Norm8,53.8112301464391,8.12244983342478,9.13775606260287,7.10714360424668,35.5357180212334,53.8112301464391,73.102048500823,67.0102111257544,15.2295934376715,17.2602058960276 | ||
| IPF1,195.316832801279,26.2365894807688,10.2031181314101,85.9977099647422,386.260900689096,96.2008280961523,4487.91438951595,3703.73188170186,1071.32740379806,26.2365894807688 | ||
| IPF2,479.906746016322,166.738201288522,110.08996623537,489.526257629121,464.943061285301,327.063394835177,2433.73643803823,7611.17135497156,2292.65026771717,277.897002147536 | ||
| IPF3,972.738447391894,202.803403238531,104.991142384549,769.935044153363,195.624521707964,152.551232524559,8729.51994117006,3057.30617183043,998.761892940201,184.856199412113 | ||
| IPF4,678.533260654831,253.306891106992,83.2163432878567,383.160965248483,163.689290643147,249.64902986357,1102.84516489181,4346.45362249651,1100.10176895925,161.860360021435 | ||
| IPF5,724.447915182007,168.042042181393,121.986075065011,567.608675812706,185.468624333538,322.391769814673,1349.31536092319,2816.88252930736,522.797464564335,728.182182786038 | ||
| IPF6,333.327397552599,158.256331182243,102.866615268458,362.011357579381,159.245433252132,357.065847229936,4932.65202253654,4983.09622810088,1271.98526187728,856.56239252389 | ||
| IPF7,176.771212288023,44.4291282221234,5.67180360282426,69.9522444348325,245.778156122385,203.239629101203,1097.49399714649,4633.86354350742,1509.64505895172,7.56240480376568 | ||
| IPF8,518.698907755569,292.246287260512,29.8366628354973,67.3237520390709,145.358100993448,194.320829749136,2549.88710847981,1142.97369939059,283.065775618821,112.461267610721 |
| @@ -0,0 +1,240 @@ | ||
|
|
||
| <!DOCTYPE html> | ||
|
|
||
| <html> | ||
| <head> | ||
|
|
||
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/> | ||
|
|
||
| <title>InfoViz Spring 2016</title> | ||
|
|
||
| <!-- CSS --> | ||
| <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> | ||
| <link href="static/css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/> | ||
| <link href='https://fonts.googleapis.com/css?family=Buenard:400,700' rel='stylesheet' type='text/css'> | ||
|
|
||
|
|
||
|
|
||
| <!-- Custom styles for this template --> | ||
| <link href="static/css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/> | ||
| <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> | ||
|
|
||
|
|
||
|
|
||
| </head> | ||
|
|
||
| <body> | ||
| <!-- <nav id="headerr" role="navigation" class="light-green lighten-5"> | ||
| <div class="nav-wrapper container"><a id="logo-container" href="index.html" class="brand-logo">InfoViz Spring 2016</a> | ||
| <ul class="right hide-on-med-and-down"> | ||
| <li><a href="#">ABOUT</a></li> | ||
| </ul> | ||
| </div>` | ||
| </nav> --> | ||
| <div id="page_title" class="col s5">INVESTORS </br> & STARTUPS </div> | ||
|
|
||
| <div class="row flex-container"> | ||
|
|
||
| <div class="row col s12 flex-container"> | ||
| <!-- <div class="col s1 box"> | ||
| timeline | ||
| </div> --> | ||
|
|
||
|
|
||
|
|
||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <title>Scrolling Sections</title> | ||
| <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/> | ||
| <link rel="stylesheet" type="text/css" href="css/style.css"/> | ||
| </head> | ||
| <body> | ||
| <div class="container"> | ||
| <div id='graphic'> | ||
| <div id='sections'> | ||
| <section class="step"> | ||
| <div class="title">OpenVis Conf 2013</div> | ||
| I did what no presenter should ever do: I watched my own talk.<br/><br/>My first visit to OpenVis Conf in 2013. | ||
| </section> | ||
| <section class="step"> | ||
| <div class="title">Filler Words</div> | ||
| As expected, I could only focus on the flaws: the rushed speech, the odd phrases, and, most especially, all the filler words. In fact, I found 180 filler words in my 30 minute talk. | ||
| </section> | ||
| <section class="step"> | ||
| <div class="title">My Talk</div> | ||
| Here are all 5,040 words of my talk. | ||
| </section> | ||
| <section class="step"> | ||
| <div class="title">My Stumbles</div> | ||
| And here are all the fillers I used in those 30 minutes. | ||
| </section> | ||
| <section class="step"> | ||
| <div class="title">Um's, Ah's & Uh's</div> | ||
| I almost exclusively used these three fillers. Um's and Ah's made up over 80%, with Uh's trailing behind. | ||
| </section> | ||
| <section class="step"> | ||
| <div class="title">Fillers Over Time</div> | ||
| I hoped that all these blunders were toward the beginning of my talk. And the data suggests that fewer fillers are used as I get into it. Perhaps the talk started out rough and improved as I found my groove. | ||
| </section> | ||
| <section class="step"> | ||
| <div class="title">Ramping Back Up</div> | ||
| Unfortunately, the trend does not continue. Midway into the talk my Um's and Ah's spike. I continue to use them pretty consistently throughout the rest of the talk. | ||
| </section> | ||
| <section class="step"> | ||
| <div class="title">The Cough Effect</div> | ||
| My theory is that at this critical halfway point in my talk, I heard a dry cough indicative of the audience's waning interest. This caused self-confidence to collapse and forced me out of my groove.<br/><br/>A competing theory is that I just hadn't practiced the last half of my speech as much. | ||
| </section> | ||
| <section class="step"> | ||
| <div class="title">Best of Luck to Me in 2015</div> | ||
| The world may never know, or care, but hopefully these insights improve my speaking in 2015. Though preliminary results aren't looking so good. | ||
| </section> | ||
| </div> | ||
| <div id='vis'> | ||
| </div> | ||
| <div id="extra-space"> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
|
|
||
| <script src="js/d3.js"></script> | ||
| <script src="js/queue.js"></script> | ||
| <script src="js/scroller.js"></script> | ||
| <script src="js/sections.js"></script> | ||
| <script type="text/javascript"> | ||
|
|
||
| /** | ||
| * scroller - handles the details | ||
| * of figuring out which section | ||
| * the user is currently scrolled | ||
| * to. | ||
| * | ||
| */ | ||
| function scroller() { | ||
| var windowHeight; | ||
| var container = d3.select('body'); | ||
| // event dispatcher | ||
| var dispatch = d3.dispatch("active", "progress"); | ||
|
|
||
| // d3 selection of all the | ||
| // text sections that will | ||
| // be scrolled through | ||
| var sections = null; | ||
|
|
||
| // array that will hold the | ||
| // y coordinate of each section | ||
| // that is scrolled through | ||
| var sectionPositions = []; | ||
| var currentIndex = -1; | ||
| // y coordinate of | ||
| var containerStart = 0; | ||
|
|
||
| /** | ||
| * scroll - constructor function. | ||
| * Sets up scroller to monitor | ||
| * scrolling of els selection. | ||
| * | ||
| * @param els - d3 selection of | ||
| * elements that will be scrolled | ||
| * through by user. | ||
| */ | ||
| function scroll(els) { | ||
| sections = els; | ||
|
|
||
| // when window is scrolled call | ||
| // position. When it is resized | ||
| // call resize. | ||
| d3.select(window) | ||
| .on("scroll.scroller", position) | ||
| .on("resize.scroller", resize); | ||
|
|
||
| // manually call resize | ||
| // initially to setup | ||
| // scroller. | ||
| resize(); | ||
|
|
||
| // hack to get position | ||
| // to be called once for | ||
| // the scroll position on | ||
| // load. | ||
| d3.timer(function() { | ||
| position(); | ||
| return true; | ||
| }); | ||
| } | ||
|
|
||
| /** | ||
| * resize - called initially and | ||
| * also when page is resized. | ||
| * Resets the sectionPositions | ||
| * | ||
| */ | ||
| function resize() { | ||
| // sectionPositions will be each sections | ||
| // starting position relative to the top | ||
| // of the first section. | ||
| sectionPositions = []; | ||
| var startPos; | ||
| sections.each(function(d,i) { | ||
| var top = this.getBoundingClientRect().top; | ||
| if(i === 0) { | ||
| startPos = top; | ||
| } | ||
| sectionPositions.push(top - startPos); | ||
| }); | ||
| containerStart = container.node().getBoundingClientRect().top + window.pageYOffset; | ||
| } | ||
|
|
||
| /** | ||
| * position - get current users position. | ||
| * if user has scrolled to new section, | ||
| * dispatch active event with new section | ||
| * index. | ||
| * | ||
| */ | ||
| function position() { | ||
| var pos = window.pageYOffset - 10 - containerStart; | ||
| var sectionIndex = d3.bisect(sectionPositions, pos); | ||
| sectionIndex = Math.min(sections.size() - 1, sectionIndex); | ||
|
|
||
| if (currentIndex !== sectionIndex) { | ||
| dispatch.active(sectionIndex); | ||
| currentIndex = sectionIndex; | ||
| } | ||
|
|
||
| var prevIndex = Math.max(sectionIndex - 1, 0); | ||
| var prevTop = sectionPositions[prevIndex]; | ||
| var progress = (pos - prevTop) / (sectionPositions[sectionIndex] - prevTop); | ||
| dispatch.progress(currentIndex, progress); | ||
| } | ||
|
|
||
| /** | ||
| * container - get/set the parent element | ||
| * of the sections. Useful for if the | ||
| * scrolling doesn't start at the very top | ||
| * of the page. | ||
| * | ||
| * @param value - the new container value | ||
| */ | ||
| scroll.container = function(value) { | ||
| if (arguments.length === 0) { | ||
| return container; | ||
| } | ||
| container = value; | ||
| return scroll; | ||
| }; | ||
|
|
||
| // allows us to bind to scroller events | ||
| // which will interally be handled by | ||
| // the dispatcher. | ||
| d3.rebind(scroll, dispatch, "on"); | ||
|
|
||
| return scroll; | ||
| } | ||
|
|
||
| </script> | ||
|
|
||
| </body> | ||
| </html> |
| @@ -0,0 +1,91 @@ | ||
| body { | ||
| font-family: "Exo 2", sans-serif; | ||
| background: #2f3939; | ||
| /*color: #333;*/ | ||
| } | ||
|
|
||
| h1 { | ||
| margin: 0; | ||
| padding: 1rem 0.4rem 2rem 0.4rem; | ||
| font-size: 2rem; | ||
| font-weight: bold; | ||
| text-align: left; | ||
| color: white; | ||
| } | ||
|
|
||
| /*.widget { | ||
| display: inline-block; | ||
| border: 1px solid #AAA; | ||
| background: white; | ||
| }*/ | ||
|
|
||
| #chart { | ||
| height: 550px; | ||
| width: 300px; | ||
| } | ||
|
|
||
| #chart2 { | ||
| height: 550px; | ||
| width: 200px; | ||
| } | ||
|
|
||
| svg { | ||
| shape-rendering: round; | ||
| } | ||
|
|
||
| .bar { | ||
| fill: slateblue; | ||
| } | ||
|
|
||
| .value { | ||
| font-size: 12px; | ||
| font-weight: 300; | ||
| fill: white; | ||
| } | ||
|
|
||
| .label { | ||
| font-size: 12px; | ||
| fill: white; | ||
| } | ||
|
|
||
| .axis { | ||
| font-size: 12px; | ||
| fill: lightgrey; | ||
| font-family: "Exo 2", sans-serif; | ||
| } | ||
| .axis path { | ||
| fill: none; | ||
|
|
||
|
|
||
| } | ||
| .axis .tick line { | ||
| stroke-width: 1; | ||
| stroke: rgba(0, 0, 0, 0.1); | ||
| stroke: white; | ||
| } | ||
|
|
||
| path { | ||
| /*stroke: green;*/ | ||
| stroke-width: 1.5; | ||
| fill: none; | ||
| } | ||
|
|
||
| circle { | ||
| /*stroke: steelblue;*/ | ||
| stroke-width: 3; | ||
| /*fill: #00db97;*/ | ||
| opacity: 0.75; | ||
| } | ||
|
|
||
| .axis path, | ||
| .axis line { | ||
| fill: none; | ||
| stroke: black; | ||
| stroke-width: 1; | ||
| shape-rendering: crispEdges; | ||
| } | ||
|
|
||
| .herlper_toolip { | ||
| font-size: 20px; | ||
| color: black; | ||
| } |
| @@ -0,0 +1,84 @@ | ||
| company_market,unicorns_amount_usd,all_amount_usd | ||
| E-Commerce,12705899834.0,35623375438.0 | ||
| Advertising,10816500000.0,29665465568.0 | ||
| Software,8568299999.0,68437590553.0 | ||
| Storage,5441415000.0,6958441663.0 | ||
| Clean Technology,4805000000.0,60279019392.0 | ||
| Communities,4007700000.0,4345701630.0 | ||
| File Sharing,3480685000.0,4097300320.0 | ||
| Technology,3252826000.0,17032316124.0 | ||
| Online Shopping,2912000000.0,3443214765.0 | ||
| Curated Web,2796400000.0,14119347340.0 | ||
| Enterprise Software,2591576443.0,31701792121.0 | ||
| Design,2585625000.0,3512398264.0 | ||
| Games,1686400000.0,17995945494.0 | ||
| Cloud Computing,1628900000.0,3722247706.0 | ||
| Shopping,1556000000.0,2598085139.0 | ||
| Entertainment,1432759080.0,3193534174.0 | ||
| Transportation,1313450000.0,2251766015.0 | ||
| Security,1239120000.0,13210547345.0 | ||
| Data Security,1143176000.0,1303170299.0 | ||
| Peer-to-Peer,1108020000.0,2066869562.0 | ||
| Mobile Payments,1075000000.0,1936890673.0 | ||
| Search,939207611.0,5713780300.0 | ||
| Fashion,854500000.0,5669660041.0 | ||
| Facebook Applications,817500000.0,1003191149.0 | ||
| Finance Technology,770960000.0,1000842698.0 | ||
| Consumer Electronics,721000000.0,1588101907.0 | ||
| Analytics,680086000.0,12737290240.0 | ||
| Privacy,663000000.0,779947172.0 | ||
| Mobile Games,648000000.0,1075817438.0 | ||
| News,642000000.0,2616974256.0 | ||
| Hardware + Software,640000000.0,22000727473.0 | ||
| Retail,634000000.0,1082498975.0 | ||
| Mobile,613700000.0,34514755317.0 | ||
| Location Based Services,609050000.0,927213004.0 | ||
| Biotechnology,590000044.0,1.2073194066e+11 | ||
| Hospitality,573929900.0,2060008935.0 | ||
| Finance,557800000.0,14630801163.0 | ||
| Solar,544600000.0,5557111407.0 | ||
| Personal Finance,504600000.0,629345510.0 | ||
| Web Development,459000000.0,1329746740.0 | ||
| Career Management,432000000.0,683130000.0 | ||
| Home & Garden,412000000.0,521626286.0 | ||
| Data Integration,409500000.0,633593770.0 | ||
| Education,371500000.0,5623335821.0 | ||
| Freelancers,321200000.0,336928000.0 | ||
| Messaging,320694728.0,4155424601.0 | ||
| Public Transportation,290870000.0,3130198843.0 | ||
| Internet of Things,280600000.0,709875118.0 | ||
| Web CMS,272400000.0,300020003.0 | ||
| Social Media,263599700.0,5538614896.0 | ||
| Travel,245000000.0,5782384124.0 | ||
| Events,240800000.0,315327348.0 | ||
| Insurance,240000000.0,438639450.0 | ||
| SaaS,218500000.0,4955352903.0 | ||
| Heathcare,200000000.0,2248814790.0 | ||
| Financial Services,184137070.0,514217374.0 | ||
| Virtualization,178972075.0,1091810000.0 | ||
| Music,173319000.0,2894072300.0 | ||
| Sports,133500000.0,714712852.0 | ||
| Legal,132000000.0,713133410.0 | ||
| Health Care,125000000.0,47721643619.0 | ||
| Semantic Search,122000000.0,174878000.0 | ||
| Collaboration,102000000.0,1055982036.0 | ||
| Content Discovery,94000000.0,108000000.0 | ||
| Real Estate,91700000.0,1852700582.0 | ||
| Restaurants,90800000.0,626933263.0 | ||
| Credit Cards,84000000.0,151000000.0 | ||
| Point of Sale,76000000.0,164578696.0 | ||
| Lead Management,74000000.0,166550000.0 | ||
| Video Streaming,70000000.0,791246498.0 | ||
| Social CRM,70000000.0,137618000.0 | ||
| Fantasy Sports,61400000.0,61900000.0 | ||
| PaaS,41500000.0,608202090.0 | ||
| Customer Service,35000000.0,1330755719.0 | ||
| Photography,20000000.0,3077515293.0 | ||
| Health and Wellness,20000000.0,10895073076.0 | ||
| Groceries,15400000.0,15400000.0 | ||
| Small and Medium Businesses,12000000.0,92737400.0 | ||
| Human Resources,8400000.0,1258719198.0 | ||
| Networking,6250000.0,1660066175.0 | ||
| Mobile Commerce,3591333.0,137457979.0 | ||
| Beauty,2755795.0,152330199.0 | ||
| None,100000.0,6776708796.0 |
| @@ -0,0 +1,40 @@ | ||
| <!DOCTYPE html> | ||
| <html > | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <title>horizontal barchart with d3.js</title> | ||
| <link href='http://fonts.googleapis.com/css?family=Exo+2:400,200' rel='stylesheet' type='text/css'> | ||
| <link href='https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.css' rel='stylesheet' type='text/css'> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/js/materialize.min.js"></script> | ||
| <link rel="stylesheet" href="css/style.css"> | ||
|
|
||
| </head> | ||
|
|
||
| <body> | ||
|
|
||
| <div class="widget"> | ||
|
|
||
| <div class="row"> | ||
|
|
||
| <div class="col l4 m5 s5" id="chart"> | ||
| <h1> Unicorn Startups </h1> | ||
| </div> | ||
| <div class="col l4 m4 s4" id="chart2"> | ||
| <h1> All Startups </h1> | ||
| </div> | ||
| <div class="col l4 m4 s4"> | ||
| <!--<div id="_buttons"> </div>--> | ||
| <div id="chart3"> | ||
| <h1> View by Unicorn </h1> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <script src='http://cdnjs.cloudflare.com/ajax/libs/d3/3.4.1/d3.min.js'></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.js"></script> | ||
| <script src="js/index.js"></script> | ||
| <script type="text/javascript" src="js/tooltip.js"></script> | ||
|
|
||
| </body> | ||
| </html> |
| @@ -0,0 +1,67 @@ | ||
| d3.helper = {}; | ||
|
|
||
| d3.helper.tooltip = function(){ | ||
| var tooltipDiv; | ||
| var bodyNode = d3.select('body').node(); | ||
| var attrs = {}; | ||
| var text = ''; | ||
| var styles = {}; | ||
|
|
||
| function tooltip(selection){ | ||
|
|
||
| selection.on('mouseover.tooltip', function(pD, pI){ | ||
| var name, value; | ||
| // Clean up lost tooltips | ||
| d3.select('body').selectAll('div.tooltip').remove(); | ||
| // Append tooltip | ||
| tooltipDiv = d3.select('body').append('div'); | ||
| tooltipDiv.attr(attrs); | ||
| tooltipDiv.style(styles); | ||
| var absoluteMousePos = d3.mouse(bodyNode); | ||
| tooltipDiv.style({ | ||
| left: (absoluteMousePos[0] + 10)+'px', | ||
| top: (absoluteMousePos[1] - 15)+'px', | ||
| position: 'absolute', | ||
| 'z-index': 1001 | ||
| }); | ||
| // Add text using the accessor function, Crop text arbitrarily | ||
| tooltipDiv.style('width', function(d, i){ return (text(pD, pI).length > 80) ? '300px' : null; }) | ||
| .html(function(d, i){return text(pD, pI);}); | ||
| }) | ||
| .on('mousemove.tooltip', function(pD, pI){ | ||
| // Move tooltip | ||
| var absoluteMousePos = d3.mouse(bodyNode); | ||
| tooltipDiv.style({ | ||
| left: (absoluteMousePos[0] + 10)+'px', | ||
| top: (absoluteMousePos[1] - 15)+'px' | ||
| }); | ||
| // Keep updating the text, it could change according to position | ||
| tooltipDiv.html(function(d, i){ return text(pD, pI); }); | ||
| }) | ||
| .on('mouseout.tooltip', function(pD, pI){ | ||
| // Remove tooltip | ||
| tooltipDiv.remove(); | ||
| }); | ||
|
|
||
| } | ||
|
|
||
| tooltip.attr = function(_x){ | ||
| if (!arguments.length) return attrs; | ||
| attrs = _x; | ||
| return this; | ||
| }; | ||
|
|
||
| tooltip.style = function(_x){ | ||
| if (!arguments.length) return styles; | ||
| styles = _x; | ||
| return this; | ||
| }; | ||
|
|
||
| tooltip.text = function(_x){ | ||
| if (!arguments.length) return text; | ||
| text = d3.functor(_x); | ||
| return this; | ||
| }; | ||
|
|
||
| return tooltip; | ||
| }; |
| @@ -0,0 +1,386 @@ | ||
| var top15 = ["Biotechnology", "Software", "Clean Technology", "Health Care", "E-Commerce", "Mobile", "Semiconductors", "Enterprise Software", "Advertising", "Hardware + Software", "Web Hosting", "Games", "Finance", "Curated Web", "Security"]; | ||
|
|
||
| trimmedArray = []; | ||
| for (i = 0; i < top15.length; i++) { | ||
| trimmedArray.push(top15[i].replace(/ /g,'')); | ||
| } | ||
|
|
||
| console.log(trimmedArray); | ||
|
|
||
|
|
||
| for (i = 0; i < trimmedArray.length; i++) { | ||
| //$("#_buttons").append('<button onClick="updateData(\'' + trimmedArray[i] + '\')">'+trimmedArray[i]+"</button>") | ||
| $("#_dropdown").append('<a onClick="updateData(\'' + trimmedArray[i] + '\')" href="#">'+trimmedArray[i]+'</a>') | ||
| } | ||
|
|
||
| var margin = {top: 0, right: 20, bottom: 20, left: 100}, | ||
| width = 950 - margin.left - margin.right, | ||
| height = 250 - margin.top - margin.bottom; | ||
|
|
||
| var parseDate = d3.time.format("%Y-%m").parse; | ||
|
|
||
| var x = d3.time.scale() | ||
| .range([0, width]); | ||
|
|
||
| var y1 = d3.scale.linear() | ||
| .range([height,0]); | ||
|
|
||
| var y2 = d3.scale.linear() | ||
| .range([0,height]); | ||
|
|
||
| var y1small = d3.scale.linear() | ||
| .range([height,0]); | ||
|
|
||
| var y2small = d3.scale.linear() | ||
| .range([0,height]); | ||
|
|
||
|
|
||
| var xAxis = d3.svg.axis() | ||
| .scale(x) | ||
| .orient("bottom"); | ||
|
|
||
| var yAxis1 = d3.svg.axis() | ||
| .scale(y1) | ||
| .orient("left"); | ||
|
|
||
| var yAxis2 = d3.svg.axis() | ||
| .scale(y2) | ||
| .orient("left"); | ||
|
|
||
| var area1 = d3.svg.area() | ||
| .interpolate("basis") | ||
| .x(function(d) { return x(d.date); }) | ||
| .y0(height) | ||
| .y1(function(d) { return y1(d.startup); }); | ||
|
|
||
| var area1Small = d3.svg.area() | ||
| .interpolate("basis") | ||
| .x(function(d) { return x(d.date); }) | ||
| .y0(height) | ||
| .y1(function(d) { return y1small(d.startup); }); | ||
|
|
||
| var area2 = d3.svg.area() | ||
| .interpolate("basis") | ||
| .x(function(d) { return x(d.date); }) | ||
| .y0(0) | ||
| .y1(function(d) { return y2(d.funding); }); | ||
|
|
||
| var area2Small = d3.svg.area() | ||
| .interpolate("basis") | ||
| .x(function(d) { return x(d.date); }) | ||
| .y0(0) | ||
| .y1(function(d) { return y2small(d.funding); }); | ||
|
|
||
| var svg1 = d3.select("#areachart1").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 svg2 = d3.select("#areachart2").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 color = d3.scale.ordinal() | ||
| .range(["#DE4000","#00c9bb","#89d1c5","#00ffd5","#007b75","#fa5300","#6eccdc","#99ebae","#00a48d","#c55a3b","#a8b1c0","#9aff84","#b7d2ee","#a4eeda","#b9ff53"]) | ||
| .domain(top15); | ||
|
|
||
|
|
||
| var vertical = d3.select("#areaMain") | ||
| .append("div") | ||
| .attr("class", "remove") | ||
| .style("position", "absolute") | ||
| .style("z-index", "19") | ||
| .style("width", "3px") | ||
| .style("height", height*2) | ||
| .style("top", "50px") | ||
| .style("bottom", "30px") | ||
| .style("left", margin.left) | ||
| .style("right", margin.right) | ||
| .style("background", "#fff"); | ||
|
|
||
| //Create tooltip | ||
| /*var areaTooltip = d3.select("#areaMain").append("div") | ||
| .attr("class", "tooltip") | ||
| .style("opacity", 0);*/ | ||
|
|
||
| var areaTooltip = d3.select("body") | ||
| .append("div") | ||
| .attr("class", "tooltip") | ||
| .style("position", "absolute") | ||
| .style("z-index", "20") | ||
| .style("visibility", "hidden") | ||
| .style("top", "30px") | ||
| .style("left", "55px"); | ||
|
|
||
| d3.tsv("/convert_data/unicorns-time.tsv", function(error, data) { | ||
| if (error) throw error; | ||
|
|
||
| /*x.domain(d3.extent(data, function(d) { return d.date; })); | ||
| y1.domain([0, d3.max(data, function(d) { return d.startup; })]); | ||
| y2.domain([0, d3.max(data, function(d) { return d.funding; })]); | ||
| y1small.domain([0, d3.max(data, function(d) { return d.startup; })]); | ||
| y2small.domain([0, d3.max(data, function(d) { return d.funding; })]);*/ | ||
|
|
||
| data.forEach(function(d) { | ||
| //console.log(d.date+" "+d.startup) | ||
| var market = ''; | ||
| allData = data.filter(function(row) { | ||
|
|
||
| return row['market'] == 'All'; | ||
| }) | ||
| d.date = parseDate(d.date); | ||
| d.startup = +d.startup; | ||
| d.funding = +d.funding; | ||
|
|
||
| subData = data.filter(function(row) { | ||
| return row['market'] == 'E-Commerce'; | ||
| }) | ||
| d.startup = +d.startup; | ||
| d.funding = +d.funding; | ||
| /*else { | ||
| d.startup_ecommerce = +d.startup_ecommerce; | ||
| d.funding_ecommerce = +d.funding_ecommerce; | ||
| }*/ | ||
| /*d.startupMarket = {}; | ||
| for(i=0; i < trimmedArray.length; i++) { | ||
| d.startupMarket[trimmedArray[i]] = +d.startup_+trimmedArray[i] | ||
| console.log(d.startup_Biotechnology); | ||
| }*/ | ||
| /* d.startup_biotech = +d.startup_biotech; | ||
| d.funding_biotech = +d.funding_biotech;*/ | ||
|
|
||
| }); | ||
|
|
||
| var maxStartup = [d3.max(allData, function(d) { return d.startup; }), d3.max(subData, function(d) {return d.startup; })]; | ||
| var maxFunding = [d3.max(allData, function(d) { return d.funding; }), d3.max(subData, function(d) {return d.funding; })]; | ||
|
|
||
| x.domain(d3.extent(allData, function(d) { return d.date; })); | ||
| /* y1.domain([0, d3.max(maxStartup)]); | ||
| y2.domain([0, d3.max(maxFunding)]); | ||
| y1small.domain([0, d3.max(maxStartup)]); | ||
| y2small.domain([0, d3.max(maxFunding)]);*/ | ||
|
|
||
| y1.domain([0, 1900]); | ||
| y1small.domain([0, 1900]); | ||
| y2.domain([0, 45000000]); | ||
| y2small.domain([0, 45000000]); | ||
|
|
||
| svg1.append("path") | ||
| .datum(allData) | ||
| .attr("class", "area") | ||
| .attr("d", area1) | ||
| /*.call(d3.helper.tooltip() | ||
| // .attr({class: function(d, i) { return d + ' ' + i + ' A'; }}) | ||
| .style({color: 'black', background: 'rgba(183, 210, 238, 0.75)', padding: '0.5em', borderradius: '2px'}) | ||
| .text(function(d, i){ return 'value: '+d[i].funding; }) | ||
| )*/; | ||
|
|
||
|
|
||
| svg1.append("path") | ||
| .datum(subData) | ||
| .attr("class", "areaY1Small") | ||
| .attr("d", area1Small) | ||
| .style("fill", function(d) { return color("E-Commerce");}); | ||
|
|
||
| /* svg1.append("g") | ||
| .attr("class", "xAxis") | ||
| .attr("transform", "translate(0," + height + ")") | ||
| .call(xAxis) | ||
| .attr("stroke-width",0);*/ | ||
|
|
||
| svg1.append("g") | ||
| .attr("class", "yAxis") | ||
| .call(yAxis1) | ||
| .append("text") | ||
| .attr("transform", "rotate(-90)") | ||
| .attr("y", 6) | ||
| .attr("x", -10) | ||
| .attr("dy", ".71em") | ||
| .style("text-anchor", "end") | ||
| .text("No. of Startups Funded"); | ||
|
|
||
| svg2.append("path") | ||
| .datum(allData) | ||
| .attr("class", "area") | ||
| .attr("d", area2); | ||
|
|
||
| svg2.append("path") | ||
| .datum(subData) | ||
| .attr("class", "areaY2Small") | ||
| .attr("d", area2Small) | ||
| .style("fill", function(d) { return color("E-Commerce");});; | ||
|
|
||
| svg2.append("g") | ||
| .attr("class", "xAxis") | ||
| .attr("transform", "translate(0," + height + ")") | ||
| .call(xAxis) | ||
| .attr("stroke-width",1); | ||
|
|
||
| svg2.append("g") | ||
| .attr("class", "yAxis") | ||
| .call(yAxis2) | ||
| .append("text") | ||
| .attr("transform", "rotate(-90)") | ||
| .attr("y", 6) | ||
| .attr("x", -120) | ||
| .attr("dy", ".71em") | ||
| .style("text-anchor", "end") | ||
| .text("Median Amount Funded"); | ||
|
|
||
| d3.selectAll("#areachart1") | ||
| .on("mousemove", function(){ | ||
| mousepos = d3.mouse(this); | ||
| mousex = mousepos[0] + 5; | ||
| mousey = mousepos[1]; | ||
| vertical.style("left", mousex + "px" ) | ||
|
|
||
| var invertedx = x.invert(mousex); | ||
| invertedx = invertedx.getMonth() + invertedx.getDate(); | ||
| var selected = (d.values); | ||
| for (var k = 0; k < selected.length; k++) { | ||
| datearray[k] = selected[k].date | ||
| datearray[k] = datearray[k].getMonth() + datearray[k].getDate(); | ||
| } | ||
|
|
||
| mousedate = datearray.indexOf(invertedx); | ||
| pro = d.values[mousedate].value; | ||
|
|
||
| }) | ||
| .on("mouseover", function(){ | ||
| mousex = d3.mouse(this); | ||
| mousex = mousex[0] + 5; | ||
| vertical.transition() | ||
| .style("opacity",1) | ||
| .style("left", mousex + "px") | ||
| areaTooltip.transition() | ||
| .style("opacity",1); | ||
| areaTooltip.html("<p>Helllooo"+pro+"</p") | ||
| .style("left", mousex + "px") | ||
| .style("top", mousey + "px"); | ||
| }) | ||
| .on("mouseout", function() { | ||
| vertical.transition() | ||
| .style("opacity", 0); | ||
| areaTooltip.transition() | ||
| .style("opacity",0); | ||
| }); | ||
| }); | ||
|
|
||
|
|
||
| function updateData(market) { | ||
| console.log(market); | ||
|
|
||
| /* d3.selectAll("path.areaY1Small") | ||
| .remove(); | ||
| d3.selectAll("path.areaY2Small") | ||
| .remove(); */ | ||
| /* d3.selectAll("g.yAxis") | ||
| .remove(); | ||
| d3.selectAll("path.area") | ||
| .remove(); | ||
| */ | ||
| d3.tsv("/convert_data/unicorns-time.tsv", function(error, data) { | ||
| if (error) throw error; | ||
|
|
||
|
|
||
|
|
||
| data.forEach(function(d) { | ||
|
|
||
| allData = data.filter(function(row) { | ||
|
|
||
| return row['market'] == 'All'; | ||
| }) | ||
| d.date = parseDate(d.date); | ||
| d.startup = +d.startup; | ||
| d.funding = +d.funding; | ||
|
|
||
| subData = data.filter(function(row) { | ||
| return row['market'].replace(/ /g,'') == market; | ||
| }) | ||
| d.startup = +d.startup; | ||
| d.funding = +d.funding; | ||
| //console.log(subData) | ||
| }); | ||
| /* var maxStartup = [d3.max(allData, function(d) { return d.startup; }), d3.max(subData, function(d) {return d.startup; })]; | ||
| var maxFunding = [d3.max(allData, function(d) { return d.funding; }), d3.max(subData, function(d) {return d.funding; })];*/ | ||
|
|
||
| x.domain(d3.extent(allData, function(d) { return d.date; })); | ||
| /* y1.domain([0, d3.max(maxStartup)]); | ||
| y2.domain([0, d3.max(maxFunding)]); | ||
| y1small.domain([0, d3.max(maxStartup)]); | ||
| y2small.domain([0, d3.max(maxFunding)]); | ||
| */ | ||
|
|
||
| y1.domain([0, 1900]); | ||
| y1small.domain([0, 1900]); | ||
| y2.domain([0, 45000000]); | ||
| y2small.domain([0, 45000000]); | ||
|
|
||
| /* svg1.append("path") | ||
| .datum(allData) | ||
| .attr("class", "area") | ||
| .attr("d", area1);*/ | ||
|
|
||
| /* svg1.append("path") | ||
| .datum(subData) | ||
| .attr("class", "areaY1Small") | ||
| .attr("d", area1Small)*/ | ||
|
|
||
| d3.selectAll("path.areaY1Small") | ||
| .datum(subData) | ||
|
|
||
| .transition() | ||
| .duration(500) | ||
| .style("fill", function(d) {return color(market);}) | ||
| .attr("d", area1Small); | ||
| //.attr("fill", function(d) { return color(d[market])}); | ||
|
|
||
|
|
||
| /* svg1.append("g") | ||
| .attr("class", "yAxis") | ||
| .call(yAxis1) | ||
| .append("text") | ||
| .attr("transform", "rotate(-90)") | ||
| .attr("y", 6) | ||
| .attr("dy", ".71em") | ||
| .style("text-anchor", "end") | ||
| .text("No. of Startups Funded");*/ | ||
|
|
||
| /* svg2.append("path") | ||
| .datum(allData) | ||
| .attr("class", "area") | ||
| .attr("d", area2);*/ | ||
|
|
||
| /* svg2.append("path") | ||
| .datum(subData) | ||
| .attr("class", "areaY2Small") | ||
| .attr("d", area2Small);*/ | ||
| d3.selectAll("path.areaY2Small") | ||
| .datum(subData) | ||
| .transition() | ||
| .duration(500) | ||
| .style("fill", function(d) {return color(market);}) | ||
| .attr("d", area2Small); | ||
|
|
||
| /* svg2.append("g") | ||
| .attr("class", "xAxis") | ||
| .attr("transform", "translate(0," + height + ")") | ||
| .call(xAxis) | ||
| .attr("stroke-width",1);*/ | ||
|
|
||
| /* svg2.append("g") | ||
| .attr("class", "yAxis") | ||
| .call(yAxis2) | ||
| .append("text") | ||
| .attr("transform", "rotate(-90)") | ||
| .attr("y", 6) | ||
| .attr("x", -170) | ||
| .attr("dy", ".71em") | ||
| .style("text-anchor", "end") | ||
| .text("Amount Funded"); */ | ||
|
|
||
| }); | ||
| } |
| @@ -0,0 +1,94 @@ | ||
| body { | ||
| font: 10px sans-serif; | ||
| } | ||
| /* Dropdown Button */ | ||
| .dropbtn { | ||
| background-color: #4CAF50; | ||
| color: white; | ||
| padding: 16px; | ||
| font-size: 16px; | ||
| border: none; | ||
| cursor: pointer; | ||
| } | ||
|
|
||
| /* The container <div> - needed to position the dropdown content */ | ||
| .dropdown { | ||
| position: relative; | ||
| display: inline-block; | ||
| } | ||
|
|
||
| /* Dropdown Content (Hidden by Default) */ | ||
| .dropdown-content { | ||
| display: none; | ||
| position: absolute; | ||
| background-color: #f9f9f9; | ||
| min-width: 160px; | ||
| box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | ||
| } | ||
|
|
||
| /* Links inside the dropdown */ | ||
| .dropdown-content a { | ||
| color: black; | ||
| padding: 12px 16px; | ||
| text-decoration: none; | ||
| display: block; | ||
| } | ||
|
|
||
| /* Change color of dropdown links on hover */ | ||
| .dropdown-content a:hover {background-color: #f1f1f1} | ||
|
|
||
| /* Show the dropdown menu on hover */ | ||
| .dropdown:hover .dropdown-content { | ||
| display: block; | ||
| } | ||
|
|
||
| /* Change the background color of the dropdown button when the dropdown content is shown */ | ||
| .dropdown:hover .dropbtn { | ||
| background-color: #3e8e41; | ||
| } | ||
|
|
||
| .yAxis path, | ||
| .yAxis line { | ||
| fill: none; | ||
| stroke: #000; | ||
| shape-rendering: crispEdges; | ||
| } | ||
|
|
||
| .xAxis path, | ||
| .xAxis line { | ||
| fill: none; | ||
| stroke: #000; | ||
| shape-rendering: crispEdges; | ||
| } | ||
|
|
||
| .area { | ||
| fill: #DE4000; | ||
| stroke-width: 0; | ||
| opacity: 0.3; | ||
| } | ||
|
|
||
| .areaY1Small { | ||
| fill: maroon; | ||
| stroke-width: 0; | ||
| opacity: 0.7; | ||
| } | ||
|
|
||
| .areaY2Small { | ||
| fill: maroon; | ||
| stroke-width: 0; | ||
| opacity: 0.7; | ||
| } | ||
|
|
||
| div.tooltip { | ||
| position: absolute; | ||
| text-align: left; | ||
| width: 120px; | ||
| height: 65px; | ||
| padding: 5px; | ||
| font-size: 10px; | ||
| font-family: 'Open Sans', sans-serif; | ||
| background: #8b8687; | ||
| border: 1px; | ||
| border-radius: 8px; | ||
| pointer-events: none; | ||
| } |
| @@ -1,100 +1,121 @@ | ||
| date,startup,funding,25startups,25funding,startup_ecommerce,funding_ecommerce | ||
| 2004-01,#VALUE!,11764509,48,10971665,4,42000000 | ||
| 2004-02,#VALUE!,26740000,13,32146154,4,82000000 | ||
| 2004-03,#VALUE!,16601251,42,18854962,1,3000000 | ||
| 2004-04,#VALUE!,7085458,23,10526604,0,0 | ||
| 2004-05,#VALUE!,7618425,27,7188351,0,0 | ||
| 2004-06,#VALUE!,21511882,26,28608232,0,0 | ||
| 2004-07,#VALUE!,11709850,44,12920904,0,0 | ||
| 2004-08,#VALUE!,6248145,9,7704867,0,0 | ||
| 2004-09,#VALUE!,11600978,23,12902835,2,4500000 | ||
| 2004-10,#VALUE!,9218108,20,8580000,0,0 | ||
| 2004-11,#VALUE!,20101678,23,22560811,0,0 | ||
| 2004-12,#VALUE!,10291051,27,10004973,0,0 | ||
| 2005-01,#VALUE!,8663365,287,8770423,3,6300000 | ||
| 2005-02,#VALUE!,21014454,169,24944237,4,7000000 | ||
| 2005-03,#VALUE!,11888698,213,10964483,2,5500000 | ||
| 2005-04,#VALUE!,10048157,221,9465269,0,0 | ||
| 2005-05,#VALUE!,12860865,204,10483377,3,2050000 | ||
| 2005-06,#VALUE!,11185065,168,8616283,6,45000000 | ||
| 2005-07,#VALUE!,9733793,155,7355030,0,0 | ||
| 2005-08,#VALUE!,14767689,227,16563413,2,501000000 | ||
| 2005-09,#VALUE!,11969402,232,13372650,2,25000000 | ||
| 2005-10,#VALUE!,12626044,216,14053172,1,25000000 | ||
| 2005-11,#VALUE!,13528885,165,10298177,3,2500000 | ||
| 2005-12,#VALUE!,16031642,227,12566507,0,0 | ||
| 2006-01,#VALUE!,11340517,400,11438156,0,0 | ||
| 2006-02,#VALUE!,9736580,214,8641490,2,6000000 | ||
| 2006-03,#VALUE!,10001795,250,9470164,1,15000000 | ||
| 2006-04,#VALUE!,15839498,244,17500533,1,2000000 | ||
| 2006-05,#VALUE!,14164198,229,11633426,7,4000000 | ||
| 2006-06,#VALUE!,15406037,274,15104362,1,100000 | ||
| 2006-07,#VALUE!,11129182,235,10296531,7,3000000 | ||
| 2006-08,#VALUE!,11693271,209,10901947,0,0 | ||
| 2006-09,#VALUE!,14266641,316,16210910,11,11000000 | ||
| 2006-10,#VALUE!,12614628,276,12185003,7,4000000 | ||
| 2006-11,#VALUE!,14386209,281,14139812,9,4000000 | ||
| 2006-12,#VALUE!,11085016,182,8908531,7,5000000 | ||
| 2007-01,#VALUE!,14195230,380,15145871,10,4000000 | ||
| 2007-02,#VALUE!,14673024,216,11100413,1,6000000 | ||
| 2007-03,#VALUE!,15918847,288,15453650,6,12000000 | ||
| 2007-04,#VALUE!,12841417,257,13045071,5,18000000 | ||
| 2007-05,#VALUE!,11109174,340,9833657,16,11000000 | ||
| 2007-06,#VALUE!,13575618,308,14616568,12,3000000 | ||
| 2007-07,#VALUE!,13019502,350,12909547,4,15000000 | ||
| 2007-08,#VALUE!,15408321,286,13108911,4,16600000 | ||
| 2007-09,#VALUE!,17657279,306,16765860,10,10000000 | ||
| 2007-10,#VALUE!,16053897,342,16740992,0,0 | ||
| 2007-11,#VALUE!,13919335,306,15234735,2,20500000 | ||
| 2007-12,#VALUE!,17399681,234,13099982,12,4400000 | ||
| 2008-01,#VALUE!,14256018,415,13608441,18,6500000 | ||
| 2008-02,#VALUE!,14055484,317,14062754,15,7000000 | ||
| 2008-03,#VALUE!,19649857,259,23966302,3,5000000 | ||
| 2008-04,#VALUE!,16525003,355,18279461,19,13500000 | ||
| 2008-05,#VALUE!,43912262,309,14085219,12,20000000 | ||
| 2008-06,#VALUE!,15118028,363,13083904,10,7100000 | ||
| 2008-07,#VALUE!,18979380,271,20635958,8,6900000 | ||
| 2008-08,#VALUE!,17349603,245,17855021,6,3345875 | ||
| 2008-09,#VALUE!,18470736,304,19366020,2,12000000 | ||
| 2008-10,#VALUE!,16209828,259,14652814,15,4500000 | ||
| 2008-11,#VALUE!,17015946,239,15776276,7,5000000 | ||
| 2008-12,#VALUE!,12986999,228,10273510,6,2945500 | ||
| 2009-01,#VALUE!,10858995,299,11875066,16,6000000 | ||
| 2009-02,#VALUE!,9688248,239,8968108,6,7000000 | ||
| 2009-03,#VALUE!,11500844,228,10377993,2,1528150 | ||
| 2009-04,#VALUE!,15301155,222,11275033,7,5000000 | ||
| 2009-05,#VALUE!,15170633,262,12638237,15,5000000 | ||
| 2009-06,#VALUE!,12588421,216,10156777,11,7002000 | ||
| 2009-07,#VALUE!,13381519,233,13753316,8,3700000 | ||
| 2009-08,#VALUE!,14642892,231,15020371,3,1500000 | ||
| 2009-09,#VALUE!,13283457,205,12259731,8,5050000 | ||
| 2009-10,#VALUE!,15627457,299,16460510,12,25000000 | ||
| 2009-11,#VALUE!,35393952,357,13139465,3,10000000 | ||
| 2009-12,#VALUE!,11893626,374,11355345,14,1400000 | ||
| 2010-01,#VALUE!,14937460,414,15382452,24,5000000 | ||
| 2010-02,#VALUE!,9948784,268,10623132,2,15000000 | ||
| 2010-03,#VALUE!,10014788,351,8779952,24,5350000 | ||
| 2010-04,#VALUE!,16379773,410,19967227,33,10000000 | ||
| 2010-05,#VALUE!,12825689,283,11292874,6,4583500 | ||
| 2010-06,#VALUE!,12862394,427,14501463,18,4549650 | ||
| 2010-07,#VALUE!,14486739,358,13374153,25,4500000 | ||
| 2010-08,#VALUE!,10224633,314,8610484,20,6500000 | ||
| 2010-09,#VALUE!,9865435,446,10047456,19,2570000 | ||
| 2010-10,#VALUE!,13256106,323,15878986,14,5330000 | ||
| 2010-11,#VALUE!,13311019,339,14735688,22,9341317 | ||
| 2010-12,#VALUE!,13790246,310,15127135,38,10000000 | ||
| 2011-01,#VALUE!,27721086,435,42529687,23,12000000 | ||
| 2011-02,#VALUE!,17169064,369,15981782,20,4050200 | ||
| 2011-03,#VALUE!,13271688,325,14507058,41,10000000 | ||
| 2011-04,#VALUE!,15308382,338,16137050,29,2500000 | ||
| 2011-05,#VALUE!,16501128,416,17957265,20,1250000 | ||
| 2011-06,#VALUE!,14452775,472,14133852,45,5000000 | ||
| 2011-07,#VALUE!,16504322,417,21107004,33,10000000 | ||
| 2011-08,#VALUE!,13178311,410,14023315,29,7900000 | ||
| 2011-09,#VALUE!,16578386,436,17364993,27,8000000 | ||
| 2011-10,#VALUE!,15927544,371,22243085,22,7309695 | ||
| 2011-11,#VALUE!,13774653,404,16542743,46,2520000 | ||
| 2011-12,#VALUE!,10327068,358,13648433,21,1000000 | ||
| 2012-01,#VALUE!,10417193,602,12507146,40,1869162 | ||
| 2012-02,#VALUE!,9726742,417,11002478,40,2670000 | ||
| 2012-03,#VALUE!,11584676,484,13565310,47,5500000 | ||
| 2012-04,#VALUE!,11478143,458,11335255,52,1600000 | ||
| 2012-05,#VALUE!,12608483,440,14977851,21,15789473 | ||
| 2012-06,#VALUE!,13686741,530,15827092,52,12500000 | ||
| 2012-07,#VALUE!,13673131,556,16107070,40,1350000 | ||
| 2012-08,#VALUE!,9600574,421,12648587,66,1000000 | ||
| 2012-09,#VALUE!,10845963,366,11101513,36,925000 | ||
| 2012-10,#VALUE!,8222623,542,8979621,60,1950000 | ||
| 2012-11,#VALUE!,12752748,501,13317927,33,2592330 | ||
| 2012-12,#VALUE!,9507406,395,11154861,41,2000000 | ||
| 2013-01,#VALUE!,11151454,578,14440852,42,1600853 | ||
| 2013-02,#VALUE!,9744729,452,11075600,64,3004965 | ||
| 2013-03,#VALUE!,8428273,495,8263368,63,1022820 | ||
| 2013-04,#VALUE!,9669693,621,10765062,103,5000000 | ||
| 2013-05,#VALUE!,9856266,503,12112562,69,3400000 | ||
| 2013-06,#VALUE!,12589141,615,16268005,89,2186690 | ||
| 2013-07,#VALUE!,13656573,648,12329749,73,1650000 | ||
| 2013-08,#VALUE!,10727623,507,16031035,45,1600000 | ||
| 2013-09,#VALUE!,12396403,671,13719441,58,1286600 | ||
| 2013-10,#VALUE!,14625397,719,17238216,59,2400000 | ||
| 2013-11,#VALUE!,13992293,620,13899527,81,5500000 | ||
| 2013-12,#VALUE!,15566599,621,17468862,78,3650000 |
| @@ -0,0 +1,83 @@ | ||
| d3.helper = {}; | ||
|
|
||
| d3.helper.tooltip = function(){ | ||
| var tooltipDiv; | ||
| var bodyNode = d3.select('body').node(); | ||
| var attrs = {}; | ||
| var text = ''; | ||
| var styles = {}; | ||
|
|
||
| function tooltip(selection){ | ||
| var datearray = [] | ||
| selection.on('mouseover.tooltip', function(pD, pI){ | ||
| var name, value; | ||
| // Clean up lost tooltips | ||
| d3.select('body').selectAll('div.tooltip').remove(); | ||
| // Append tooltip | ||
| tooltipDiv = d3.select('body').append('div'); | ||
| tooltipDiv.attr(attrs); | ||
| tooltipDiv.style(styles); | ||
| var absoluteMousePos = d3.mouse(bodyNode); | ||
| tooltipDiv.style({ | ||
| left: (absoluteMousePos[0] + 10)+'px', | ||
| top: (absoluteMousePos[1] - 5)+'px', | ||
| position: 'absolute', | ||
| 'z-index': 1001 | ||
| }); | ||
| // Add text using the accessor function, Crop text arbitrarily | ||
| tooltipDiv.style('width', function(d, i){ return (text(pD, pI).length > 80) ? '300px' : null; }) | ||
| .html(function(d, i){return text(pD, pI);}); | ||
| }) | ||
|
|
||
| .on('mousemove.tooltip', function(pD, pI){ | ||
| // Move tooltip | ||
| var absoluteMousePos = d3.mouse(bodyNode); | ||
| tooltipDiv.style({ | ||
| left: (absoluteMousePos[0] + 10)+'px', | ||
| top: (absoluteMousePos[1] - 5)+'px' | ||
| }); | ||
| mousex = d3.mouse(bodyNode); | ||
| mousex = mousex[0]; | ||
| var invertedx = x.invert(mousex); | ||
| invertedx = invertedx.getMonth() + invertedx.getDate(); | ||
|
|
||
| var selected = (pD); | ||
| console.log(selected); | ||
| for (var k = 0; k < selected.length; k++) { | ||
| datearray[k] = selected[k].date | ||
| datearray[k] = datearray[k].getMonth() + datearray[k].getDate(); | ||
| } | ||
| mousedate = datearray.indexOf(invertedx); | ||
| console.log(mousedate); | ||
| pro = pD[mousedate].date.getYear(); | ||
| console.log(pro); | ||
| // Keep updating the text, it could change according to position | ||
| tooltipDiv.html(function(d, i){ return "<p>Hi:"+pro+"</p>"+text(pD, pI); }); | ||
| }) | ||
| .on('mouseout.tooltip', function(pD, pI){ | ||
| // Remove tooltip | ||
| tooltipDiv.remove(); | ||
| }); | ||
|
|
||
| } | ||
|
|
||
| tooltip.attr = function(_x){ | ||
| if (!arguments.length) return attrs; | ||
| attrs = _x; | ||
| return this; | ||
| }; | ||
|
|
||
| tooltip.style = function(_x){ | ||
| if (!arguments.length) return styles; | ||
| styles = _x; | ||
| return this; | ||
| }; | ||
|
|
||
| tooltip.text = function(_x){ | ||
| if (!arguments.length) return text; | ||
| text = d3.functor(_x); | ||
| return this; | ||
| }; | ||
|
|
||
| return tooltip; | ||
| }; |
