Panels | mindzieAPI Documentation

Configure Dashboard Panels

Add, configure, and organize panels within dashboards. Set up visualizations and data sources.

GET /api/

Get Dashboard Panels

Retrieves all panels configured within a specific dashboard including their layout, configuration, and data sources.

Parameters

Parameter	Type	Location	Description
`tenantId`	GUID	Path	The tenant identifier
`projectId`	GUID	Path	The project identifier
`dashboardId`	GUID	Path	The dashboard identifier

Response

{
  "dashboardId": "550e8400-e29b-41d4-a716-446655440000",
  "panels": [
    {
      "panelId": "660e8400-e29b-41d4-a716-446655440001",
      "panelTitle": "Process Performance KPIs",
      "panelType": "metric",
      "position": {
        "x": 0,
        "y": 0,
        "width": 6,
        "height": 4
      },
      "dataSource": {
        "blockId": "770e8400-e29b-41d4-a716-446655440002",
        "blockType": "Calculator"
      },
      "configuration": {
        "chartType": "bar",
        "metrics": ["totalCases", "avgDuration"],
        "refreshInterval": 300
      },
      "isVisible": true,
      "dateCreated": "2024-01-15T10:30:00Z"
    }
  ]
}

POST /api/

Create Dashboard Panel

Creates a new panel within a dashboard with specified configuration, layout position, and data source binding.

Request Body

{
  "panelTitle": "Case Duration Trends",
  "panelType": "chart",
  "position": {
    "x": 6,
    "y": 0,
    "width": 6,
    "height": 6
  },
  "dataSource": {
    "blockId": "880e8400-e29b-41d4-a716-446655440003",
    "blockType": "Calculator"
  },
  "configuration": {
    "chartType": "line",
    "xAxis": "date",
    "yAxis": "duration",
    "refreshInterval": 600
  }
}

Response

Returns 201 Created with the new panel object and Location header pointing to the created resource.

PUT /api/

Update Panel

Updates an existing panel's configuration, position, or data source. Changes take effect immediately on the dashboard.

Request Body

{
  "panelTitle": "Updated Performance Metrics",
  "position": {
    "x": 0,
    "y": 4,
    "width": 12,
    "height": 6
  },
  "configuration": {
    "chartType": "line",
    "refreshInterval": 300
  },
  "isVisible": true
}

Response

Returns the updated panel object with the same structure as the GET endpoint.

DELETE /api/

Delete Panel

Removes a panel from the dashboard. This operation cannot be undone and will immediately remove the panel from the dashboard view.

Response Codes

204 No Content - Panel deleted successfully
404 Not Found - Panel not found or access denied
400 Bad Request - Failed to delete due to dependencies

Panel Types

mindzieStudio supports various panel types for different visualization needs:

Metric Panels

Display key performance indicators and summary statistics.

Single value metrics
Gauge charts
Progress indicators

Chart Panels

Visualize data trends and comparisons.

Line charts for trends
Bar charts for comparisons
Pie charts for distributions

Process Panels

Display process mining specific visualizations.

Process maps
Variant analysis
Performance matrices

Table Panels

Show detailed data in tabular format.

Data tables
Summary tables
Sorted and filtered views

Panel Layout System

Dashboard panels use a grid-based layout system for precise positioning:

Grid System

Grid Units: 12-column grid system
Position: x (0-11), y (auto-calculated)
Size: width (1-12), height (1-20)
Responsive: Automatic scaling on mobile devices

Position Configuration

{
  "position": {
    "x": 0,      // Column position (0-11)
    "y": 0,      // Row position (auto-calculated)
    "width": 6,  // Panel width (1-12 columns)
    "height": 4  // Panel height (1-20 rows)
  }
}

Example: Complete Panel Workflow

This example demonstrates creating, configuring, and managing dashboard panels:

// 1. Get all panels in a dashboard
const getPanels = async (dashboardId) => {
  const response = await fetch(`/api/{tenantId}/{projectId}/dashboard/${dashboardId}/panels`, {
    headers: {
      'Authorization': `Bearer ${token}`
    }
  });

  return await response.json();
};

// 2. Create a new metric panel
const createPanel = async (dashboardId) => {
  const response = await fetch(`/api/{tenantId}/{projectId}/dashboard/${dashboardId}/panel`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Authorization': `Bearer ${token}`
    },
    body: JSON.stringify({
      panelTitle: 'Process KPIs',
      panelType: 'metric',
      position: { x: 0, y: 0, width: 6, height: 4 },
      dataSource: {
        blockId: 'block-guid',
        blockType: 'Calculator'
      },
      configuration: {
        chartType: 'bar',
        metrics: ['totalCases', 'avgDuration'],
        refreshInterval: 300
      }
    })
  });

  return await response.json();
};

// 3. Update panel position
const updatePanel = async (dashboardId, panelId) => {
  const response = await fetch(`/api/{tenantId}/{projectId}/dashboard/${dashboardId}/panel/${panelId}`, {
    method: 'PUT',
    headers: {
      'Content-Type': 'application/json',
      'Authorization': `Bearer ${token}`
    },
    body: JSON.stringify({
      position: { x: 6, y: 0, width: 6, height: 6 },
      configuration: {
        refreshInterval: 600
      }
    })
  });

  return await response.json();
};

Python Example

import requests
import json

class PanelManager:
    def __init__(self, base_url, tenant_id, project_id, token):
        self.base_url = base_url
        self.tenant_id = tenant_id
        self.project_id = project_id
        self.headers = {
            'Authorization': f'Bearer {token}',
            'Content-Type': 'application/json'
        }

    def get_panels(self, dashboard_id):
        """Get all panels in a dashboard"""
        url = f"{self.base_url}/api/{self.tenant_id}/{self.project_id}/dashboard/{dashboard_id}/panels"
        response = requests.get(url, headers=self.headers)
        return response.json()

    def create_panel(self, dashboard_id, title, panel_type, position, data_source, config):
        """Create a new panel"""
        url = f"{self.base_url}/api/{self.tenant_id}/{self.project_id}/dashboard/{dashboard_id}/panel"
        payload = {
            'panelTitle': title,
            'panelType': panel_type,
            'position': position,
            'dataSource': data_source,
            'configuration': config
        }
        response = requests.post(url, json=payload, headers=self.headers)
        return response.json()

    def update_panel(self, dashboard_id, panel_id, **updates):
        """Update panel configuration"""
        url = f"{self.base_url}/api/{self.tenant_id}/{self.project_id}/dashboard/{dashboard_id}/panel/{panel_id}"
        response = requests.put(url, json=updates, headers=self.headers)
        return response.json()

    def delete_panel(self, dashboard_id, panel_id):
        """Delete a panel"""
        url = f"{self.base_url}/api/{self.tenant_id}/{self.project_id}/dashboard/{dashboard_id}/panel/{panel_id}"
        response = requests.delete(url, headers=self.headers)
        return response.status_code == 204

# Usage example
manager = PanelManager(
    'https://your-mindzie-instance.com',
    'tenant-guid',
    'project-guid',
    'your-auth-token'
)

# Create a KPI panel
panel = manager.create_panel(
    'dashboard-guid',
    'Process Performance',
    'metric',
    {'x': 0, 'y': 0, 'width': 6, 'height': 4},
    {'blockId': 'block-guid', 'blockType': 'Calculator'},
    {'chartType': 'bar', 'metrics': ['totalCases'], 'refreshInterval': 300}
)
print(f"Created panel: {panel['panelId']}")