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

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?

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

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.