Skip to content
Snippets Groups Projects
Commit 8fa6fe6c authored by mariasa's avatar mariasa
Browse files

Upload New File

parent 5ba8688f
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
Showing
with 135 additions and 0 deletions
index.html 0 → 100644
+ 135
− 0
View file @ 8fa6fe6c
<!--
María Sánchez Villanueva.
Proeycto de Visualizacion: Contratos en CyL.
Diseño y Evaluación de Sistemas Interactivos - Curso 22/23 -
--------------------------------------------------------------
Página HTML del proyecto
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01">
<html>
<head>
<meta charset="utf-8">
<title>Contratos en Castilla y León</title>
<script src= "https://d3js.org/d3.v7.min.js" ></script>
<script src="https://d3js.org/d3-collection.v1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <!-- Descargar tipografía -->
<link rel="stylesheet" href="./css/main.css">
<script src="./js/main.js"></script>
<script src="./js/tab1_linechart.js"></script>
<script src="./js/tab2_chorolopletMap.js"></script>
<!-- Para el slider con doble handler-->
<link rel="stylesheet" href="./css/jquery-ui.css">
<link rel="stylesheet" href="./css/style.css">
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
</head>
<body>
<h1>Evolución contratos en Castilla y León</h1>
<div id="tabs">
<ul>
<li><a id="tab1">Evolución mensual</a></li>
<li><a id="tab2">Proporción anual</a></li>
</ul>
</div>
<!-- Tab 1 Line chart -->
<div class="container" id="tab1C">
<h2>Evolución mensual por tipo de contrato y provincias.</h2>
<div id="grupo1">
<div id="serie"></div>
<!-- Selectores del tipo de contrato, total, indefinido o temporal -->
<table>
<tr >
<td>
<h4 id="leyendaContrato">Tipo de contrato</h4>
<ul id="radiosContrato" type="none">
<li><input name="tipoContratoTab1" value="0" type="radio" checked />Ambos</li>
<li><input name="tipoContratoTab1" value="1" type="radio" />Temporal</li>
<li><input name="tipoContratoTab1" value="2" type="radio" />Indefinido</li>
</ul>
</td>
</tr>
</table>
<!-- Selectores de las provincias -->
<table>
<tr>
<td>
<h4 id="leyendaContrato">Provincia</h4>
<ul id="column1" class="column" type="none">
<li style="color:#b8b800;"><input name="Ávila" type="checkbox" checked />Ávila</li>
<li style="color:#377eb8;"><input name="Burgos" type="checkbox" checked />Burgos</li>
<li style="color:#e41a1c;"><input name="León" type="checkbox" checked />León</li>
<li style="color:#ff7f00;"><input name="Palencia" type="checkbox" checked />Palencia</li>
<li style="color:#023055;"><input name="Salamanca" type="checkbox" checked />Salamanca</li>
<li style="color:#01e75d;"><input name="Segovia" type="checkbox" checked />Segovia</li>
<li style="color:#a65628;"><input name="Soria" type="checkbox" checked />Soria</li>
<li style="color:#800080;"><input name="Valladolid" type="checkbox" checked />Valladolid</li>
<li style="color:#005823;"><input name="Zamora" type="checkbox" checked />Zamora</li>
</ul>
</td>
</tr>
</table>
</div>
<!--Slider con doble handler. -->
<div id="grupo1-fechas">
<label style="padding-left:0.5%"> Rango de fechas: </label>
<label id="rangoFechas"> del 01-2018 al 12-2021</label>
<div id="container-slider">
<div id="slider-range" ></div>
</div>
</div>
<h5>Sobre los datos</h5>
<p>Se han utilizado los datos correspondientes al dataset: "<a
href="https://datosabiertos.jcyl.es/web/jcyl/set/es/empleo/contratos-realizados/1284983338568">Contratos temperales e indefinido mensuales
en Castilla y León</a>" a fecha 21 de noviembre de 2022, del <a href="https://datosabiertos.jcyl.es/">Portal de Datos Abiertos</a> de la
<a href="http://jcyl.es/">Junta de Castilla y León</a></p>
<p>Los datos de los habitantes por provincia se han extraído de la " <a href="https://www.ine.es/jaxiT3/Tabla.htm?t=2852">Cifras oficiales de población resultantes de la revisión del Padrón municipal a 1 de enero
de 2022</a>", del <a href="https://www.ine.es">Instituto Nacional de Estadística</a> </p>
</div>
<!-- Tab 2 Choropleth map -->
<div class="container" id="tab2C">
<h2 id="titulo2">Proporción anual por provincia y tipo de contrato. </h2>
<!-- Selector de la fecha -->
<div id="selecFechas">
<h5 id="textoFechasMapa">Seleccionar fecha</h5>
<select id="fechasMapa"></select>
</div>
<div id="grupo2">
<div id="mapa"></div>
<!-- Selectores del tipo de contrato, total, indefinido o temporal -->
<table>
<tr >
<td>
<h4 id="leyendaContrato">Tipo de contrato</h4>
<ul id="radiosContratoTab2" type="none">
<li><input name="tipoContratoTab2" value="0" type="radio" checked />Ambos</li>
<li><input name="tipoContratoTab2" value="1" type="radio" />Temporal</li>
<li><input name="tipoContratoTab2" value="2" type="radio" />Indefinido</li>
</ul>
</td>
</tr>
</table>
</div>
<h5>Sobre los datos</h5>
<p>Se han utilizado los datos correspondientes al dataset: "<a
href="https://datosabiertos.jcyl.es/web/es/datos-abiertos-castilla-leon.html">Contratos temperales
e indefinido mensuales en Castilla y León</a>" a fecha 21 de noviembre
de 2022, del <a href="https://datosabiertos.jcyl.es/">Portal de Datos Abiertos</a> de la <a
href="http://jcyl.es/">Junta de Castilla y León</a></p>
<p>Los datos de los habitantes por provincia se han extraído de la "<a
href="https://www.ine.es/jaxiT3/Tabla.htm?t=2852">Cifras oficiales de población resultantes de la revisión del Padrón municipal a 1 de enero
de 2022</a>", del <a href="https://www.ine.es">Instituto Nacional de Estadística</a> </p>
</div>
<footer id="footer">
<p>&copy; <a href="mailto:maria.sanchez.villanueva@estudiantes.uva.es">María Sánchez Villanueva</a> - Creado con <a
href="https://d3js.org/">D3.js</a> Diseño y evaluación de Sistemas Interactivos - Curso 22/23
- Grado en Ingeniería Informática y Estadística - UVa. </p>
</footer>
</body>
</html>
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please to comment