En Modux queremos que tus tableros sean únicos, por eso esta vez, nuestro Analytics Ace Daniel Jiménez nos enseñará algunos trucos con elementos web con los que podremos personalizar nuestros Dashboards.

En este artículo aprenderas:

• La mejor forma de usar imágenes publicadas en línea, en su propio Dashboard. Por defecto Tableau, nos permite utilizar imágenes guardadas en nuestro computador, pero no imágenes disponibles en la web.
• Ajustar el tamaño de la imagen al tamaño del elemento web. Cuando una imagen es insertada usando un elemento web, en Tableau Desktop el tamaño de la imagen se autoajusta, sin embargo al publicarlo en Tableau Server/Online, este tamaño no se ajusta.
• Asignar una URL de destino a las imágenes.

En el siguiente video podrá ver ambas situaciones, donde la imagen se inserto por medio de un elemento web, y la solución que usted aprenderá en el siguiente artículo.

Use imagenes de internet en Tableau

En un Dashboard, es posible introducir imágenes que están en la web, por ejemplo, una imagen en la página web de su empresa, o en algún lugar de la nube, simplemente introduciendo la url de la imagen en un objeto web:

Sin embargo, cuando publicamos el libro de trabajo que contiene una de estas imágenes (Tableau Server/Online), esta no se ajusta, observe en el siguiente Dashboard publicado, como la imagen no se ajusta, tiene unas barras deslizantes, además, tampoco es posible elegir un color de fondo para esta (para ajustar los espacios).

A continuación te enseñaremos a publicar una imagen como la Imagen Modux, la cual se ajusta a su Dashboard y además te permite elegir un fondo, todo esto, acompañado de una acción que te permitirá cambiar la imagen a través de una Acción Web y abrir un hipervínculo. En los primeros pasos ilustraremos la opción por defecto de Tableau, y luego la opción mejorada:

Paso 1: Cree un parámetro con las siguientes opciones: Tipo Booleano:

Crea un archivo, donde incluya tres columna: (1). El nombre de la Imagen, (2). la URL donde está disponible, (3). La URL donde quiere que la imagen redireccione a las personas al hacer click.

Paso 2: Conéctese a este archivo mediante Tableau, y cree la siguiente hoja:

Paso 3: Cree un Dashboard, lleve la hoja1, y luego, arrastre un elemento de Página Web, de click en aceptar sin escribir nada.

Paso 4: En la parte superior, de click en Dashboard, acciones.

Paso 5: Añada una acción de ir a la url y configúrela de la siguiente forma:

Paso 6: Complete la acción URL, ejecutando la acción en Selección, en el campo URL se colocó el campo URL Image y en la parte inferior se escogió la opción “Objeto de página web” y se seleccionó el elemento Web.

Luego de esto, al hacer click en algún cuadro, se desplegará la imagen correspondiente en el objeto web. Estos pasos que acabamos de seguir explican como crear una acción URL, y en este caso aplicarla para desplegar una imagen. Sin embargo, esta opción, en Tableau Server/Online no ajustaría el tamaño de la imagen al Objeto Web. Los siguientes pasos muestran nuestra opción creada para ustedes.

Paso 7: Esta acción es un poco mas compleja, ya que utilizaremos una página web creada por Diego Martinez, que nos da la capacidad de personalizar la forma en que se comporta la imagen. Esta página web nos permitirá insertar la imagen, hacer el ajuste del tamaño de esta al elemento web, escoger el color de fondo y reenviar a una URL al usuario si hace clic en la imagen. Esta página web tiene cuatro parámetros:

• img Este parámetro es la URL de la imagen web
• link Opcional. Este parámetro enviará al usuario a un link al dar click en la imagen.
• color Opcional. Con este parámetro, podremos escoger el color de fondo de la imagen.
• target Opcional. Con este parámetro podrás definir si el link se abre en la misma pestaña o en una nueva.

Paso 8: Algunos links de ejemplo sobre usos válidos de esta página son:

• Apertura del link en la misma pestaña: https://difemaro.github.io/Demo/Resize.htm?img=https://community.tableau.com/profilephoto/7294T000000csAV/M&link=https://www.modux.co/&color=white
• Apertura del link en una pestaña nueva con fondo negro: https://difemaro.github.io/Demo/Resize.htm?img=https://community.tableau.com/profilephoto/7294T000000csAV/M&link=https://www.modux.co/&color=black&target=new
• Imagen sin link fondo negro: https://difemaro.github.io/Demo/Resize.htm?img=https://community.tableau.com/profilephoto/7294T000000csAV/M&color=black”
• Imagen con el fondo predeterminado del navegador, sin link: https://difemaro.github.io/Demo/Resize.htm?img=https://community.tableau.com/profilephoto/7294T000000csAV/M”

Para este caso, vamos a añadir un nuevo elemento web debajo del que ya habíamos utilizado y vamos a crear la siguiente acción URL (Noté que el objeto URL al que aplica la acción, es el segundo que acabamos de insertar):

Conozca algunas de las configuraciones

Y listo, ya podrás tener a tu alcance un Dashboard hecho a tu medida, que te permitirá añadir interactividad a sus análisis. Si requiere acompañamiento, o quiere descargar el libro de trabajo, llene la siguiente forma:

Conoce más acerca de esta plantilla llenando la siguiente forma que te llevará a un video Nombre * Email * Compañía * Teléfono * Acepto ser contactado por Modux y la política de protección y uso de datos * Acepto Name Enviar Al llenar esta forma, está aceptando nuestra política de uso de datos: Política de datos