Skip to content
Snippets Groups Projects
Select Git revision
  • main default protected
1 result

ventana_analisis.html

Blame
    • Code owners
    Assign users and groups as approvers for specific file changes. Learn more.
    ventana_analisis.html 12.98 KiB 
    <!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

    <title>TFG Víctor Arranz Barcenilla</title>
    <link rel = "stylesheet" type = "text/css" href = "../estilos.css"/>

    <link href='https://unpkg.com/boxicons@2.1.2/css/boxicons.min.css' rel='stylesheet'>
    <script src = "https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src = "../main.js"></script>

  </head>
  <body>


    <div class="container" id = "container_header">
        <h3>
            <span>TFG Víctor Arranz Barcenilla</span>
        </h3>  
        <p></p>
        <h3>
            <span>Análisis de valores</span>
        </h3>
        <a href="/html_files/ayuda.html" class="btn btn-circle" role="button" aria-pressed="true">Ayuda<i class='bx bxs-help-circle'></i></a>
    </div>



    <div class = "col-md-2 sidebar" id = "div_sidebar">
        <div class = "logo_content">
            <div class = "logo_name"><p/></div>
            <img id = "imagen_uva_arriba" src = "/images/logo_uva.png">
            <i class='bx bx-menu' id = "boton_menu"></i>
            <ul class="nav_list">
                <li>
                    <a href = "../index.html">
                        <i class='bx bx-home' ></i>
                        <span class="links_name">Inicio</span>
                    </a>
                    <span class="tooltip">Inicio</span>
                </li>

                <li>
                    <a href = "/html_files/ventana_mercados.html">
                        <i class='bx bx-money' ></i>
                        <span class="links_name">Mercados</span>
                    </a>
                    <span class="tooltip">Mercados</span>


                    <div class = "submenu">
                        <ul>
                            <li>
                                <a href = "/html_files/sp500.html">
                                    <i class='bx bx-line-chart' ></i>
                                    <span class="links_name2">S&P 500</span>
                                </a>
                            </li>

                            <li>
                                <a href = "/html_files/nasdaq100.html">
                                    <i class='bx bx-line-chart' ></i>
                                    <span class="links_name2">NASDAQ 100</span>
                                </a>
                                </li>

                            <li>
                                <a href = "/html_files/ibex35.html">
                                    <i class='bx bx-line-chart' ></i>
                                    <span class="links_name2">IBEX 35</span>
                                </a>
                            </li>

                            <li>
                                <a href = "/html_files/eurostoxx50.html">
                                    <i class='bx bx-line-chart' ></i>
                                    <span class="links_name2">EURO STOXX 50</span>
                                </a>
                            </li>

                            <li>
                                <a href = "/html_files/criptodivisas.html">
                                    <i class='bx bx-bitcoin' ></i>
                                    <span class="links_name2">Criptodivisas</span>
                                </a>
                            </li>

                            <li>
                                <a href = "/html_files/materias.html">
                                    <i class='bx bx-cube' ></i>
                                    <span class="links_name2">Materias primas</span>
                                </a>
                            </li>

                            <li>
                                <a href = "/html_files/divisas.html">
                                    <i class='bx bx-dollar' ></i>
                                    <span class="links_name2">Divisas</span>
                                </a>
                            </li>

                            
                        </ul>
                    </div>


                </li>

                <li>
                    <a href = "/html_files/ventana_analisis.html">
                        <i class='bx bx-candles' ></i>
                        <span class="links_name">Análisis de valores</span>
                    </a>
                    <span class="tooltip">Análisis de valores</span>
                </li>

                <li>
                    <a href = "/html_files/ventana_optimizacion.html">
                        <i class='bx bx-briefcase' ></i>
                        <span class="links_name">Optimización de carteras</span>
                    </a>
                    <span class="tooltip">Optimización de carteras</span>
                </li>


                <li>
                    <a href = "/html_files/ventana_regresion.html">
                        <i class='bx bx-scatter-chart' ></i>
                        <span class="links_name">Regresión de índices</span>
                    </a>
                    <span class="tooltip">Regresión de índices</span>
                </li>

                <li>
                        <a href = "/html_files/ventana_simulacion.html">
                        <i class='bx bx-line-chart' ></i>
                        <span class="links_name">Simulación de carteras</span>
                    </a>
                    <span class="tooltip">Simulación de carteras</span>
                </li>

                <li>
                    <a href = "/html_files/ventana_prediccion.html">
                        <i class='bx bx-network-chart' ></i>
                        <span class="links_name">Modelos de predicción</span>
                    </a>
                    <span class="tooltip">Modelos de predicción</span>
                </li>

                <li>
                    <a href = "/html_files/ventana_clustering.html">
                        <i class='bx bx-grid-alt' ></i>
                        <span class="links_name">Análisis de grupos</span>
                    </a>
                    <span class="tooltip">Análisis de grupos</span>
                </li>

            </ul>
        </div>


    </div>




    <div id = "div_descripcion">
        Esta sección se centra en el análisis descriptivo de valores mostrando distintos gráficos de interés dentro del contexto de la inversión. 
        El gráfico de líneas de la serie temporal de un valor muestra la cotización de un valor y a su vez permite la superposición de la serie de 
        distintos valores en un periodo dado, así como la superposición de distintos indicadores técnicos que ayudan a entender e interpretar dicho gráfico. 
        Los gráficos de velas y de barras muestran información sobre las fluctuaciones en los precios de cierre ajustados de un valor, donde el color 
        verde identifica una subida en el valor del activo y el rojo una bajada. El gráfico de velas incluye también los precios máximo y mínimo y 
        a su vez se acompaña de un gráfico de barras que representa el volumen. El boxplot de rendimientos permite representar la distribución de la 
        serie de rendimientos mostrada en el gráfico anterior. Además de estos gráficos se permite visualizar la serie de rendimientos que muestra la 
        evolución del rendimiento otorgado por un valor en un periodo de tiempo dado. La serie de disminuciones permite representar las variaciones en 
        el valor de un activo al mostrar la rentabilidad total acumulada frente al máximo de la rentabilidad máxima acumulada. 
    </div>

    
    <div id = "ventana_analisis" class = "container-fluid">
        
        <div class = "row m-0">
            <div class = "col-sm-12">
                <div id = "analisis_valores" class = "shiny-table-output">
                    <iframe scrolling = "no" src = "/shiny-apps/analisis_valores/" style = "width: 100%; height: 100%"></iframe>
                </div>
            </div>
        </div>        
    </div>



    <footer class="footer" id = "footer">
        <div class="container">
            <div class="row">
                <div class="text-center py-3">
                    <ul class="list-inline mb-2">

                    </ul>
                    <p class="text-muted small mb-4 mb-lg-0">&copy; TFG Víctor Arranz Barcenilla<br>
                    Ingeniería Informática + Estadística - Universidad de Valladolid</p>
                    <a id = "enlace_proyecto" href = "https://gitlab.inf.uva.es/victarr/tfg_informatica" target = "_blank"><i class='bx bxl-github'>Ver proyecto</i></a>

                </div>
    
            </div>
        </div>
    </footer>



    <script>
        /*Gestion del despliegue y ocultacion del menu lateral*/
        let boton = document.getElementById("boton_menu");
        let sbar = document.getElementById("div_sidebar")
        var div_descr = document.getElementById("div_descripcion");
        var shiny = document.getElementById("analisis_valores");
        var container_h = document.getElementById("container_header");
        var footer = document.getElementById("footer");

        var media = window.matchMedia("screen and (max-width: 700px)");

        if(sessionStorage.getItem("menu") == "abierto" && sbar.className == "col-md-2 sidebar"){

            if(!media.matches){
                sbar.classList.toggle("active");
            }
        }

        if(sessionStorage.getItem("menu") == "cerrado"){
            if(!media.matches){
                div_descr.style.margin = "auto auto auto 5%";
                    div_descr.style.width = "95%";
                    shiny.style.margin = "auto auto auto 5%";
                    shiny.style.width = "95%";
                    container_h.style.width = "90%";
                    container_h.style.margin = "auto auto auto auto";
            }
            else{
                div_descr.style.margin = "auto auto auto 320px";
                div_descr.style.width = "calc(100% - 320px)";
                container_h.style.margin = "auto auto auto calc(300px + 7%)";
                container_h.style.width = "calc(93% - 300px)";
                shiny.style.margin = "auto auto auto 300px";
                shiny.style.width = "calc(100% - 300px)";
                shiny.style.height = "1000px";
                footer.style.margin = "100px auto auto auto";
            }
        }

        boton.onclick = function(){
            sbar.classList.toggle("active");

            if(sbar.className == "col-md-2 sidebar"){
                if(!media.matches){
                    div_descr.style.margin = "auto auto auto 5%";
                    div_descr.style.width = "95%";
                    shiny.style.margin = "auto auto auto 5%";
                    shiny.style.width = "95%";
                    container_h.style.width = "90%";
                    container_h.style.margin = "auto auto auto auto";
                    

                }
                else{
                    div_descr.style.margin = "auto auto 100% 20%";
                    div_descr.style.width = "100%";
                    container_h.style.margin = "10%";
                    container_h.style.width = "100%";
                    shiny.style.margin = "auto auto auto 20%";
                    shiny.style.width = "100%";
                    shiny.style.height = "250%";
                    footer.style.margin = "320% auto";
                }
                }
            else{
                div_descr.style.margin = "auto auto auto 320px";
                div_descr.style.width = "calc(100% - 320px)";
                container_h.style.margin = "auto auto auto calc(300px + 7%)";
                container_h.style.width = "calc(93% - 300px)";
                shiny.style.margin = "auto auto auto 300px";
                shiny.style.width = "calc(100% - 300px)";
                shiny.style.height = "1000px";
                footer.style.margin = "100px auto auto auto";
            }

        }
    </script>










     <!-- Optional JavaScript; choose one of the two! -->

    <!-- Option 1: Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>

    <!-- Option 2: Separate Popper and Bootstrap JS -->
    <!--
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>
    -->
  </body>
</html>