From 1ce019090a424a55d81488396a32d130e5bea700 Mon Sep 17 00:00:00 2001
From: frajuar <franciscojavier.juarez@estudiantes.uva.es>
Date: Mon, 2 Dec 2024 12:12:51 +0100
Subject: [PATCH] Titulos actualizados y fuente arreglada
---
Js/script.js | 10 +++++++++-
css/estilo.css | 11 ++++++++++-
index.html | 3 +++
3 files changed, 22 insertions(+), 2 deletions(-)
diff --git a/Js/script.js b/Js/script.js
index fe4a11f..e8dcfa5 100644
--- a/Js/script.js
+++ b/Js/script.js
@@ -178,7 +178,8 @@ function dibujaMapa(seleccionAnno) {
.selectAll("text")
.attr("transform", "translate(30, 0)") // Desplazar los valores de la leyenda a la derecha
.style("text-anchor", "start"); // Alinear los valores de la leyenda a la derecha;
-
+
+
for (let i = Math.log(min); i <= Math.log(max); i += 0.1) {
legend.append("rect")
.attr("x", 0)
@@ -187,6 +188,13 @@ function dibujaMapa(seleccionAnno) {
.attr("height", legendScale(Math.exp(i + 0.1)) - legendScale(Math.exp(i)))
.style("fill", legendBar(i));
}
+ legend.append("text")
+ .raise()
+ .attr("x", 0)
+ .attr("y", -10 + legendScale(Math.exp(i + 0.1)) - legendScale(Math.exp(i)))
+ .style("font-size", "12px")
+ .style("font-weight", "bold")
+ .text("PIB");
});
}
diff --git a/css/estilo.css b/css/estilo.css
index 5cc12e1..670324e 100644
--- a/css/estilo.css
+++ b/css/estilo.css
@@ -1,11 +1,19 @@
-/* General */
+
body {
margin: 0;
height: 100vh; /* Asegura que el cuerpo ocupe toda la altura */
display: flex;
flex-direction: column; /* Disposición vertical */
}
+#titulo{
+ background-color: rgb(207, 207, 207);
+ font-weight: bold;
+ padding-top: 5px;
+ font-family: Arial, sans-serif;
+ text-align: center;
+ font-size: large;
+}
/* Contenedor del mapa */
#map {
flex: 2; /* Ocupa el doble de espacio que #abajo */
@@ -37,4 +45,5 @@ body {
font-weight: bold;
fill: #000000;
pointer-events: none;
+ font-family: Arial, sans-serif;
}
diff --git a/index.html b/index.html
index fad25fb..15cb179 100644
--- a/index.html
+++ b/index.html
@@ -7,6 +7,9 @@
<script src="https://d3js.org/d3.v7.min.js"></script>
</head>
<body>
+ <div id="titulo">
+ Distribución del PIB mundial en cientos de millones de dólares
+ </div>
<div id="map">
<!-- Add a container for the year selector -->
<div id="yearSelectorContainer">
--
GitLab