Event is not spanned on multiple days in 24h format if start time is greater than end time #14
Description
What happened?
With Grafana 12.2.1 and the Business Calendar plugin 4.2.0, events are not correctly spanned over multiple days when using the 24-hour format and if the start time is greater than the end time.
Example:
What did you expect to happen?
The event 'test_ko' should be spanned over the 2 days, as for 'test_ok' one.
Did this work before?
Not sure.
How do we reproduce it?
-
Create a postgres table:
create table bug_calendar (id serial primary key, name varchar, description varchar, start_ts timestamp, end_ts timestamp); -
Insert sample data:
insert into bug_calendar (name, description, start_ts, end_ts) values ('test_ok', 'description', '2025-10-01 10:00:00.000', '2025-10-02 15:00:00.000'); insert into bug_calendar (name, description, start_ts, end_ts) values ('test_ko', 'description invalid case', '2025-10-01 17:00:00.000', '2025-10-02 15:00:00.000'); -
Create the data source on the postgres database
-
Create the Business Calendar panel based on the following query:
select $__time(start_ts), name, description, end_ts, concat('Duration: ', end_ts - start_ts) as "Duration" from bug_calendar; -
Panel configuration:
- Data = Name
- Start time = time
- End time = end_ts
Note: 'Date & Time format' can be set as English or English 24h, it does not fix the issue.
Is the bug inside a dashboard panel?
| Key | Value |
|---|---|
| Panel | marcusolsson-calendar-panel @ 4.2.0 |
| Grafana | Grafana v12.2.1 (Homebrew) // Open Source |
Panel debug snapshot dashboard
{
"panels": [
{
"id": 2,
"type": "marcusolsson-calendar-panel",
"title": "Reproduced with embedded data",
"gridPos": {
"h": 13,
"w": 15,
"x": 0,
"y": 0
},
"fieldConfig": {
"defaults": {
"mappings": [],
"thresholds": {
"mode": "absolute",
"steps": [
{
"color": "green",
"value": null
},
{
"color": "super-light-yellow",
"value": 5
},
{
"color": "#efefef",
"value": 10
},
{
"color": "blue",
"value": 80
},
{
"color": "red",
"value": 100
}
]
},
"color": {
"mode": "thresholds"
},
"links": []
},
"overrides": []
},
"pluginVersion": "4.2.0",
"targets": [
{
"refId": "A",
"datasource": {
"type": "grafana",
"uid": "grafana"
},
"queryType": "snapshot",
"snapshot": [
{
"schema": {
"refId": "Outscale maintenances",
"meta": {
"typeVersion": [
0,
0
],
"executedQueryString": "select start_ts AS \"time\", name, description, end_ts, concat('Duration: ', end_ts - start_ts) as \"Duration\"\nfrom bug_calendar"
},
"fields": [
{
"name": "time",
"type": "time",
"typeInfo": {
"frame": "time.Time",
"nullable": true
},
"config": {}
},
{
"name": "name",
"type": "string",
"typeInfo": {
"frame": "string",
"nullable": true
},
"config": {}
},
{
"name": "description",
"type": "string",
"typeInfo": {
"frame": "string",
"nullable": true
},
"config": {}
},
{
"name": "end_ts",
"type": "time",
"typeInfo": {
"frame": "time.Time",
"nullable": true
},
"config": {}
},
{
"name": "Duration",
"type": "string",
"typeInfo": {
"frame": "string",
"nullable": true
},
"config": {}
}
]
},
"data": {
"values": [
[
1759312800000,
1759338000000
],
[
"test_ok",
"test_ko"
],
[
"description",
"description invalid case"
],
[
1759417200000,
1759417200000
],
[
"Duration: 1 day 05:00:00",
"Duration: 22:00:00"
]
]
}
}
]
}
],
"datasource": {
"type": "grafana",
"uid": "grafana"
},
"options": {
"scrollToTime": {
"hours": 0,
"minutes": 0
},
"timeRangeType": "default",
"views": [
"week",
"month"
],
"defaultView": "month",
"dateFormat": "en24",
"showMonthTime": true,
"colors": "thresholds",
"quickLinks": true,
"showEventTooltip": true,
"displayFields": [
"description"
],
"preformattedDescription": false,
"locationLabel": "",
"annotations": true,
"annotationsType": "",
"annotationsLimit": 100,
"colorField": "color",
"endTimeField": "end_ts",
"labelFields": [
"emplacement",
"tags",
"Duration"
],
"textField": "name",
"timeField": "time",
"descriptionField": []
}
},
{
"gridPos": {
"h": 7,
"w": 9,
"x": 15,
"y": 0
},
"id": 5,
"options": {
"content": "<table width=\"100%\">\n <tr>\n <th width=\"2%\">Panel</th>\n <td >marcusolsson-calendar-panel @ 4.2.0</td>\n </tr>\n <tr>\n <th>Queries</th>\n <td>Outscale maintenances[grafana-postgresql-datasource]</td>\n </tr>\n \n <tr><th>Data</th><td> 1 frames, 5 fields, 2 rows </td></tr>\n \n <tr>\n <th>Grafana</th>\n <td>Grafana v12.2.1 (Homebrew) // Open Source</td>\n </tr>\n </table>",
"mode": "html"
},
"title": "Debug info",
"type": "text"
},
{
"id": 6,
"title": "Original Panel JSON",
"type": "text",
"gridPos": {
"h": 13,
"w": 9,
"x": 15,
"y": 7
},
"options": {
"content": "{\n \"id\": 4,\n \"type\": \"marcusolsson-calendar-panel\",\n \"title\": \"Calendrier des opérations\",\n \"gridPos\": {\n \"x\": 0,\n \"y\": 25,\n \"h\": 25,\n \"w\": 22\n },\n \"fieldConfig\": {\n \"defaults\": {\n \"mappings\": [],\n \"thresholds\": {\n \"mode\": \"absolute\",\n \"steps\": [\n {\n \"color\": \"green\",\n \"value\": null\n },\n {\n \"color\": \"super-light-yellow\",\n \"value\": 5\n },\n {\n \"color\": \"#efefef\",\n \"value\": 10\n },\n {\n \"color\": \"blue\",\n \"value\": 80\n },\n {\n \"color\": \"red\",\n \"value\": 100\n }\n ]\n },\n \"color\": {\n \"mode\": \"thresholds\"\n },\n \"links\": []\n },\n \"overrides\": []\n },\n \"pluginVersion\": \"4.2.0\",\n \"targets\": [\n {\n \"dataset\": \"calendrier\",\n \"editorMode\": \"code\",\n \"format\": \"table\",\n \"rawQuery\": true,\n \"rawSql\": \"select $__time(start_ts), name, description, end_ts, concat('Duration: ', end_ts - start_ts) as \\\"Duration\\\"\\nfrom bug_calendar\",\n \"refId\": \"Outscale maintenances\",\n \"sql\": {\n \"columns\": [\n {\n \"parameters\": [],\n \"type\": \"function\"\n }\n ],\n \"groupBy\": [\n {\n \"property\": {\n \"type\": \"string\"\n },\n \"type\": \"groupBy\"\n }\n ],\n \"limit\": 50\n },\n \"table\": \"maintenances\"\n }\n ],\n \"datasource\": {\n \"type\": \"grafana-postgresql-datasource\",\n \"uid\": \"af4lzw5ci9zwgd\"\n },\n \"options\": {\n \"scrollToTime\": {\n \"hours\": 0,\n \"minutes\": 0\n },\n \"timeRangeType\": \"default\",\n \"views\": [\n \"week\",\n \"month\"\n ],\n \"defaultView\": \"month\",\n \"dateFormat\": \"en24\",\n \"showMonthTime\": true,\n \"colors\": \"thresholds\",\n \"quickLinks\": true,\n \"showEventTooltip\": true,\n \"displayFields\": [\n \"description\"\n ],\n \"preformattedDescription\": false,\n \"locationLabel\": \"\",\n \"annotations\": true,\n \"annotationsType\": \"\",\n \"annotationsLimit\": 100,\n \"colorField\": \"color\",\n \"endTimeField\": \"end_ts\",\n \"labelFields\": [\n \"emplacement\",\n \"tags\",\n \"Duration\"\n ],\n \"textField\": \"name\",\n \"timeField\": \"time\",\n \"descriptionField\": []\n }\n}",
"mode": "code",
"code": {
"language": "json",
"showLineNumbers": true,
"showMiniMap": true
}
}
},
{
"id": 3,
"title": "Data from panel above",
"type": "table",
"datasource": {
"type": "datasource",
"uid": "-- Dashboard --"
},
"gridPos": {
"h": 7,
"w": 15,
"x": 0,
"y": 13
},
"options": {
"showTypeIcons": true
},
"targets": [
{
"datasource": {
"type": "datasource",
"uid": "-- Dashboard --"
},
"panelId": 2,
"withTransforms": true,
"refId": "A"
}
]
}
],
"schemaVersion": 37,
"title": "Debug: Operations // 2025-11-24 09:22:53",
"tags": [
"debug",
"debug-marcusolsson-calendar-panel"
],
"time": {
"from": "2025-09-30T22:00:00.000Z",
"to": "2025-10-31T22:59:59.999Z"
}
}Environment (with versions)?
Grafana: 12.2.1
OS: MacOS Tahoe 26.1
Browser: Firefox 145.0
Grafana platform?
A downloaded binary
Datasource(s)?
Grafana 12.2.1 / Business Calendar plugin 4.2.0