Verified Commit 234cdcae authored by Bastien Durel's avatar Bastien Durel
Browse files

change legend, rewrite horizontal lines

parent 32fbaa8f
......@@ -4,7 +4,8 @@ wget -O covid.csv -cq https://www.data.gouv.fr/fr/datasets/r/63352e38-d353-4b54-
date_new=$(stat -c %y covid.csv)
if [ "$date" != "$date_new" -o ! -r covid_corrected.csv ]; then
sed -E 's@([0-9]+)/([0-9]+)/([0-9]+)@\3-\2-\1@' \
< covid.csv | sed 's/\r$//' > covid_corrected.csv
< covid.csv | sed 's/\r$//' | \
grep "-" > covid_corrected.csv
psql -h postgresql.cloud.data.fr -U bastien \
-c "truncate covid;COPY covid FROM stdin DELIMITER ';' CSV HEADER;" \
< covid_corrected.csv
......
......@@ -85,6 +85,7 @@
var map = {};
var url = "data.php";
var label = "Patients en réanimation";
var legend;
d3.json(url).then(function(data) {
data.forEach(function(d) {
d.date = parseTime(d.jour);
......@@ -99,16 +100,16 @@
.attr("transform", "translate(0," + height + ")")
.call(d3.axisBottom(x));
svg.append("g")
.attr("class", "xAxis")
.call(d3.axisLeft(y))
.append("text")
.attr("fill", "#000")
.attr("transform", "rotate(-90)")
.attr("y", 6)
.attr("dy", "0.71em")
.style("text-anchor", "end")
.text(label + " ");
legend = svg.append("g")
.attr("class", "xAxis")
.call(d3.axisLeft(y))
.append("text")
.attr("fill", "#000")
.attr("transform", "rotate(-90)")
.attr("y", 6)
.attr("dy", "0.71em")
.style("text-anchor", "end")
.text(label + " ");
svg.selectAll("y axis").data(y.ticks(10)).enter()
.append("line")
......@@ -124,8 +125,9 @@
.attr("d", line);
});
function reload(_url) {
function reload(_url, _label) {
if (_url) url = _url;
if (_label) label = _label;
let delay = 1000;
d3.json(url).then(function(data) {
data.forEach(function(d) {
......@@ -138,6 +140,14 @@
svg.selectAll(".xAxis").transition()
.duration(delay)
.call(d3.axisLeft(y));
svg.selectAll(".horizontalGrid").remove()
svg.selectAll("y axis").data(y.ticks(10)).enter()
.append("line")
.attr("class", "horizontalGrid")
.attr("x1", 0)
.attr("x2", width)
.attr("y1", d => y(d))
.attr("y2", d => y(d));
let u = svg.selectAll("path")
.datum(data);
u.enter()
......@@ -148,6 +158,7 @@
.duration(delay)
.attr("d", line)
;
legend.text(label + " ");
});
}
......@@ -195,7 +206,6 @@
var mouse_x = d3.mouse(this)[0];
var mouse_y = d3.mouse(this)[1];
// Si la position de la souris est en dehors de la zone du graphique, on masque la ligne et le tooltip
if (mouse_x < margin.left || mouse_x > (width + margin.left) || mouse_y < margin.top || mouse_y > (400 - margin.bottom)) {
div.style("opacity", 0);
verticalLine.style("opacity", 0);
......@@ -203,9 +213,9 @@
});
</script>
<div class="bar">
<button onclick="reload('data.php?col=rea')">Réanimation</button>
<button onclick="reload('data.php?col=hosp')">Hospitalisations</button>
<button onclick="reload('data.php?col=dc')">Décès</button>
<button onclick="reload('data.php?col=rea', 'Patients en réanimation')">Réanimation</button>
<button onclick="reload('data.php?col=hosp', 'Patients hospitalisés')">Hospitalisations</button>
<button onclick="reload('data.php?col=dc', 'Décès')">Décès</button>
</div>
</body>
</html>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment