Widget de imagen

Documentos > Dashboards > Widgets > Widget de imagen

La widget de imagen te permite integrar una imagen en tu dashboard. Una imagen puede ser un PNG, JPG o GIF animado, alojada en un lugar accesible para la URL.

Configuración

Introduce la URL de tu imagen.
Elige una apariencia:
- Ampliar la imagen para cubrir todo el título
- Ajustar imagen en el cuadro
- Centrar imagen en el cuadro

API

Este widget puede utilizarse con la API de dashboards. Consulta la siguiente tabla para la definición del esquema de widget JSON:

Expand All

Campo

Tipo

Descripción

has_background

boolean

Whether to display a background or not.

default: true

has_border

boolean

Whether to display a border or not.

default: true

horizontal_align

enum

Horizontal alignment. Allowed enum values: center,left,right

margin

enum

Size of the margins around the image. Note: small and large values are deprecated. Allowed enum values: sm,md,lg,small,large

sizing

enum

How to size the image on the widget. The values are based on the image object-fit CSS properties. Note: zoom, fit and center values are deprecated. Allowed enum values: fill,contain,cover,none,scale-down,zoom,fit,center

type [required]

enum

Type of the image widget. Allowed enum values: image

default: image

url [required]

string

URL of the image.

url_dark_theme

string

URL of the image in dark mode.

vertical_align

enum

Vertical alignment. Allowed enum values: center,top,bottom

{
  "has_background": true,
  "has_border": true,
  "horizontal_align": "string",
  "margin": "string",
  "sizing": "string",
  "type": "image",
  "url": "https://example.com/image.png",
  "url_dark_theme": "https://example.com/image-dark-mode.png",
  "vertical_align": "string"
}

Leer más

Más enlaces, artículos y documentación útiles:

Creación de dashboards con JSONDOCUMENTACIÓN