diff --git a/src/clasificacion/clasificacion.css b/src/clasificacion/clasificacion.css index 00eb79d81bc46d6c5d92026674cec80f218b1818..e1b5097355d1b3006370f1b2af8853dca37990d3 100644 --- a/src/clasificacion/clasificacion.css +++ b/src/clasificacion/clasificacion.css @@ -152,12 +152,9 @@ svg { -.bar { - fill: #00FF85; -} .bar:hover { - fill: red; + opacity: 0.6; } diff --git a/src/clasificacion/clasificacion.js b/src/clasificacion/clasificacion.js index 845aa0d04e55534bb41df3364a57e49b50ee5e13..c95fc923dfcbbe85c2542c434acd4682836ead9b 100644 --- a/src/clasificacion/clasificacion.js +++ b/src/clasificacion/clasificacion.js @@ -82,11 +82,25 @@ document.addEventListener('DOMContentLoaded', function() { .attr("y", function(d) {return y(d.team); }) .attr("width", function(d) { return x(d.points); }) .attr("height", y.bandwidth()) + .attr("fill", function(d){ + if (d.notes.includes("Champions")){ + return "#3562A6"; + } else if (d.notes == "Relegated"){ + return "red"; + } else if(d.notes.includes("Europa Conference")){ + return "#00be14"; + } + else if(d.notes.includes("Europa League")){ + return "#fd7000"; + } else { + return "#00FF85"; + } + }) .on("mouseover", function(event, d) { tooltip.transition() .duration(200) - .style("opacity", .9); - tooltip.html(d.team + "<br/>" + d.points + " puntos") + .style("opacity", 1); + tooltip.html(d.team + "<br/>" + d.points + " puntos" + "<br/><b>" + d.notes + "</b>") .style("left", (event.pageX + 5) + "px") .style("top", (event.pageY - 28) + "px"); }) diff --git a/src/equipo/equipo.js b/src/equipo/equipo.js index 2563ec02ea64f8bae1f8a59bae7f9b6968dce965..7e434b08928d37d83992836db3c5cd06ca42e3d5 100644 --- a/src/equipo/equipo.js +++ b/src/equipo/equipo.js @@ -53,7 +53,6 @@ document.addEventListener('DOMContentLoaded', function() { {"area": "drawn", "value": filteredData[0].drawn}, {"area": "gf", "value": filteredData[0].gf}, {"area": "ga", "value": filteredData[0].ga}, - {"area": "gf", "value": filteredData[0].gf}, {"area": "points", "value": filteredData[0].points} ] ]; @@ -62,7 +61,7 @@ document.addEventListener('DOMContentLoaded', function() { w: 500, h: 500, maxValue: filteredData[0].maxValue, - levels: 5, + levels: 4, ExtraWidthX: 200 } diff --git a/src/ui/radarChart.js b/src/ui/radarChart.js index 2c5cc0df3b291d5ca942488caf734b9580c359ad..381d0fcb939241f8d6597d57cd57ffa2c64c0322 100644 --- a/src/ui/radarChart.js +++ b/src/ui/radarChart.js @@ -26,7 +26,8 @@ var RadarChart = { } } - cfg.maxValue = 110; + // Función para obtener los maximos en todas las columnas que serán ejes + calculateMaxValue().then(function(maxValue) { var allAxis = (d[0].map(function(i, j){return i.area})); var total = allAxis.length; @@ -111,8 +112,8 @@ var RadarChart = { g.selectAll(".nodes") .data(y, function(j, i){ dataValues.push([ - cfg.w/2*(1-(parseFloat(Math.max(j.value, 0))/cfg.maxValue)*cfg.factor*Math.sin(i*cfg.radians/total)), - cfg.h/2*(1-(parseFloat(Math.max(j.value, 0))/cfg.maxValue)*cfg.factor*Math.cos(i*cfg.radians/total)) + cfg.w/2*(1-(parseFloat(Math.max(j.value, 0))/maxValue[i])*cfg.factor*Math.sin(i*cfg.radians/total)), + cfg.h/2*(1-(parseFloat(Math.max(j.value, 0))/maxValue[i])*cfg.factor*Math.cos(i*cfg.radians/total)) ]); }); dataValues.push(dataValues[0]); @@ -161,13 +162,13 @@ var RadarChart = { .attr("alt", function(j){return Math.max(j.value, 0)}) .attr("cx", function(j, i){ dataValues.push([ - cfg.w/2*(1-(parseFloat(Math.max(j.value, 0))/cfg.maxValue)*cfg.factor*Math.sin(i*cfg.radians/total)), - cfg.h/2*(1-(parseFloat(Math.max(j.value, 0))/cfg.maxValue)*cfg.factor*Math.cos(i*cfg.radians/total)) + cfg.w/2*(1-(parseFloat(Math.max(j.value, 0))/maxValue[i])*cfg.factor*Math.sin(i*cfg.radians/total)), + cfg.h/2*(1-(parseFloat(Math.max(j.value, 0))/maxValue[i])*cfg.factor*Math.cos(i*cfg.radians/total)) ]); - return cfg.w/2*(1-(Math.max(j.value, 0)/cfg.maxValue)*cfg.factor*Math.sin(i*cfg.radians/total)); + return cfg.w/2*(1-(Math.max(j.value, 0)/maxValue[i])*cfg.factor*Math.sin(i*cfg.radians/total)); }) .attr("cy", function(j, i){ - return cfg.h/2*(1-(Math.max(j.value, 0)/cfg.maxValue)*cfg.factor*Math.cos(i*cfg.radians/total)); + return cfg.h/2*(1-(Math.max(j.value, 0)/maxValue[i])*cfg.factor*Math.cos(i*cfg.radians/total)); }) .attr("data-id", function(j){return j.area}) .style("fill", "#fff") @@ -187,5 +188,28 @@ var RadarChart = { series++; }); + }); } - }; \ No newline at end of file + }; + + function calculateMaxValue() { + return d3.csv("/data/premier-tables.csv").then(function(data) { + var maxValues = { + won: 0, + drawn: 0, + gf: 0, + ga: 0, + points: 0 + }; + + data.forEach(function(row) { + maxValues.won = Math.max(maxValues.won, +row.won); + maxValues.drawn = Math.max(maxValues.drawn, +row.drawn); + maxValues.gf = Math.max(maxValues.gf, +row.gf); + maxValues.ga = Math.max(maxValues.ga, +row.ga); + maxValues.points = Math.max(maxValues.points, +row.points); + }); + + return [maxValues.won, maxValues.drawn, maxValues.gf, maxValues.ga, maxValues.points]; + }); +} \ No newline at end of file