Skip to content

Instantly share code, notes, and snippets.

@satacroteam

satacroteam/.block

Last active December 8, 2016 10:28
Show Gist options
  • Save satacroteam/66c26ce1d758456367c946774d76c270 to your computer and use it in GitHub Desktop.
Save satacroteam/66c26ce1d758456367c946774d76c270 to your computer and use it in GitHub Desktop.
Download ZIP
Projet
Raw
.block
license: mit
Raw
2015_2016.csv
We can make this file beautiful and searchable if this error is corrected: No commas found in this CSV file in line 0.
Equipe;J1;J2;J3;J4;J5;J6;J7;J8;J9;J10;J11;J12;J13;J14;J15;J16;J17;J18;J19;J20;J21;J22;J23;J24;J25;J26;J27;J28;J29;J30;J31;J32;J33;J34;J35;J36;J37;J38
AngersSCO;1;4;3;4;7;6;6;5;2;2;2;3;4;5;3;3;2;2;3;2;3;5;3;4;5;8;9;9;9;12;10;9;8;8;8;8;9;9
ASMonaco;2;6;8;13;8;11;10;9;10;11;9;6;9;6;7;6;4;3;2;3;2;2;2;2;2;2;2;2;2;2;2;2;3;2;3;3;3;3
ASSaint-Etienne;13;14;10;7;4;3;2;2;5;4;5;4;5;7;5;7;6;7;6;7;5;6;8;5;4;4;4;8;7;8;7;6;6;5;5;4;5;6
EAGuingamp;18;18;20;16;14;8;12;13;11;12;12;11;12;10;12;14;17;18;18;19;18;16;14;13;13;15;16;16;17;16;15;15;15;14;13;15;15;16
ESTACTroyes;9;11;17;17;18;18;18;19;19;19;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20;20
FCLorient;11;12;15;18;17;10;9;10;9;10;10;9;7;9;9;9;8;8;8;9;12;12;12;12;12;14;14;12;12;11;13;14;13;11;14;16;16;15
FCNantes;7;8;4;8;10;16;11;14;12;8;6;7;10;11;10;11;11;12;13;10;11;11;9;7;7;6;5;7;8;6;8;10;10;10;10;9;12;14
GazlecFCAjaccio;12;17;18;20;20;20;19;20;20;20;19;18;18;16;16;13;15;16;12;14;13;13;16;17;17;18;18;18;18;18;18;18;18;18;17;17;18;19
GirondinsdeBordeaux;15;15;14;10;12;13;17;12;15;14;13;14;11;13;14;17;12;14;14;12;10;10;7;11;11;9;10;13;13;14;14;12;12;13;11;11;10;11
LOSC;19;16;16;12;13;14;14;16;13;13;15;16;16;17;18;18;13;11;11;13;14;14;15;14;15;13;13;15;14;9;9;7;7;6;6;6;6;5
MontpellierHraultSC;20;20;19;19;19;19;20;18;18;18;17;17;17;14;13;15;16;13;15;15;16;18;17;18;18;16;15;14;15;15;16;16;16;16;12;12;11;12
OGCNice;16;13;9;11;15;9;8;7;8;5;7;8;6;4;6;5;7;5;5;4;4;3;4;3;3;3;3;5;4;3;3;5;4;4;4;5;4;4
OlympiquedeMarseille;17;19;13;15;11;12;13;15;16;16;14;12;13;12;11;8;9;9;10;11;8;8;10;8;10;11;11;11;11;10;12;13;14;15;16;13;13;13
OlympiqueLyonnais;10;7;12;5;6;7;4;8;6;6;4;2;2;2;4;4;5;6;9;6;9;9;11;10;6;5;6;3;3;4;4;3;2;3;2;2;2;2
ParisSaint-Germain;8;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1;1
SCBastia;4;5;2;6;9;15;16;11;14;15;16;15;15;18;17;16;18;17;16;16;15;15;13;15;14;12;12;10;10;13;11;11;11;12;15;14;14;10
SMCaen;6;3;6;9;5;4;7;6;3;3;3;5;3;3;2;2;3;4;4;5;7;7;5;6;8;10;7;4;6;7;6;8;9;9;9;10;8;7
StadedeReims;3;2;7;2;3;5;5;4;7;9;11;13;14;15;15;12;14;15;17;17;17;17;18;16;16;17;17;17;16;17;17;17;17;17;18;18;19;18
StadeRennaisFC;5;9;5;3;2;2;3;3;4;7;8;10;8;8;8;10;10;10;7;8;6;4;6;9;9;7;8;6;5;5;5;4;5;7;7;7;7;8
ToulouseFC;14;10;11;14;16;17;15;17;17;17;18;19;19;19;19;19;19;19;19;18;19;19;19;19;19;19;19;19;19;19;19;19;19;19;19;19;17;17
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="http://getbootstrap.com/examples/justified-nav/justified-nav.css" rel="stylesheet">
<style>
.axis path {
fill: none;
stroke: #777;
shape-rendering: crispEdges;
}
.axis text {
font-family: Lato;
font-size: 13px;
}
</style>
</head>
<body>
<div class="container">
<div class="jumbotron">
<svg id="visualisation" width="1000" height="500"></svg>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script>
function InitChart() {
var data = [{
"sale": "202",
"year": "1"
}, {
"sale": "215",
"year": "2"
}, {
"sale": "179",
"year": "3"
}, {
"sale": "199",
"year": "4"
}, {
"sale": "134",
"year": "4"
}, {
"sale": "176",
"year": "6"
}, {
"sale": "189",
"year": "7"
}];
var data2 = [{
"sale": "152",
"year": "1"
}, {
"sale": "189",
"year": "2"
}, {
"sale": "179",
"year": "3"
}, {
"sale": "199",
"year": "4"
}, {
"sale": "134",
"year": "5"
}, {
"sale": "176",
"year": "6"
}, {
"sale": "197",
"year": "7"
}];
var vis = d3.select("#visualisation"),
WIDTH = 464,
HEIGHT = 360,
MARGINS = {
top: 20,
right: 20,
bottom: 20,
left: 50
},
xScale = d3.scale.linear().range([MARGINS.left, WIDTH - MARGINS.right]).domain([0, 7]),
yScale = d3.scale.linear().range([HEIGHT - MARGINS.top, MARGINS.bottom]).domain([134, 215]),
xAxis = d3.svg.axis()
.scale(xScale),
yAxis = d3.svg.axis()
.scale(yScale)
.orient("left");
vis.append("svg:g")
.attr("class", "x axis")
.attr("transform", "translate(0," + (HEIGHT - MARGINS.bottom) + ")")
.call(xAxis);
vis.append("svg:g")
.attr("class", "y axis")
.attr("transform", "translate(" + (MARGINS.left) + ",0)")
.call(yAxis);
var lineGen = d3.svg.line()
.x(function(d) {
return xScale(d.year);
})
.y(function(d) {
return yScale(d.sale);
})
.interpolate("basis");
vis.append('svg:path')
.attr('d', lineGen(data))
.attr('stroke', 'green')
.attr('stroke-width', 2)
.attr('fill', 'none');
vis.append('svg:path')
.attr('d', lineGen(data2))
.attr('stroke', 'blue')
.attr('stroke-width', 2)
.attr('fill', 'none');
}
InitChart();
</script>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment