Panels

Views support different panel types for visualizing aggregated data. Panels create interactive visualizations from your data sources and you can configure them with various display options.

Panel Types

Views support the following panel types:

• piechart - Pie chart visualizations for distribution analysis
• table - Tabular data presentations
• number - Single metric displays with units
• gauge - Gauge visualizations with thresholds

Basic Panel Structure

All panels share a common structure. Here's an example from the gauge panel fixture:

gauge.yaml
apiVersion: mission-control.flanksource.com/v1
kind: View
metadata:
  name: gauge
  namespace: mc
spec:
  queries:
    pods:
      configs:
        types:
          - "Kubernetes::Pod"
  panels:
    - name: Pods
      description: Number of Pods
      type: gauge
      gauge:
        min: 0
        max: 100
        thresholds:
          - value: 0
            color: green
          - value: 60
            color: orange
          - value: 90
            color: red
      query: SELECT COUNT(*) AS value FROM pods

Panel Configuration

Pie Chart

Pie charts show data distribution across categories:

piechart.yaml
apiVersion: mission-control.flanksource.com/v1
kind: View
metadata:
  name: piechart
  namespace: mc
spec:
  queries:
    pods:
      configs:
        types:
          - "Kubernetes::Pod"
  panels:
    - name: Health Status
      description: Pods grouped by health
      type: piechart
      piechart:
        showLabels: true
        colors:
          healthy: "#28C19B"
          unhealthy: "#F04E6E"
          warning: "#F4B23C"
          unknown: "#666666"
      query: SELECT COUNT(*) AS count, health FROM pods GROUP BY health

Pie Chart Properties

• showLabels: Display labels on pie slices
• colors: Custom color mapping for categories

Gauge

Gauges display metrics with threshold-based color coding:

gauge.yaml
apiVersion: mission-control.flanksource.com/v1
kind: View
metadata:
  name: gauge
  namespace: mc
spec:
  queries:
    pods:
      configs:
        types:
          - "Kubernetes::Pod"
  panels:
    - name: Pods
      description: Number of Pods
      type: gauge
      gauge:
        min: 0
        max: 100
        thresholds:
          - value: 0
            color: green
          - value: 60
            color: orange
          - value: 90
            color: red
      query: SELECT COUNT(*) AS value FROM pods

Gauge Properties

• min: Minimum value for the gauge
• max: Maximum value for the gauge
• thresholds: Array of threshold objects with value and color

Supported Threshold Colors

• green - Success/healthy state
• yellow - Warning state
• red - Critical/error state
• blue - Info state
• Custom hex colors (e.g., #28C19B)

Number

Number panels display single metrics with units:

number.yaml
apiVersion: mission-control.flanksource.com/v1
kind: View
metadata:
  name: number
  namespace: mc
spec:
  queries:
    services:
      configs:
        types:
          - 'Kubernetes::Service'
        tagSelector: namespace=default
  panels:
    - name: Total Services
      description: Total number of services in the default namespace
      type: number
      query: SELECT COUNT(*) AS value FROM services

Number Properties

• unit: Display unit (e.g., "seconds", "MB", "%")
• precision: Number of decimal places

Table

Tables display aggregated data in rows and columns:

table.yaml
apiVersion: mission-control.flanksource.com/v1
kind: View
metadata:
  name: table
  namespace: mc
spec:
  queries:
    deployments:
      configs:
        types:
          - "Kubernetes::Deployment"
        tagSelector: namespace=default
  panels:
    - name: Deployments by Namespace
      description: List of all the deployments in the default namespace
      type: table
      query: SELECT COUNT(*) AS value, tags->>'namespace' AS namespace FROM deployments GROUP BY tags->'namespace'

Panel Queries

Panels use SQL queries to aggregate data from the view's named queries. Each panel executes its SQL query against the data sources defined in the view's queries section.

Query Structure

Panels reference query names as tables in SQL. Here's how the gauge example works:

gauge.yaml
apiVersion: mission-control.flanksource.com/v1
kind: View
metadata:
  name: gauge
  namespace: mc
spec:
  queries:
    pods:
      configs:
        types:
          - "Kubernetes::Pod"
  panels:
    - name: Pods
      description: Number of Pods
      type: gauge
      gauge:
        min: 0
        max: 100
        thresholds:
          - value: 0
            color: green
          - value: 60
            color: orange
          - value: 90
            color: red
      query: SELECT COUNT(*) AS value FROM pods