Cómo crear un gráfico de viñetas con el editor de configuración de gráficos

Los gráficos de bala son útiles para mostrar el rendimiento en comparación con un objetivo o el progreso hacia una meta.

Con el Editor de configuración de gráficos, puedes crear gráficos de balas a partir de un gráfico de barras en Looker.

Por ejemplo, el siguiente gráfico de balas compara la medida Recuento de clientes nuevos, representada por una barra de progreso azul, con un valor objetivo de 40, representado por una línea vertical azul. El gráfico también indica buckets de progreso entre 0 y 20, entre 20 y 40, y entre 40 y 80, cada uno representado por un tono de gris diferente.

Requisitos previos

Para acceder al editor de configuración de gráficos, debes tener el permiso can_override_vis_config.

Cómo escribir el fragmento de código JSON

Para crear un gráfico de balas, comienza con el siguiente fragmento de código JSON:

{
  chart: {
    type: 'bullet'
  },
  xAxis: {
    categories: ['New Customers']
  },
  yAxis: {
    plotBands: [{
      from: 0,
      to: 20,
      color: '#666666'
    }, {
      from: 20,
      to: 40,
      color: '#999999'
    }, {
      from: 40,
      to: 80,
      color: '#bbbbbb'
    }],
  },
  series: [{
    data: [{
      target: 40
    }]
  }],
}

Cambia los siguientes valores para que se ajusten a tu caso de uso:

• El atributo xAxis.categories reemplaza la etiqueta del eje X. En este ejemplo, la etiqueta del eje X debe ser el nombre de la métrica Clientes nuevos.
• El atributo yAxis.plotBands especifica el color de fondo del gráfico para ciertos valores. En este ejemplo, el color de fondo es gris oscuro (#666666) entre 0 y 20, gris medio (#999999) entre 20 y 40, y gris claro (#bbbbbb) entre 40 y 80.
• El atributo series.data.target especifica el valor objetivo del gráfico de balas, que aparecerá como una línea vertical. En este ejemplo, el objetivo es 40.

Crea un gráfico de balas

Para crear un gráfico de balas, sigue estos pasos:

1. Ver un gráfico de barras en una Exploración o editar un gráfico de barras en una Vista o un panel

   Para este ejemplo, recomendamos comenzar con un gráfico de barras con una dimensión y una medición, con un límite de una fila. Tu gráfico inicial podría verse como este ejemplo:

   

2. Abre el menú Editar en la visualización.

3. En la pestaña Gráfico, haz clic en el botón Editar configuración del gráfico. Looker muestra el diálogo Edit Chart Config.

4. Selecciona la sección Chart Config (Override) y, luego, ingresa el JSON de HighCharts de la sección Cómo escribir el fragmento de JSON de esta página.

5. Para permitir que Looker formatee correctamente tu JSON, haz clic en <> (Formatear código).

6. Para probar los cambios, haz clic en Vista previa.

7. Para aplicar los cambios, haz clic en Aplicar. La visualización se mostrará con los valores JSON personalizados.

Una vez que hayas personalizado tu visualización, podrás guardarla. Si viste la visualización en una Exploración, guarda la Exploración. Si editaste un Look o un panel, haz clic en Guardar.