{"id":7084,"date":"2017-11-16T18:02:27","date_gmt":"2017-11-16T21:02:27","guid":{"rendered":"http:\/\/fx2.com.uy\/?p=7084"},"modified":"2021-10-22T09:59:31","modified_gmt":"2021-10-22T12:59:31","slug":"dashboards-una-herramienta-para-gestionar-datos","status":"publish","type":"post","link":"https:\/\/fx2.com.uy\/es\/blog\/dashboards-una-herramienta-para-gestionar-datos\/","title":{"rendered":"Dashboards, una herramienta para gestionar datos"},"content":{"rendered":"<h1>Dashboards, una herramienta para gestionar datos<\/h1>\n<p style=\"text-align: justify;\">En un mundo donde los datos abundan,<strong> las empresas han ido buscado administrar la informaci\u00f3n de la mejor manera posible<\/strong>, para<strong> mantener la eficiencia y crecimiento de su negocio<\/strong>.\u00a0En esa b\u00fasqueda es que ha surgido una herramienta que ha adquirido gran fuerza: los llamados <strong>Tableros de control (o Dashboards).\u00a0<\/strong><\/p>\n<p style=\"text-align: justify;\">Un <strong>Tablero de control<\/strong> es una <strong>interfaz computacional<\/strong> con gr\u00e1ficos, reportes, indicadores\u00a0que son consolidados en una plataforma de informaci\u00f3n con el fin de tener una <strong>visi\u00f3n clara del negocio<\/strong>.<\/p>\n<p style=\"text-align: justify;\">Con los <strong>Tableros de control<\/strong>, las empresas podr\u00e1n <strong>conocer en tiempo real c\u00f3mo se encuentra el negocio<\/strong>, obteniendo <strong>datos que facilitar\u00e1n la toma de decisiones<\/strong>, aumentar\u00e1n la precisi\u00f3n y eliminar\u00e1n las probabilidades de errores.<\/p>\n<p style=\"text-align: justify;\">Seg\u00fan la experiencia y el trabajo de <a href=\"http:\/\/fx2.com.uy\">Fx2<\/a> en soluciones que utilizan Dashboards (<strong><a style=\"color: #3d91d8;\" href=\"http:\/\/fx2.com.uy\/un-proceso-al-rojo-vivo-tambien-se-puede-optimizar\">Conoce nuestro trabajo para la empresa Ternium<\/a><\/strong>), el siguiente post tiene como objetivo contar a\u00a0primera vista qu\u00e9 son los tableros de control, usando ASP.NET MVC y c\u00f3mo se han convertido\u00a0en una importante herramienta para las organizaciones.<\/p>\n<h6 style=\"text-align: center;\"><img loading=\"lazy\" class=\"aligncenter wp-image-14917 size-full\" src=\"https:\/\/fx2.com.uy\/wp-content\/uploads\/2017\/11\/Fig1.png\" alt=\"dashboards\" width=\"1920\" height=\"960\" srcset=\"https:\/\/fx2.com.uy\/es\/wp-content\/uploads\/2017\/11\/Fig1.png 1920w, https:\/\/fx2.com.uy\/es\/wp-content\/uploads\/2017\/11\/Fig1-300x150.png 300w, https:\/\/fx2.com.uy\/es\/wp-content\/uploads\/2017\/11\/Fig1-1024x512.png 1024w, https:\/\/fx2.com.uy\/es\/wp-content\/uploads\/2017\/11\/Fig1-768x384.png 768w, https:\/\/fx2.com.uy\/es\/wp-content\/uploads\/2017\/11\/Fig1-1536x768.png 1536w\" sizes=\"(max-width: 1920px) 100vw, 1920px\" \/><\/h6>\n<h6 style=\"text-align: center;\">Fig. 1: Tablero de commandos con datos ficticios<\/h6>\n<p style=\"text-align: justify;\">Entonces, \u00bfc\u00f3mo aplicamos MVC al desarrollo de tableros?<\/p>\n<ul style=\"text-align: justify;\">\n<li><strong>Modelos<\/strong>: Son los encargados de acceder a los datos sin importar el medio en donde se encuentren. Pueden estar almacenados en una base de datos local, remota, servicio web, etc.<\/li>\n<li><strong>Vistas<\/strong>: En esta parte del esquema se muestra la informaci\u00f3n al usuario mediante gr\u00e1ficas, indicadores, sem\u00e1foros, etc.<\/li>\n<li><strong>Controladores<\/strong>: Son los encargados de procesar los datos y la interacci\u00f3n del usuario. Recibe los datos aportados por el usuario desde las vistas, hace chequeos de los mismos, interact\u00faa con los modelos, y hace de intermediario entre las vistas y modelos.<\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Veremos brevemente cada una de las partes de este esquema. Empecemos con las <strong>Vistas<\/strong><\/p>\n<p style=\"text-align: justify;\">Para el desarrollo de tableros y la presentaci\u00f3n mediante gr\u00e1ficas, una buena opci\u00f3n a utilizar es Highcharts. Nos ofrece diferentes tipos de gr\u00e1ficos, seg\u00fan la necesidad de la situaci\u00f3n, y con muchas opciones de configuraci\u00f3n.<\/p>\n<p><img loading=\"lazy\" class=\" wp-image-7086 aligncenter\" src=\"http:\/\/fx2.com.uy\/wp-content\/uploads\/2017\/11\/Fig2.png\" alt=\"\" width=\"678\" height=\"407\" \/><\/p>\n<h6 style=\"text-align: center;\">Fig. 2: Algunos de los muchos tipos de gr\u00e1ficas que se pueden implementar con Highcharts<\/h6>\n<p style=\"text-align: justify;\">Una de las caracter\u00edsticas de Highcharts es que funciona completamente en JavaScript, tanto la configuraci\u00f3n como la carga de datos. Esta \u00faltima se hace de forma as\u00edncrona mediante AJAX, y es el lazo de conexi\u00f3n entre Vista y Controlador. Cada gr\u00e1fica se alimenta con una llamada AJAX diferente, por lo que, a medida que cada petici\u00f3n se completa, se muestra la gr\u00e1fica correspondiente.<\/p>\n<p><img loading=\"lazy\" class=\" wp-image-7087 aligncenter\" src=\"http:\/\/fx2.com.uy\/wp-content\/uploads\/2017\/11\/Fig3.gif\" alt=\"\" width=\"1133\" height=\"422\" \/><\/p>\n<h6 style=\"text-align: center;\">Fig. 3: Animaci\u00f3n mostrando la carga de graficas<\/h6>\n<p>Luego de cargada la gr\u00e1fica podemos activar\/desactivar series al hacer clic en el nombre de la serie.<\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-7089 aligncenter\" src=\"http:\/\/fx2.com.uy\/wp-content\/uploads\/2017\/11\/Fig4.gif\" alt=\"\" width=\"682\" height=\"304\" \/><\/p>\n<h6 style=\"text-align: center;\">Fig. 4: Animaci\u00f3n mostrando ocultamiento de series<\/h6>\n<p style=\"text-align: justify;\">Otra funcionalidad muy interesante, es la posibilidad de maximizar una gr\u00e1fica para que adopte el espacio total dentro del navegador. De esta forma se puede mejorar la lectura e interpretaci\u00f3n de la gr\u00e1fica, sobre todo, si la gr\u00e1fica posee muchos datos, o cuando el tama\u00f1o de la misma es reducido.<\/p>\n<p style=\"text-align: justify;\">Esta funcionalidad se implement\u00f3 a pedido del cliente y mediante codificaci\u00f3n propia. La llevamos a cabo usando JavaScript, JQuery y CSS.<\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-7088 aligncenter\" src=\"http:\/\/fx2.com.uy\/wp-content\/uploads\/2017\/11\/Fig5.gif\" alt=\"\" width=\"1366\" height=\"598\" \/><\/p>\n<h6 style=\"text-align: center;\">Fig. 5: Animaci\u00f3n mostrando el maximizado de una gr\u00e1fica<\/h6>\n<p><img loading=\"lazy\" class=\"wp-image-7090 aligncenter\" src=\"http:\/\/fx2.com.uy\/wp-content\/uploads\/2017\/11\/Fig6.gif\" alt=\"\" width=\"792\" height=\"347\" \/><\/p>\n<h6 style=\"text-align: center;\">Fig. 6: Animaci\u00f3n mostrando el maximizado de una gr\u00e1fica<\/h6>\n<p style=\"text-align: justify;\">Tambi\u00e9n a pedido del cliente, se ha dividido el tablero en pesta\u00f1as. De esta manera se permite agrupar graficas\/indicadores\/sem\u00e1foros seg\u00fan un tema en com\u00fan, o seg\u00fan una zona geogr\u00e1fica, etc. Cada cliente tiene la posibilidad de personalizar el tablero seg\u00fan su conveniencia para mejorar el impacto y comprensi\u00f3n visual.<\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-7091 aligncenter\" src=\"http:\/\/fx2.com.uy\/wp-content\/uploads\/2017\/11\/Fig7.gif\" alt=\"\" width=\"1366\" height=\"662\" \/><\/p>\n<h6 style=\"text-align: center;\"><\/h6>\n<h6 style=\"text-align: center;\">Fig. 7: Animaci\u00f3n del cambio de pesta\u00f1as<\/h6>\n<p style=\"text-align: justify;\">El siguiente eslab\u00f3n dentro de la estructura MVC es el <strong>Controlador<\/strong>.<\/p>\n<p style=\"text-align: justify;\">El controlador es responsable de las siguientes tareas:<\/p>\n<ul style=\"text-align: justify;\">\n<li>Localizar el m\u00e9todo o acci\u00f3n apropiado para procesar las llamadas AJAX desde las vistas.<\/li>\n<li>Validar que los datos tengan el formato correcto y valores permitidos.<\/li>\n<li>Manejar los posibles errores que puedan ocurrir en el proceso.<\/li>\n<li>Controlar el acceso a cada parte del proceso seg\u00fan los permisos que disponga el usuario.<\/li>\n<li>Se encarga de recibir los datos desde los Modelos, y lo entrega a las Vistas<\/li>\n<li>Si fuera necesario, seg\u00fan la necesidad del cliente o del negocio, el controlador podr\u00eda operar sobre los datos para transformarlos, agruparlos, desagruparlos, o cualquier acci\u00f3n que sea necesaria sobre los mismos, para agregarles valor o mejorar la comprensi\u00f3n sobre ellos.<\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Por \u00faltimo, llegamos al <strong>Modelo<\/strong>, que comprende los elementos que acceden al almac\u00e9n de datos. Desde el controlador se env\u00eda el pedido a un manejador (Handler) quien se encargar\u00e1 de gestionar los siguientes pasos para recuperar los datos.<\/p>\n<p style=\"text-align: justify;\">Luego que el modelo obtiene los datos que se solicitan, los devuelve al controlador. Con este \u00faltimo paso completamos el flujo de informaci\u00f3n desde la vista hacia los datos, y viceversa.<\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-7092 aligncenter\" src=\"http:\/\/fx2.com.uy\/wp-content\/uploads\/2017\/11\/Fig8.png\" alt=\"\" width=\"994\" height=\"308\" \/><\/p>\n<h6 style=\"text-align: center;\"><img loading=\"lazy\" class=\"aligncenter wp-image-14927 size-full\" src=\"https:\/\/fx2.com.uy\/wp-content\/uploads\/2017\/11\/Fig8.png\" alt=\"dashboards\" width=\"994\" height=\"308\" srcset=\"https:\/\/fx2.com.uy\/es\/wp-content\/uploads\/2017\/11\/Fig8.png 994w, https:\/\/fx2.com.uy\/es\/wp-content\/uploads\/2017\/11\/Fig8-300x93.png 300w, https:\/\/fx2.com.uy\/es\/wp-content\/uploads\/2017\/11\/Fig8-768x238.png 768w\" sizes=\"(max-width: 994px) 100vw, 994px\" \/><\/h6>\n<h6 style=\"text-align: center;\">Fig. 8: Modelo MVC y sus relaciones<\/h6>\n<h2>Power BI, una ventana a los datos que de verdad importan<\/h2>\n<p><a href=\"http:\/\/fx2.com.uy\/power-bi-una-ventana-a-los-datos-que-de-verdad-importan\"><strong>Power BI<\/strong><\/a>\u00a0es una herramienta de bussiness intelligence (BI). Consiste en un c<strong>onjunto de estrategias y herramientas enfocadas al an\u00e1lisis de datos existentes de una empresa para facilitar la toma de decisiones.<\/strong><\/p>\n<p>La aplicaci\u00f3n puede ser utilizada tanto en computadoras como en dispositivos m\u00f3viles, de forma online o mediante una herramienta de escritorio. Las posibilidades de uso son realmente numerosas. <a href=\"http:\/\/fx2.com.uy\/power-bi-una-ventana-a-los-datos-que-de-verdad-importan\">Seguir leyendo&#8230;<\/a><\/p>\n<p>Post by Silvio Kucharski, desarrollador de <a href=\"http:\/\/fx2.com.uy\">Fx2<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Dashboards, una herramienta para gestionar datos En un mundo donde los datos abundan, las empresas han ido buscado administrar la informaci\u00f3n de la mejor manera posible, para mantener la eficiencia y crecimiento de su negocio.\u00a0En esa b\u00fasqueda es que ha surgido una herramienta que ha adquirido gran fuerza: los llamados Tableros de control (o Dashboards).\u00a0 [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":7218,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[96],"tags":[264,309],"_links":{"self":[{"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/posts\/7084"}],"collection":[{"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/comments?post=7084"}],"version-history":[{"count":3,"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/posts\/7084\/revisions"}],"predecessor-version":[{"id":14928,"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/posts\/7084\/revisions\/14928"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/media\/7218"}],"wp:attachment":[{"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/media?parent=7084"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/categories?post=7084"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fx2.com.uy\/es\/wp-json\/wp\/v2\/tags?post=7084"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}