How to make Heatmap bucket width be fixed with Prometheus datasource?

[wing]

I created a heatmap in grafana, I found when I change the time range, the bucket width also changes. I want to make heatmap bucket width be fixed. How to do that?

[example]
1h range

24h range

my panel JSON:

{
  "datasource": null,
  "cards": {
    "cardPadding": null,
    "cardRound": null
  },
  "color": {
    "cardColor": "#b4ff00",
    "colorScale": "sqrt",
    "colorScheme": "interpolateSpectral",
    "exponent": 0.5,
    "mode": "spectrum"
  },
  "dataFormat": "tsbuckets",
  "gridPos": {
    "h": 8,
    "w": 24,
    "x": 0,
    "y": 33
  },
  "heatmap": {},
  "hideZeroBuckets": false,
  "highlightCards": true,
  "id": 93,
  "legend": {
    "show": true
  },
  "options": {},
  "repeat": null,
  "repeatDirection": "h",
  "reverseYBuckets": false,
  "targets": [
    {
      "expr": "sum by (le)(rate(grpc_server_handling_seconds_bucket[$__interval]))",
      "format": "heatmap",
      "intervalFactor": 4,
      "legendFormat": "{{le}}",
      "refId": "B"
    }
  ],
  "timeFrom": null,
  "timeShift": null,
  "title": "thanos store response time [$__interval]",
  "tooltip": {
    "show": true,
    "showHistogram": false
  },
  "type": "heatmap",
  "xAxis": {
    "show": true
  },
  "xBucketNumber": null,
  "xBucketSize": null,
  "yAxis": {
    "decimals": 1,
    "format": "s",
    "logBase": 1,
    "max": null,
    "min": null,
    "show": true,
    "splitFactor": null
  },
  "yBucketBound": "upper",
  "yBucketNumber": null,
  "yBucketSize": null
}

[dieterg]

Not sure if there is a similar thing for your data source, but I’m using elasticsearch and can customize what you want in the query options:

This way my heatmap will always have max 100 elements independent of the selected time range.

[max.zoomin]

It also exists for Prometheus datasource, and compatible… Find the Max data points control under Query options — and set it to a low number. It will be your number of buckets, regardless of time range scale.