[v9.0.x] Heatmap: Sync main and 9.0.1 heatmap-new (#51136)

2022-06-20 20:52:11 -07:00
parent 1922ff6756
commit 2e14e277a9
20 changed files with 865 additions and 552 deletions
@@ -13,22 +13,17 @@ export enum DataFrameType {
  DirectoryListing = 'directory-listing',
  /**
-   * First field is X, the rest are bucket values
+   * First field is X, the rest are ordinal values used as rows in the heatmap
   */
-  HeatmapBuckets = 'heatmap-buckets',
+  HeatmapRows = 'heatmap-rows',
  /**
   * Explicit fields for:
   *  xMin, yMin, count, ...
   *
   * All values in the grid exist and have regular spacing
   */
  HeatmapScanlines = 'heatmap-scanlines',
  /**
   *  WIP sparse heatmap support
   *
-   *  @private
+   * If the y value is actually ordinal, use `meta.custom` to specify the bucket lookup values
   */
-  HeatmapSparse = 'heatmap-cells-sparse',
+  HeatmapCells = 'heatmap-cells',
 }
@@ -429,7 +429,7 @@ func readMatrixOrVectorWide(iter *jsoniter.Iterator, resultType string) *backend
 			histogram.yMin.Labels = valueField.Labels
 			frame := data.NewFrame(valueField.Name, histogram.time, histogram.yMin, histogram.yMax, histogram.count, histogram.yLayout)
 			frame.Meta = &data.FrameMeta{
-				Type: "heatmap-cells-sparse",
+				Type: "heatmap-cells",
 			}
 			if frame.Name == data.TimeSeriesValueFieldName {
 				frame.Name = "" // only set the name if useful
@@ -535,7 +535,7 @@ func readMatrixOrVectorMulti(iter *jsoniter.Iterator, resultType string) *backen
 			histogram.yMin.Labels = valueField.Labels
 			frame := data.NewFrame(valueField.Name, histogram.time, histogram.yMin, histogram.yMax, histogram.count, histogram.yLayout)
 			frame.Meta = &data.FrameMeta{
-				Type: "heatmap-cells-sparse",
+				Type: "heatmap-cells",
 			}
 			if frame.Name == data.TimeSeriesValueFieldName {
 				frame.Name = "" // only set the name if useful
@@ -1,9 +1,9 @@
 //  🌟 This was machine generated.  Do not edit. 🌟
-//  
+//
 //  Frame[0] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 932 Rows
 //  +-------------------------------+------------------------+------------------------+--------------------+---------------+
 //  | Name: xMax                    | Name: yMin             | Name: yMax             | Name: count        | Name: yLayout |
@@ -21,15 +21,15 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 9.07293025972535e-06   | 9.894100606163098e-06  | 3.712286008031362  | 0             |
 //  | ...                           | ...                    | ...                    | ...                | ...           |
 //  +-------------------------------+------------------------+------------------------+--------------------+---------------+
-//  
+//
-//  
+//
 //  🌟 This was machine generated.  Do not edit. 🌟
 {
  "frames": [
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1,9 +1,9 @@
 //  🌟 This was machine generated.  Do not edit. 🌟
-//  
+//
 //  Frame[0] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 932 Rows
 //  +-------------------------------+------------------------+------------------------+--------------------+---------------+
 //  | Name: xMax                    | Name: yMin             | Name: yMax             | Name: count        | Name: yLayout |
@@ -21,15 +21,15 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 9.07293025972535e-06   | 9.894100606163098e-06  | 3.712286008031362  | 0             |
 //  | ...                           | ...                    | ...                    | ...                | ...           |
 //  +-------------------------------+------------------------+------------------------+--------------------+---------------+
-//  
+//
-//  
+//
 //  🌟 This was machine generated.  Do not edit. 🌟
 {
  "frames": [
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1,9 +1,9 @@
 //  🌟 This was machine generated.  Do not edit. 🌟
-//  
+//
 //  Frame[0] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+--------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                                   | Name: yMax      | Name: count     | Name: yLayout |
@@ -11,13 +11,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                              | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+--------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+--------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[1] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+---------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                                    | Name: yMax      | Name: count     | Name: yLayout |
@@ -25,13 +25,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                               | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+---------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+---------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[2] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+--------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                             | Name: yMax      | Name: count     | Name: yLayout |
@@ -39,13 +39,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                        | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+--------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+--------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[3] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                  | Name: yMax      | Name: count     | Name: yLayout |
@@ -53,13 +53,13 @@
 //  | Type: []time.Time | Type: []float64                                                                             | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[4] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+-----------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                    | Name: yMax      | Name: count     | Name: yLayout |
@@ -67,13 +67,13 @@
 //  | Type: []time.Time | Type: []float64                                                                               | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+-----------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+-----------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[5] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+--------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                 | Name: yMax      | Name: count     | Name: yLayout |
@@ -81,13 +81,13 @@
 //  | Type: []time.Time | Type: []float64                                                                            | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+--------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+--------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[6] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                           | Name: yMax      | Name: count     | Name: yLayout |
@@ -95,13 +95,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                      | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[7] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+--------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                       | Name: yMax      | Name: count     | Name: yLayout |
@@ -109,13 +109,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                  | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+--------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+--------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[8] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 1 Rows
 //  +-------------------------------+--------------------------------------------------------------------------------------------+----------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                 | Name: yMax           | Name: count          | Name: yLayout |
@@ -124,13 +124,13 @@
 //  +-------------------------------+--------------------------------------------------------------------------------------------+----------------------+----------------------+---------------+
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.05255602595335715                                                                        | 0.057312752700291944 | 0.003508784241348215 | 0             |
 //  +-------------------------------+--------------------------------------------------------------------------------------------+----------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[9] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                  | Name: yMax      | Name: count     | Name: yLayout |
@@ -138,13 +138,13 @@
 //  | Type: []time.Time | Type: []float64                                                                             | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[10] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 426 Rows
 //  +-------------------------------+------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                         | Name: yMax            | Name: count           | Name: yLayout |
@@ -162,13 +162,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.002762135864009951                                                               | 0.0030121305183748843 | 0.30175469375429953   | 0             |
 //  | ...                           | ...                                                                                | ...                   | ...                   | ...           |
 //  +-------------------------------+------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[11] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 1 Rows
 //  +-------------------------------+-------------------------------------------------------------------------------------+--------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                          | Name: yMax         | Name: count           | Name: yLayout |
@@ -177,13 +177,13 @@
 //  +-------------------------------+-------------------------------------------------------------------------------------+--------------------+-----------------------+---------------+
 //  | 2022-04-14 19:08:20 +0000 UTC | 1                                                                                   | 1.0905077326652577 | 0.0035087596183873042 | 0             |
 //  +-------------------------------+-------------------------------------------------------------------------------------+--------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[12] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 6 Rows
 //  +-------------------------------+-----------------------------------------------------------------------------------+--------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                        | Name: yMax         | Name: count          | Name: yLayout |
@@ -197,13 +197,13 @@
 //  | 2022-04-14 19:13:20 +0000 UTC | 0.8408964152537144                                                                | 0.9170040432046711 | 0.003508771929824561 | 0             |
 //  | 2022-04-14 19:13:20 +0000 UTC | 1                                                                                 | 1.0905077326652577 | 0.003508771929824561 | 0             |
 //  +-------------------------------+-----------------------------------------------------------------------------------+--------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[13] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 269 Rows
 //  +-------------------------------+---------------------------------------------------------------------------+------------------------+--------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                | Name: yMax             | Name: count        | Name: yLayout |
@@ -221,13 +221,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 9.07293025972535e-06                                                      | 9.894100606163098e-06  | 3.533338799658994  | 0             |
 //  | ...                           | ...                                                                       | ...                    | ...                | ...           |
 //  +-------------------------------+---------------------------------------------------------------------------+------------------------+--------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[14] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 303 Rows
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                                      | Name: yMax            | Name: count          | Name: yLayout |
@@ -245,13 +245,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.005065779510355506                                                                                            | 0.005524271728019902  | 0.06666662973235489  | 0             |
 //  | ...                           | ...                                                                                                             | ...                   | ...                  | ...           |
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[15] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 56 Rows
 //  +-------------------------------+------------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                           | Name: yMax            | Name: count           | Name: yLayout |
@@ -269,13 +269,13 @@
 //  | 2022-04-14 19:10:00 +0000 UTC | 0.005524271728019902                                                                                 | 0.0060242610367497685 | 0.00713925            | 0             |
 //  | ...                           | ...                                                                                                  | ...                   | ...                   | ...           |
 //  +-------------------------------+------------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[16] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 41 Rows
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                          | Name: yMax            | Name: count           | Name: yLayout |
@@ -293,13 +293,13 @@
 //  | 2022-04-14 19:10:00 +0000 UTC | 0.0060242610367497685                                                                               | 0.006569503244169644  | 0.0035300277777777778 | 0             |
 //  | ...                           | ...                                                                                                 | ...                   | ...                   | ...           |
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[17] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 29 Rows
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------------+----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                                | Name: yMax           | Name: count           | Name: yLayout |
@@ -317,13 +317,13 @@
 //  | 2022-04-14 19:11:40 +0000 UTC | 0.04052623608284405                                                                                       | 0.044194173824159216 | 0.003508771929824561  | 0             |
 //  | ...                           | ...                                                                                                       | ...                  | ...                   | ...           |
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------------+----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[18] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 38 Rows
 //  +-------------------------------+------------------------------------------------------------------------------------------------------+----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                           | Name: yMax           | Name: count           | Name: yLayout |
@@ -341,13 +341,13 @@
 //  | 2022-04-14 19:11:40 +0000 UTC | 0.0060242610367497685                                                                                | 0.006569503244169644 | 0.003508771929824561  | 0             |
 //  | ...                           | ...                                                                                                  | ...                  | ...                   | ...           |
 //  +-------------------------------+------------------------------------------------------------------------------------------------------+----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[19] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 195 Rows
 //  +-------------------------------+---------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                  | Name: yMax            | Name: count          | Name: yLayout |
@@ -365,13 +365,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.0021298979153618314                                                                       | 0.0023226701464896895 | 0.07368416128056675  | 0             |
 //  | ...                           | ...                                                                                         | ...                   | ...                  | ...           |
 //  +-------------------------------+---------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[20] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 261 Rows
 //  +-------------------------------+-------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                | Name: yMax            | Name: count           | Name: yLayout |
@@ -389,13 +389,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.0009765625                                                                              | 0.0010649489576809157 | 0.03508765774105932   | 0             |
 //  | ...                           | ...                                                                                       | ...                   | ...                   | ...           |
 //  +-------------------------------+-------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[21] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 176 Rows
 //  +-------------------------------+-------------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                            | Name: yMax            | Name: count           | Name: yLayout |
@@ -413,13 +413,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.009290680585958758                                                                                  | 0.010131559020711013  | 0.003508771929824561  | 0             |
 //  | ...                           | ...                                                                                                   | ...                   | ...                   | ...           |
 //  +-------------------------------+-------------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[22] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 255 Rows
 //  +-------------------------------+-------------------------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                                  | Name: yMax            | Name: count          | Name: yLayout |
@@ -437,13 +437,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.04052623608284405                                                                                         | 0.044194173824159216  | 0                    | 0             |
 //  | ...                           | ...                                                                                                         | ...                   | ...                  | ...           |
 //  +-------------------------------+-------------------------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[23] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 167 Rows
 //  +-------------------------------+------------------------------------------------------------------------------------+------------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                         | Name: yMax             | Name: count           | Name: yLayout |
@@ -461,15 +461,15 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 1.1766134837401892e-05                                                             | 1.2831061023768835e-05 | 0.1578945767934209    | 0             |
 //  | ...                           | ...                                                                                | ...                    | ...                   | ...           |
 //  +-------------------------------+------------------------------------------------------------------------------------+------------------------+-----------------------+---------------+
-//  
+//
-//  
+//
 //  🌟 This was machine generated.  Do not edit. 🌟
 {
  "frames": [
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -527,7 +527,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -585,7 +585,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -643,7 +643,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -701,7 +701,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -759,7 +759,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -817,7 +817,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -875,7 +875,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -933,7 +933,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1001,7 +1001,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1059,7 +1059,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -3252,7 +3252,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -3320,7 +3320,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -3413,7 +3413,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -4821,7 +4821,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -6399,7 +6399,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -6742,7 +6742,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -7010,7 +7010,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -7218,7 +7218,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -7471,7 +7471,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -8509,7 +8509,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -9877,7 +9877,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -10820,7 +10820,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -12158,7 +12158,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1,9 +1,9 @@
 //  🌟 This was machine generated.  Do not edit. 🌟
-//  
+//
 //  Frame[0] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+--------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                                   | Name: yMax      | Name: count     | Name: yLayout |
@@ -11,13 +11,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                              | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+--------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+--------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[1] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+---------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                                    | Name: yMax      | Name: count     | Name: yLayout |
@@ -25,13 +25,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                               | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+---------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+---------------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[2] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+--------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                             | Name: yMax      | Name: count     | Name: yLayout |
@@ -39,13 +39,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                        | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+--------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+--------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[3] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                  | Name: yMax      | Name: count     | Name: yLayout |
@@ -53,13 +53,13 @@
 //  | Type: []time.Time | Type: []float64                                                                             | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[4] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+-----------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                    | Name: yMax      | Name: count     | Name: yLayout |
@@ -67,13 +67,13 @@
 //  | Type: []time.Time | Type: []float64                                                                               | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+-----------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+-----------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[5] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+--------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                 | Name: yMax      | Name: count     | Name: yLayout |
@@ -81,13 +81,13 @@
 //  | Type: []time.Time | Type: []float64                                                                            | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+--------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+--------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[6] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                           | Name: yMax      | Name: count     | Name: yLayout |
@@ -95,13 +95,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                      | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+------------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[7] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+--------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                       | Name: yMax      | Name: count     | Name: yLayout |
@@ -109,13 +109,13 @@
 //  | Type: []time.Time | Type: []float64                                                                                  | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+--------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+--------------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[8] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 1 Rows
 //  +-------------------------------+--------------------------------------------------------------------------------------------+----------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                 | Name: yMax           | Name: count          | Name: yLayout |
@@ -124,13 +124,13 @@
 //  +-------------------------------+--------------------------------------------------------------------------------------------+----------------------+----------------------+---------------+
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.05255602595335715                                                                        | 0.057312752700291944 | 0.003508784241348215 | 0             |
 //  +-------------------------------+--------------------------------------------------------------------------------------------+----------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[9] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 0 Rows
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  | Name: xMax        | Name: yMin                                                                                  | Name: yMax      | Name: count     | Name: yLayout |
@@ -138,13 +138,13 @@
 //  | Type: []time.Time | Type: []float64                                                                             | Type: []float64 | Type: []float64 | Type: []int8  |
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
 //  +-------------------+---------------------------------------------------------------------------------------------+-----------------+-----------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[10] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 426 Rows
 //  +-------------------------------+------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                         | Name: yMax            | Name: count           | Name: yLayout |
@@ -162,13 +162,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.002762135864009951                                                               | 0.0030121305183748843 | 0.30175469375429953   | 0             |
 //  | ...                           | ...                                                                                | ...                   | ...                   | ...           |
 //  +-------------------------------+------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[11] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 1 Rows
 //  +-------------------------------+-------------------------------------------------------------------------------------+--------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                          | Name: yMax         | Name: count           | Name: yLayout |
@@ -177,13 +177,13 @@
 //  +-------------------------------+-------------------------------------------------------------------------------------+--------------------+-----------------------+---------------+
 //  | 2022-04-14 19:08:20 +0000 UTC | 1                                                                                   | 1.0905077326652577 | 0.0035087596183873042 | 0             |
 //  +-------------------------------+-------------------------------------------------------------------------------------+--------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[12] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 6 Rows
 //  +-------------------------------+-----------------------------------------------------------------------------------+--------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                        | Name: yMax         | Name: count          | Name: yLayout |
@@ -197,13 +197,13 @@
 //  | 2022-04-14 19:13:20 +0000 UTC | 0.8408964152537144                                                                | 0.9170040432046711 | 0.003508771929824561 | 0             |
 //  | 2022-04-14 19:13:20 +0000 UTC | 1                                                                                 | 1.0905077326652577 | 0.003508771929824561 | 0             |
 //  +-------------------------------+-----------------------------------------------------------------------------------+--------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[13] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 269 Rows
 //  +-------------------------------+---------------------------------------------------------------------------+------------------------+--------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                | Name: yMax             | Name: count        | Name: yLayout |
@@ -221,13 +221,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 9.07293025972535e-06                                                      | 9.894100606163098e-06  | 3.533338799658994  | 0             |
 //  | ...                           | ...                                                                       | ...                    | ...                | ...           |
 //  +-------------------------------+---------------------------------------------------------------------------+------------------------+--------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[14] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 303 Rows
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                                      | Name: yMax            | Name: count          | Name: yLayout |
@@ -245,13 +245,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.005065779510355506                                                                                            | 0.005524271728019902  | 0.06666662973235489  | 0             |
 //  | ...                           | ...                                                                                                             | ...                   | ...                  | ...           |
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[15] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 56 Rows
 //  +-------------------------------+------------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                           | Name: yMax            | Name: count           | Name: yLayout |
@@ -269,13 +269,13 @@
 //  | 2022-04-14 19:10:00 +0000 UTC | 0.005524271728019902                                                                                 | 0.0060242610367497685 | 0.00713925            | 0             |
 //  | ...                           | ...                                                                                                  | ...                   | ...                   | ...           |
 //  +-------------------------------+------------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[16] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 41 Rows
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                          | Name: yMax            | Name: count           | Name: yLayout |
@@ -293,13 +293,13 @@
 //  | 2022-04-14 19:10:00 +0000 UTC | 0.0060242610367497685                                                                               | 0.006569503244169644  | 0.0035300277777777778 | 0             |
 //  | ...                           | ...                                                                                                 | ...                   | ...                   | ...           |
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[17] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 29 Rows
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------------+----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                                | Name: yMax           | Name: count           | Name: yLayout |
@@ -317,13 +317,13 @@
 //  | 2022-04-14 19:11:40 +0000 UTC | 0.04052623608284405                                                                                       | 0.044194173824159216 | 0.003508771929824561  | 0             |
 //  | ...                           | ...                                                                                                       | ...                  | ...                   | ...           |
 //  +-------------------------------+-----------------------------------------------------------------------------------------------------------+----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[18] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 38 Rows
 //  +-------------------------------+------------------------------------------------------------------------------------------------------+----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                           | Name: yMax           | Name: count           | Name: yLayout |
@@ -341,13 +341,13 @@
 //  | 2022-04-14 19:11:40 +0000 UTC | 0.0060242610367497685                                                                                | 0.006569503244169644 | 0.003508771929824561  | 0             |
 //  | ...                           | ...                                                                                                  | ...                  | ...                   | ...           |
 //  +-------------------------------+------------------------------------------------------------------------------------------------------+----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[19] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 195 Rows
 //  +-------------------------------+---------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                  | Name: yMax            | Name: count          | Name: yLayout |
@@ -365,13 +365,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.0021298979153618314                                                                       | 0.0023226701464896895 | 0.07368416128056675  | 0             |
 //  | ...                           | ...                                                                                         | ...                   | ...                  | ...           |
 //  +-------------------------------+---------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[20] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 261 Rows
 //  +-------------------------------+-------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                | Name: yMax            | Name: count           | Name: yLayout |
@@ -389,13 +389,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.0009765625                                                                              | 0.0010649489576809157 | 0.03508765774105932   | 0             |
 //  | ...                           | ...                                                                                       | ...                   | ...                   | ...           |
 //  +-------------------------------+-------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[21] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 176 Rows
 //  +-------------------------------+-------------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                            | Name: yMax            | Name: count           | Name: yLayout |
@@ -413,13 +413,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.009290680585958758                                                                                  | 0.010131559020711013  | 0.003508771929824561  | 0             |
 //  | ...                           | ...                                                                                                   | ...                   | ...                   | ...           |
 //  +-------------------------------+-------------------------------------------------------------------------------------------------------+-----------------------+-----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[22] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 255 Rows
 //  +-------------------------------+-------------------------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                                                  | Name: yMax            | Name: count          | Name: yLayout |
@@ -437,13 +437,13 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 0.04052623608284405                                                                                         | 0.044194173824159216  | 0                    | 0             |
 //  | ...                           | ...                                                                                                         | ...                   | ...                  | ...           |
 //  +-------------------------------+-------------------------------------------------------------------------------------------------------------+-----------------------+----------------------+---------------+
-//  
+//
-//  
+//
-//  
+//
 //  Frame[23] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 167 Rows
 //  +-------------------------------+------------------------------------------------------------------------------------+------------------------+-----------------------+---------------+
 //  | Name: xMax                    | Name: yMin                                                                         | Name: yMax             | Name: count           | Name: yLayout |
@@ -461,15 +461,15 @@
 //  | 2022-04-14 19:08:20 +0000 UTC | 1.1766134837401892e-05                                                             | 1.2831061023768835e-05 | 0.1578945767934209    | 0             |
 //  | ...                           | ...                                                                                | ...                    | ...                   | ...           |
 //  +-------------------------------+------------------------------------------------------------------------------------+------------------------+-----------------------+---------------+
-//  
+//
-//  
+//
 //  🌟 This was machine generated.  Do not edit. 🌟
 {
  "frames": [
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -527,7 +527,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -585,7 +585,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -643,7 +643,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -701,7 +701,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -759,7 +759,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -817,7 +817,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -875,7 +875,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -933,7 +933,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1001,7 +1001,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1059,7 +1059,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -3252,7 +3252,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -3320,7 +3320,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -3413,7 +3413,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -4821,7 +4821,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -6399,7 +6399,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -6742,7 +6742,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -7010,7 +7010,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -7218,7 +7218,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -7471,7 +7471,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -8509,7 +8509,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -9877,7 +9877,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -10820,7 +10820,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -12158,7 +12158,7 @@
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1,9 +1,9 @@
 //  🌟 This was machine generated.  Do not edit. 🌟
-//  
+//
 //  Frame[0] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 134 Rows
 //  +-----------------------------------+------------------------+------------------------+---------------------+---------------+
 //  | Name: xMax                        | Name: yMin             | Name: yMax             | Name: count         | Name: yLayout |
@@ -21,15 +21,15 @@
 //  | 2022-04-14 20:21:08.042 +0000 UTC | 9.07293025972535e-06   | 9.894100606163098e-06  | 3.392982456140351   | 0             |
 //  | ...                               | ...                    | ...                    | ...                 | ...           |
 //  +-----------------------------------+------------------------+------------------------+---------------------+---------------+
-//  
+//
-//  
+//
 //  🌟 This was machine generated.  Do not edit. 🌟
 {
  "frames": [
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1,9 +1,9 @@
 //  🌟 This was machine generated.  Do not edit. 🌟
-//  
+//
 //  Frame[0] {
-//      "type": "heatmap-cells-sparse"
+//      "type": "heatmap-cells"
 //  }
-//  Name: 
+//  Name:
 //  Dimensions: 5 Fields by 134 Rows
 //  +-----------------------------------+------------------------+------------------------+---------------------+---------------+
 //  | Name: xMax                        | Name: yMin             | Name: yMax             | Name: count         | Name: yLayout |
@@ -21,15 +21,15 @@
 //  | 2022-04-14 20:21:08.042 +0000 UTC | 9.07293025972535e-06   | 9.894100606163098e-06  | 3.392982456140351   | 0             |
 //  | ...                               | ...                    | ...                    | ...                 | ...           |
 //  +-----------------------------------+------------------------+------------------------+---------------------+---------------+
-//  
+//
-//  
+//
 //  🌟 This was machine generated.  Do not edit. 🌟
 {
  "frames": [
    {
      "schema": {
        "meta": {
-          "type": "heatmap-cells-sparse"
+          "type": "heatmap-cells"
        },
        "fields": [
          {
@@ -1,7 +1,7 @@
 import { FieldType } from '@grafana/data';
 import { toDataFrame } from '@grafana/data/src/dataframe/processDataFrame';
-import { bucketsToScanlines, calculateHeatmapFromData } from './heatmap';
+import { rowsToCellsHeatmap, calculateHeatmapFromData } from './heatmap';
 import { HeatmapCalculationOptions } from './models.gen';
 describe('Heatmap transformer', () => {
@@ -58,7 +58,7 @@ describe('Heatmap transformer', () => {
      ],
    });
-    const heatmap = bucketsToScanlines({ frame, value: 'Speed' });
+    const heatmap = rowsToCellsHeatmap({ frame, value: 'Speed' });
    expect(heatmap.fields.map((f) => ({ name: f.name, type: f.type, config: f.config }))).toMatchInlineSnapshot(`
      Array [
        Object {
@@ -92,7 +92,7 @@ describe('Heatmap transformer', () => {
            "C",
          ],
        },
-        "type": "heatmap-scanlines",
+        "type": "heatmap-cells",
      }
    `);
    expect(heatmap.fields[1].values.toArray()).toMatchInlineSnapshot(`
@@ -11,10 +11,14 @@ import {
  DataFrameType,
  getFieldDisplayName,
  Field,
  getValueFormat,
  formattedValueToString,
  durationToMilliseconds,
  parseDuration,
 } from '@grafana/data';
 import { ScaleDistribution } from '@grafana/schema';
-import { HeatmapBucketLayout, HeatmapCalculationMode, HeatmapCalculationOptions } from './models.gen';
+import { HeatmapCellLayout, HeatmapCalculationMode, HeatmapCalculationOptions } from './models.gen';
 import { niceLinearIncrs, niceTimeIncrs } from './utils';
 export interface HeatmapTransformerOptions extends HeatmapCalculationOptions {
@@ -49,27 +53,50 @@ export function sortAscStrInf(aName?: string | null, bName?: string | null) {
  return parseNumeric(aName) - parseNumeric(bName);
 }
-export interface HeatmapScanlinesCustomMeta {
+export interface HeatmapRowsCustomMeta {
  /** This provides the lookup values */
  yOrdinalDisplay: string[];
  yOrdinalLabel?: string[];
  yMatchWithLabel?: string;
  yMinDisplay?: string;
 }
 /** simple utility to get heatmap metadata from a frame */
-export function readHeatmapScanlinesCustomMeta(frame?: DataFrame): HeatmapScanlinesCustomMeta {
+export function readHeatmapRowsCustomMeta(frame?: DataFrame): HeatmapRowsCustomMeta {
-  return (frame?.meta?.custom ?? {}) as HeatmapScanlinesCustomMeta;
+  return (frame?.meta?.custom ?? {}) as HeatmapRowsCustomMeta;
 }
-export interface BucketsOptions {
+export function isHeatmapCellsDense(frame: DataFrame) {
  let foundY = false;
  for (let field of frame.fields) {
    // dense heatmap frames can only have one of these fields
    switch (field.name) {
      case 'y':
      case 'yMin':
      case 'yMax':
        if (foundY) {
          return false;
        }
        foundY = true;
    }
  }
  return foundY;
 }
 export interface RowsHeatmapOptions {
  frame: DataFrame;
  value?: string; // the field value name
-  layout?: HeatmapBucketLayout;
+  unit?: string;
  decimals?: number;
  layout?: HeatmapCellLayout;
 }
 /** Given existing buckets, create a values style frame */
 // Assumes frames have already been sorted ASC and de-accumulated.
-export function bucketsToScanlines(opts: BucketsOptions): DataFrame {
+export function rowsToCellsHeatmap(opts: RowsHeatmapOptions): DataFrame {
  // TODO: handle null-filling w/ fields[0].config.interval?
  const xField = opts.frame.fields[0];
  const xValues = xField.values.toArray();
@@ -106,29 +133,51 @@ export function bucketsToScanlines(opts: BucketsOptions): DataFrame {
  // this name determines whether cells are drawn above, below, or centered on the values
  let ordinalFieldName = yFields[0].labels?.le != null ? 'yMax' : 'y';
  switch (opts.layout) {
-    case HeatmapBucketLayout.le:
+    case HeatmapCellLayout.le:
      ordinalFieldName = 'yMax';
      break;
-    case HeatmapBucketLayout.ge:
+    case HeatmapCellLayout.ge:
      ordinalFieldName = 'yMin';
      break;
-    case HeatmapBucketLayout.unknown:
+    case HeatmapCellLayout.unknown:
      ordinalFieldName = 'y';
      break;
  }
-  const custom: HeatmapScanlinesCustomMeta = {
+  const custom: HeatmapRowsCustomMeta = {
    yOrdinalDisplay: yFields.map((f) => getFieldDisplayName(f, opts.frame)),
    yMatchWithLabel: Object.keys(yFields[0].labels ?? {})[0],
  };
  if (custom.yMatchWithLabel) {
    custom.yOrdinalLabel = yFields.map((f) => f.labels?.[custom.yMatchWithLabel!] ?? '');
    if (custom.yMatchWithLabel === 'le') {
      custom.yMinDisplay = '0.0';
    }
  }
  // Format the labels as a value
  // TODO: this leaves the internally prepended '0.0' without this formatting treatment
  if (opts.unit?.length || opts.decimals != null) {
    const fmt = getValueFormat(opts.unit ?? 'short');
    if (custom.yMinDisplay) {
      custom.yMinDisplay = formattedValueToString(fmt(0, opts.decimals));
    }
    custom.yOrdinalDisplay = custom.yOrdinalDisplay.map((name) => {
      let num = +name;
      if (!Number.isNaN(num)) {
        return formattedValueToString(fmt(num, opts.decimals));
      }
      return name;
    });
  }
  return {
    length: xs.length,
    refId: opts.frame.refId,
    meta: {
-      type: DataFrameType.HeatmapScanlines,
+      type: DataFrameType.HeatmapCells,
      custom,
    },
    fields: [
@@ -247,11 +296,12 @@ export function calculateHeatmapFromData(frames: DataFrame[], options: HeatmapCa
  const scaleDistribution = options.yBuckets?.scale ?? {
    type: ScaleDistribution.Linear,
  };
  const heat2d = heatmap(xs, ys, {
    xSorted: true,
    xTime: xField.type === FieldType.time,
    xMode: xBucketsCfg.mode,
-    xSize: xBucketsCfg.value ? +xBucketsCfg.value : undefined,
+    xSize: durationToMilliseconds(parseDuration(xBucketsCfg.value ?? '')),
    yMode: yBucketsCfg.mode,
    ySize: yBucketsCfg.value ? +yBucketsCfg.value : undefined,
    yLog: scaleDistribution?.type === ScaleDistribution.Log ? (scaleDistribution?.log as any) : undefined,
@@ -261,7 +311,7 @@ export function calculateHeatmapFromData(frames: DataFrame[], options: HeatmapCa
    length: heat2d.x.length,
    name: getFieldDisplayName(yField),
    meta: {
-      type: DataFrameType.HeatmapScanlines,
+      type: DataFrameType.HeatmapCells,
    },
    fields: [
      {
@@ -293,9 +343,6 @@ export function calculateHeatmapFromData(frames: DataFrame[], options: HeatmapCa
  };
  //console.timeEnd('calculateHeatmapFromData');
  //console.log({ tiles: frame.length });
  return frame;
 }
@@ -5,7 +5,7 @@ export enum HeatmapCalculationMode {
  Count = 'count',
 }
-export const enum HeatmapBucketLayout {
+export const enum HeatmapCellLayout {
  le = 'le',
  ge = 'ge',
  unknown = 'unknown', // unknown
@@ -558,7 +558,7 @@ function mergeHeatmapFrames(frames: DataFrame[]): DataFrame[] {
      ...frames[0],
      meta: {
        ...frames[0].meta,
-        type: DataFrameType.HeatmapBuckets,
+        type: DataFrameType.HeatmapRows,
      },
      fields: [timeField!, ...countFields],
    },
@@ -1,10 +1,10 @@
-import React, { useEffect, useRef } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { DataFrameType, Field, FieldType, formattedValueToString, getFieldDisplayName, LinkModel } from '@grafana/data';
 import { LinkButton, VerticalGroup } from '@grafana/ui';
 import { getDashboardSrv } from 'app/features/dashboard/services/DashboardSrv';
-import { readHeatmapScanlinesCustomMeta } from 'app/features/transformers/calculateHeatmap/heatmap';
+import { isHeatmapCellsDense, readHeatmapRowsCustomMeta } from 'app/features/transformers/calculateHeatmap/heatmap';
-import { HeatmapBucketLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
+import { HeatmapCellLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
 import { DataHoverView } from '../geomap/components/DataHoverView';
@@ -47,14 +47,14 @@ const HeatmapHoverCell = ({ data, hover, showHistogram }: Props) => {
  const countVals = countField?.values.toArray();
  // labeled buckets
-  const meta = readHeatmapScanlinesCustomMeta(data.heatmap);
+  const meta = readHeatmapRowsCustomMeta(data.heatmap);
  const yDispSrc = meta.yOrdinalDisplay ?? yVals;
  const yDisp = yField?.display ? (v: any) => formattedValueToString(yField.display!(v)) : (v: any) => `${v}`;
  const yValueIdx = index % data.yBucketCount! ?? 0;
-  const yMinIdx = data.yLayout === HeatmapBucketLayout.le ? yValueIdx - 1 : yValueIdx;
+  const yMinIdx = data.yLayout === HeatmapCellLayout.le ? yValueIdx - 1 : yValueIdx;
-  const yMaxIdx = data.yLayout === HeatmapBucketLayout.le ? yValueIdx : yValueIdx + 1;
+  const yMaxIdx = data.yLayout === HeatmapCellLayout.le ? yValueIdx : yValueIdx + 1;
  const yBucketMin = yDispSrc?.[yMinIdx];
  const yBucketMax = yDispSrc?.[yMaxIdx];
@@ -154,7 +154,11 @@ const HeatmapHoverCell = ({ data, hover, showHistogram }: Props) => {
    [index]
  );
-  if (data.heatmap?.meta?.type === DataFrameType.HeatmapSparse) {
+  const [isSparse] = useState(
    () => data.heatmap?.meta?.type === DataFrameType.HeatmapCells && !isHeatmapCellsDense(data.heatmap)
  );
  if (isSparse) {
    return (
      <div>
        <DataHoverView data={data.heatmap} rowIndex={index} />
@@ -164,7 +168,7 @@ const HeatmapHoverCell = ({ data, hover, showHistogram }: Props) => {
  const renderYBuckets = () => {
    switch (data.yLayout) {
-      case HeatmapBucketLayout.unknown:
+      case HeatmapCellLayout.unknown:
        return <div>{yDisp(yBucketMin)}</div>;
    }
    return (
@@ -1,13 +1,14 @@
 import { css } from '@emotion/css';
 import React, { useCallback, useMemo, useRef, useState } from 'react';
-import { DataFrameType, GrafanaTheme2, PanelProps, reduceField, ReducerID, TimeRange } from '@grafana/data';
+import { DataFrameType, GrafanaTheme2, PanelProps, TimeRange } from '@grafana/data';
 import { PanelDataErrorView } from '@grafana/runtime';
 import { ScaleDistributionConfig } from '@grafana/schema';
 import {
  Portal,
  ScaleDistribution,
  UPlotChart,
  usePanelContext,
  useStyles2,
  useTheme2,
  VizLayout,
@@ -15,7 +16,7 @@ import {
 } from '@grafana/ui';
 import { CloseButton } from 'app/core/components/CloseButton/CloseButton';
 import { ColorScale } from 'app/core/components/ColorScale/ColorScale';
-import { readHeatmapScanlinesCustomMeta } from 'app/features/transformers/calculateHeatmap/heatmap';
+import { isHeatmapCellsDense, readHeatmapRowsCustomMeta } from 'app/features/transformers/calculateHeatmap/heatmap';
 import { HeatmapHoverView } from './HeatmapHoverView';
 import { prepareHeatmapData } from './fields';
@@ -34,11 +35,13 @@ export const HeatmapPanel: React.FC<HeatmapPanelProps> = ({
  height,
  options,
  fieldConfig,
  eventBus,
  onChangeTimeRange,
  replaceVariables,
 }) => {
  const theme = useTheme2();
  const styles = useStyles2(getStyles);
  const { sync } = usePanelContext();
  // ugh
  let timeRangeRef = useRef<TimeRange>(timeRange);
@@ -56,7 +59,7 @@ export const HeatmapPanel: React.FC<HeatmapPanelProps> = ({
    let exemplarsXFacet: number[] = []; // "Time" field
    let exemplarsyFacet: number[] = [];
-    const meta = readHeatmapScanlinesCustomMeta(info.heatmap);
+    const meta = readHeatmapRowsCustomMeta(info.heatmap);
    if (info.exemplars?.length && meta.yMatchWithLabel) {
      exemplarsXFacet = info.exemplars?.fields[0].values.toArray();
@@ -113,6 +116,7 @@ export const HeatmapPanel: React.FC<HeatmapPanelProps> = ({
    return prepConfig({
      dataRef,
      theme,
      eventBus,
      onhover: onhover,
      onclick: options.tooltip.show ? onclick : null,
      onzoom: (evt) => {
@@ -124,12 +128,11 @@ export const HeatmapPanel: React.FC<HeatmapPanelProps> = ({
      isToolTipOpen,
      timeZone,
      getTimeRange: () => timeRangeRef.current,
      sync,
      palette,
      cellGap: options.cellGap,
      hideLE: options.filterValues?.le,
      hideGE: options.filterValues?.ge,
      valueMin: options.color.min,
      valueMax: options.color.max,
      exemplarColor: options.exemplars?.color ?? 'rgba(255,0,255,0.7)',
      yAxisConfig: options.yAxis,
      ySizeDivisor: scaleConfig?.type === ScaleDistribution.Log ? +(options.calculation?.yBuckets?.value || 1) : 1,
@@ -143,21 +146,10 @@ export const HeatmapPanel: React.FC<HeatmapPanelProps> = ({
    }
    let heatmapType = dataRef.current?.heatmap?.meta?.type;
-    let countFieldIdx = heatmapType === DataFrameType.HeatmapScanlines ? 2 : 3;
+    let isSparseHeatmap = heatmapType === DataFrameType.HeatmapCells && !isHeatmapCellsDense(dataRef.current?.heatmap!);
    let countFieldIdx = !isSparseHeatmap ? 2 : 3;
    const countField = info.heatmap.fields[countFieldIdx];
    // TODO -- better would be to get the range from the real color scale!
    let { min, max } = options.color;
    if (min == null || max == null) {
      const calc = reduceField({ field: countField, reducers: [ReducerID.min, ReducerID.max] });
      if (min == null) {
        min = calc[ReducerID.min];
      }
      if (max == null) {
        max = calc[ReducerID.max];
      }
    }
    let hoverValue: number | undefined = undefined;
    // seriesIdx: 1 is heatmap layer; 2 is exemplar layer
    if (hover && info.heatmap.fields && hover.seriesIdx === 1) {
@@ -167,7 +159,13 @@ export const HeatmapPanel: React.FC<HeatmapPanelProps> = ({
    return (
      <VizLayout.Legend placement="bottom" maxHeight="20%">
        <div className={styles.colorScaleWrapper}>
-          <ColorScale hoverValue={hoverValue} colorPalette={palette} min={min!} max={max!} display={info.display} />
+          <ColorScale
            hoverValue={hoverValue}
            colorPalette={palette}
            min={dataRef.current.minValue!}
            max={dataRef.current.maxValue!}
            display={info.display}
          />
        </div>
      </VizLayout.Legend>
    );
@@ -1,17 +1,25 @@
 import {
  DataFrame,
  DataFrameType,
  Field,
  FieldType,
  formattedValueToString,
  getDisplayProcessor,
  getValueFormat,
  GrafanaTheme2,
  outerJoinDataFrames,
  PanelData,
  ValueFormatter,
 } from '@grafana/data';
-import { calculateHeatmapFromData, bucketsToScanlines } from 'app/features/transformers/calculateHeatmap/heatmap';
+import {
-import { HeatmapBucketLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
+  calculateHeatmapFromData,
  isHeatmapCellsDense,
  readHeatmapRowsCustomMeta,
  rowsToCellsHeatmap,
 } from 'app/features/transformers/calculateHeatmap/heatmap';
 import { HeatmapCellLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
-import { PanelOptions } from './models.gen';
+import { CellValues, PanelOptions } from './models.gen';
 import { boundedMinMax } from './utils';
 export interface HeatmapData {
  heatmap?: DataFrame; // data we will render
@@ -24,8 +32,12 @@ export interface HeatmapData {
  xBucketCount?: number;
  yBucketCount?: number;
-  xLayout?: HeatmapBucketLayout;
+  xLayout?: HeatmapCellLayout;
-  yLayout?: HeatmapBucketLayout;
+  yLayout?: HeatmapCellLayout;
  // color scale range
  minValue?: number;
  maxValue?: number;
  // Print a heatmap cell value
  display?: (v: number) => string;
@@ -43,63 +55,92 @@ export function prepareHeatmapData(data: PanelData, options: PanelOptions, theme
  const exemplars = data.annotations?.find((f) => f.name === 'exemplar');
  if (options.calculate) {
-    // TODO, check for error etc
+    return getDenseHeatmapData(calculateHeatmapFromData(frames, options.calculation ?? {}), exemplars, options, theme);
    return getHeatmapData(calculateHeatmapFromData(frames, options.calculation ?? {}), exemplars, theme);
  }
  // Check for known heatmap types
-  let bucketHeatmap: DataFrame | undefined = undefined;
+  let rowsHeatmap: DataFrame | undefined = undefined;
  for (const frame of frames) {
    switch (frame.meta?.type) {
-      case DataFrameType.HeatmapSparse:
+      case DataFrameType.HeatmapCells:
-        return getSparseHeatmapData(frame, exemplars, theme);
+        return isHeatmapCellsDense(frame)
          ? getDenseHeatmapData(frame, exemplars, options, theme)
          : getSparseHeatmapData(frame, exemplars, options, theme);
-      case DataFrameType.HeatmapScanlines:
+      case DataFrameType.HeatmapRows:
-        return getHeatmapData(frame, exemplars, theme);
+        rowsHeatmap = frame; // the default format
      case DataFrameType.HeatmapBuckets:
        bucketHeatmap = frame; // the default format
    }
  }
  // Everything past here assumes a field for each row in the heatmap (buckets)
-  if (!bucketHeatmap) {
+  if (!rowsHeatmap) {
    if (frames.length > 1) {
-      bucketHeatmap = [
+      rowsHeatmap = [
        outerJoinDataFrames({
          frames,
        })!,
      ][0];
    } else {
-      bucketHeatmap = frames[0];
+      rowsHeatmap = frames[0];
    }
  }
-  return getHeatmapData(bucketsToScanlines({ ...options.bucketFrame, frame: bucketHeatmap }), exemplars, theme);
+  return getDenseHeatmapData(
    rowsToCellsHeatmap({
      unit: options.yAxis?.unit, // used to format the ordinal lookup values
      decimals: options.yAxis?.decimals,
      ...options.rowsFrame,
      frame: rowsHeatmap,
    }),
    exemplars,
    options,
    theme
  );
 }
 const getSparseHeatmapData = (
  frame: DataFrame,
  exemplars: DataFrame | undefined,
  options: PanelOptions,
  theme: GrafanaTheme2
 ): HeatmapData => {
-  if (frame.meta?.type !== DataFrameType.HeatmapSparse) {
+  if (frame.meta?.type !== DataFrameType.HeatmapCells || isHeatmapCellsDense(frame)) {
    return {
      warning: 'Expected sparse heatmap format',
      heatmap: frame,
    };
  }
-  const disp = frame.fields[3].display ?? getValueFormat('short');
+  // y axis tick label display
  updateFieldDisplay(frame.fields[1], options.yAxis, theme);
  // cell value display
  const disp = updateFieldDisplay(frame.fields[3], options.cellValues, theme);
  let [minValue, maxValue] = boundedMinMax(
    frame.fields[3].values.toArray(),
    options.color.min,
    options.color.max,
    options.filterValues?.le,
    options.filterValues?.ge
  );
  return {
    heatmap: frame,
    minValue,
    maxValue,
    exemplars,
    display: (v) => formattedValueToString(disp(v)),
  };
 };
-const getHeatmapData = (frame: DataFrame, exemplars: DataFrame | undefined, theme: GrafanaTheme2): HeatmapData => {
+const getDenseHeatmapData = (
-  if (frame.meta?.type !== DataFrameType.HeatmapScanlines) {
+  frame: DataFrame,
  exemplars: DataFrame | undefined,
  options: PanelOptions,
  theme: GrafanaTheme2
 ): HeatmapData => {
  if (frame.meta?.type !== DataFrameType.HeatmapCells) {
    return {
      warning: 'Expected heatmap scanlines format',
      heatmap: frame,
@@ -110,11 +151,54 @@ const getHeatmapData = (frame: DataFrame, exemplars: DataFrame | undefined, them
    return { heatmap: frame };
  }
-  // Y field values (display is used in the axis)
+  const meta = readHeatmapRowsCustomMeta(frame);
-  if (!frame.fields[1].display) {
+  let xName: string | undefined = undefined;
-    frame.fields[1].display = getDisplayProcessor({ field: frame.fields[1], theme });
+  let yName: string | undefined = undefined;
  let valueField: Field | undefined = undefined;
  // validate field display properties
  for (const field of frame.fields) {
    switch (field.name) {
      case 'y':
        yName = field.name;
      case 'yMin':
      case 'yMax': {
        if (!yName) {
          yName = field.name;
        }
        if (meta.yOrdinalDisplay == null) {
          updateFieldDisplay(field, options.yAxis, theme);
        }
        break;
      }
      case 'x':
      case 'xMin':
      case 'xMax':
        xName = field.name;
        break;
      default: {
        if (field.type === FieldType.number && !valueField) {
          valueField = field;
        }
      }
    }
  }
  if (!yName) {
    return { warning: 'Missing Y field', heatmap: frame };
  }
  if (!yName) {
    return { warning: 'Missing X field', heatmap: frame };
  }
  if (!valueField) {
    return { warning: 'Missing value field', heatmap: frame };
  }
  const disp = updateFieldDisplay(valueField, options.cellValues, theme);
  // infer bucket sizes from data (for now)
  // the 'heatmap-scanlines' dense frame format looks like:
  // x:      1,1,1,1,2,2,2,2
@@ -132,10 +216,13 @@ const getHeatmapData = (frame: DataFrame, exemplars: DataFrame | undefined, them
  let yBinIncr = ys[1] - ys[0];
  let xBinIncr = xs[yBinQty] - xs[0];
-  // The "count" field
+  let [minValue, maxValue] = boundedMinMax(
-  const disp = frame.fields[2].display ?? getValueFormat('short');
+    valueField.values.toArray(),
-  const xName = frame.fields[0].name;
+    options.color.min,
-  const yName = frame.fields[1].name;
+    options.color.max,
    options.filterValues?.le,
    options.filterValues?.ge
  );
  const data: HeatmapData = {
    heatmap: frame,
@@ -145,22 +232,35 @@ const getHeatmapData = (frame: DataFrame, exemplars: DataFrame | undefined, them
    xBucketCount: xBinQty,
    yBucketCount: yBinQty,
    minValue,
    maxValue,
    // TODO: improve heuristic
    xLayout:
-      xName === 'xMax'
+      xName === 'xMax' ? HeatmapCellLayout.le : xName === 'xMin' ? HeatmapCellLayout.ge : HeatmapCellLayout.unknown,
        ? HeatmapBucketLayout.le
        : xName === 'xMin'
        ? HeatmapBucketLayout.ge
        : HeatmapBucketLayout.unknown,
    yLayout:
-      yName === 'yMax'
+      yName === 'yMax' ? HeatmapCellLayout.le : yName === 'yMin' ? HeatmapCellLayout.ge : HeatmapCellLayout.unknown,
        ? HeatmapBucketLayout.le
        : yName === 'yMin'
        ? HeatmapBucketLayout.ge
        : HeatmapBucketLayout.unknown,
    display: (v) => formattedValueToString(disp(v)),
  };
  return data;
 };
 function updateFieldDisplay(field: Field, opts: CellValues | undefined, theme: GrafanaTheme2): ValueFormatter {
  if (opts?.unit?.length || opts?.decimals != null) {
    const { unit, decimals } = opts;
    field.display = undefined;
    field.config = { ...field.config };
    if (unit?.length) {
      field.config.unit = unit;
    }
    if (decimals != null) {
      field.config.decimals = decimals;
    }
  }
  if (!field.display) {
    field.display = getDisplayProcessor({ field, theme });
  }
  return field.display;
 }
@@ -21,16 +21,10 @@ describe('Heatmap Migrations', () => {
    expect(panel).toMatchInlineSnapshot(`
      Object {
        "fieldConfig": Object {
-          "defaults": Object {
+          "defaults": Object {},
            "decimals": 6,
            "unit": "short",
          },
          "overrides": Array [],
        },
        "options": Object {
          "bucketFrame": Object {
            "layout": "auto",
          },
          "calculate": true,
          "calculation": Object {
            "xBuckets": Object {
@@ -48,6 +42,9 @@ describe('Heatmap Migrations', () => {
          },
          "cellGap": 2,
          "cellRadius": 10,
          "cellValues": Object {
            "decimals": undefined,
          },
          "color": Object {
            "exponent": 0.5,
            "fill": "dark-orange",
@@ -67,6 +64,9 @@ describe('Heatmap Migrations', () => {
          "legend": Object {
            "show": true,
          },
          "rowsFrame": Object {
            "layout": "auto",
          },
          "showValue": "never",
          "tooltip": Object {
            "show": true,
@@ -75,9 +75,11 @@ describe('Heatmap Migrations', () => {
          "yAxis": Object {
            "axisPlacement": "left",
            "axisWidth": 400,
            "decimals": 6,
            "max": 22,
            "min": 7,
            "reverse": false,
            "unit": "short",
          },
        },
      }
@@ -1,7 +1,7 @@
 import { FieldConfigSource, PanelModel, PanelTypeChangedHandler } from '@grafana/data';
 import { AxisPlacement, ScaleDistribution, VisibilityMode } from '@grafana/schema';
 import {
-  HeatmapBucketLayout,
+  HeatmapCellLayout,
  HeatmapCalculationMode,
  HeatmapCalculationOptions,
 } from 'app/features/transformers/calculateHeatmap/models.gen';
@@ -9,6 +9,15 @@ import {
 import { PanelOptions, defaultPanelOptions, HeatmapColorMode } from './models.gen';
 import { colorSchemes } from './palettes';
 /** Called when the version number changes */
 export const heatmapMigrationHandler = (panel: PanelModel): Partial<PanelOptions> => {
  // Migrating from angular
  if (Object.keys(panel.options).length === 0) {
    return heatmapChangedHandler(panel, 'heatmap', { angular: panel }, panel.fieldConfig);
  }
  return panel.options;
 };
 /**
 * This is called when the panel changes from another panel
 */
@@ -21,6 +30,14 @@ export const heatmapChangedHandler: PanelTypeChangedHandler = (panel, prevPlugin
    panel.fieldConfig = fieldConfig; // Mutates the incoming panel
    return options;
  }
  // alpha for 8.5+, then beta at 9.0.1
  if (prevPluginId === 'heatmap-new') {
    const { bucketFrame, ...options } = panel.options;
    if (bucketFrame) {
      return { ...options, rowsFrame: bucketFrame };
    }
    return panel.options;
  }
  return {};
 };
@@ -60,9 +77,6 @@ export function angularToReactHeatmap(angular: any): { fieldConfig: FieldConfigS
        },
      };
    }
    fieldConfig.defaults.unit = oldYAxis.format;
    fieldConfig.defaults.decimals = oldYAxis.decimals;
  }
  const options: PanelOptions = {
@@ -77,12 +91,17 @@ export function angularToReactHeatmap(angular: any): { fieldConfig: FieldConfigS
    yAxis: {
      axisPlacement: oldYAxis.show === false ? AxisPlacement.Hidden : AxisPlacement.Left,
      reverse: Boolean(angular.reverseYBuckets),
-      axisWidth: oldYAxis.width ? +oldYAxis.width : undefined,
+      axisWidth: asNumber(oldYAxis.width),
      min: oldYAxis.min,
      max: oldYAxis.max,
      unit: oldYAxis.format,
      decimals: oldYAxis.decimals,
    },
-    bucketFrame: {
+    cellValues: {
-      layout: getHeatmapBucketLayout(angular.yBucketBound),
+      decimals: asNumber(angular.tooltipDecimals),
    },
    rowsFrame: {
      layout: getHeatmapCellLayout(angular.yBucketBound),
    },
    legend: {
      show: Boolean(angular.legend.show),
@@ -127,16 +146,16 @@ export function angularToReactHeatmap(angular: any): { fieldConfig: FieldConfigS
  return { fieldConfig, options };
 }
-function getHeatmapBucketLayout(v?: string): HeatmapBucketLayout {
+function getHeatmapCellLayout(v?: string): HeatmapCellLayout {
  switch (v) {
    case 'upper':
-      return HeatmapBucketLayout.ge;
+      return HeatmapCellLayout.ge;
    case 'lower':
-      return HeatmapBucketLayout.le;
+      return HeatmapCellLayout.le;
    case 'middle':
-      return HeatmapBucketLayout.unknown;
+      return HeatmapCellLayout.unknown;
  }
-  return HeatmapBucketLayout.auto;
+  return HeatmapCellLayout.auto;
 }
 function asNumber(v: any, defaultValue?: number): number | undefined {
@@ -146,11 +165,3 @@ function asNumber(v: any, defaultValue?: number): number | undefined {
  const num = +v;
  return isNaN(num) ? defaultValue : num;
 }
 export const heatmapMigrationHandler = (panel: PanelModel): Partial<PanelOptions> => {
  // Migrating from angular
  if (!panel.pluginVersion && Object.keys(panel.options).length === 0) {
    return heatmapChangedHandler(panel, 'heatmap', { angular: panel }, panel.fieldConfig);
  }
  return panel.options;
 };
@@ -4,7 +4,7 @@
 //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 import { AxisConfig, AxisPlacement, HideableFieldConfig, ScaleDistributionConfig, VisibilityMode } from '@grafana/schema';
-import { HeatmapBucketLayout, HeatmapCalculationOptions } from 'app/features/transformers/calculateHeatmap/models.gen';
+import { HeatmapCellLayout, HeatmapCalculationOptions } from 'app/features/transformers/calculateHeatmap/models.gen';
 export const modelVersion = Object.freeze([1, 0]);
@@ -39,6 +39,11 @@ export interface YAxisConfig extends AxisConfig {
  max?: number;
 }
 export interface CellValues {
  unit?: string;
  decimals?: number;
 }
 export interface FilterValueRange {
  le?: number;
  ge?: number;
@@ -56,9 +61,9 @@ export interface ExemplarConfig {
  color: string;
 }
-export interface BucketFrameOptions {
+export interface RowsHeatmapOptions {
  value?: string; // value field name
-  layout?: HeatmapBucketLayout;
+  layout?: HeatmapCellLayout;
 }
 export interface PanelOptions {
@@ -67,13 +72,15 @@ export interface PanelOptions {
  color: HeatmapColorOptions;
  filterValues?: FilterValueRange; // was hideZeroBuckets
-  bucketFrame?: BucketFrameOptions;
+  rowsFrame?: RowsHeatmapOptions;
  showValue: VisibilityMode;
  cellGap?: number; // was cardPadding
  cellRadius?: number; // was cardRadius (not used, but migrated from angular)
-
+  cellValues?: CellValues;
  yAxis: YAxisConfig;
  legend: HeatmapLegend;
  tooltip: HeatmapTooltip;
@@ -90,11 +97,14 @@ export const defaultPanelOptions: PanelOptions = {
    exponent: 0.5,
    steps: 64,
  },
-  bucketFrame: {
+  rowsFrame: {
-    layout: HeatmapBucketLayout.auto,
+    layout: HeatmapCellLayout.auto,
  },
  yAxis: {
    axisPlacement: AxisPlacement.Left,
  },
  cellValues: {
  },
  showValue: VisibilityMode.Auto,
  tooltip: {
@@ -1,14 +1,16 @@
 import React from 'react';
-import { FieldConfigProperty, FieldType, identityOverrideProcessor, PanelPlugin } from '@grafana/data';
+import { FieldConfigProperty, FieldType, identityOverrideProcessor, PanelData, PanelPlugin } from '@grafana/data';
 import { config } from '@grafana/runtime';
 import { AxisPlacement, GraphFieldConfig, ScaleDistribution, ScaleDistributionConfig } from '@grafana/schema';
 import { addHideFrom, ScaleDistributionEditor } from '@grafana/ui/src/options/builder';
 import { ColorScale } from 'app/core/components/ColorScale/ColorScale';
 import { addHeatmapCalculationOptions } from 'app/features/transformers/calculateHeatmap/editor/helper';
-import { HeatmapBucketLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
+import { readHeatmapRowsCustomMeta } from 'app/features/transformers/calculateHeatmap/heatmap';
 import { HeatmapCellLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
 import { HeatmapPanel } from './HeatmapPanel';
 import { prepareHeatmapData } from './fields';
 import { heatmapChangedHandler, heatmapMigrationHandler } from './migrations';
 import { PanelOptions, defaultPanelOptions, HeatmapColorMode, HeatmapColorScale } from './models.gen';
 import { colorSchemes, quantizeScheme } from './palettes';
@@ -16,15 +18,7 @@ import { HeatmapSuggestionsSupplier } from './suggestions';
 export const plugin = new PanelPlugin<PanelOptions, GraphFieldConfig>(HeatmapPanel)
  .useFieldConfig({
-    // This keeps: unit, decimals, displayName
+    disableStandardOptions: Object.values(FieldConfigProperty).filter((v) => v !== FieldConfigProperty.Links),
    disableStandardOptions: [
      FieldConfigProperty.Color,
      FieldConfigProperty.Thresholds,
      FieldConfigProperty.Min,
      FieldConfigProperty.Max,
      FieldConfigProperty.Mappings,
      FieldConfigProperty.NoValue,
    ],
    useCustomConfig: (builder) => {
      builder.addCustomEditor<void, ScaleDistributionConfig>({
        id: 'scaleDistribution',
@@ -46,6 +40,13 @@ export const plugin = new PanelPlugin<PanelOptions, GraphFieldConfig>(HeatmapPan
  .setPanelOptions((builder, context) => {
    const opts = context.options ?? defaultPanelOptions;
    let isOrdinalY = false;
    try {
      const v = prepareHeatmapData({ series: context.data } as PanelData, opts, config.theme2);
      isOrdinalY = readHeatmapRowsCustomMeta(v.heatmap).yOrdinalDisplay != null;
    } catch {}
    let category = ['Heatmap'];
    builder.addRadio({
@@ -81,8 +82,24 @@ export const plugin = new PanelPlugin<PanelOptions, GraphFieldConfig>(HeatmapPan
      },
    });
-    // TODO: support clamping the min/max range when there is a real axis
+    builder
-    if (false && opts.calculate) {
+      .addUnitPicker({
        category,
        path: 'yAxis.unit',
        name: 'Unit',
        defaultValue: undefined,
      })
      .addNumberInput({
        category,
        path: 'yAxis.decimals',
        name: 'Decimals',
        settings: {
          placeholder: 'Auto',
        },
      });
    if (!isOrdinalY) {
      // if undefined, then show the min+max
      builder
        .addNumberInput({
          path: 'yAxis.min',
@@ -125,16 +142,16 @@ export const plugin = new PanelPlugin<PanelOptions, GraphFieldConfig>(HeatmapPan
    if (!opts.calculate) {
      builder.addRadio({
-        path: 'bucketFrame.layout',
+        path: 'rowsFrame.layout',
        name: 'Tick alignment',
-        defaultValue: defaultPanelOptions.bucketFrame?.layout ?? HeatmapBucketLayout.auto,
+        defaultValue: defaultPanelOptions.rowsFrame?.layout ?? HeatmapCellLayout.auto,
        category,
        settings: {
          options: [
-            { label: 'Auto', value: HeatmapBucketLayout.auto },
+            { label: 'Auto', value: HeatmapCellLayout.auto },
-            { label: 'Top (LE)', value: HeatmapBucketLayout.le },
+            { label: 'Top (LE)', value: HeatmapCellLayout.le },
-            { label: 'Middle', value: HeatmapBucketLayout.unknown },
+            { label: 'Middle', value: HeatmapCellLayout.unknown },
-            { label: 'Bottom (GE)', value: HeatmapBucketLayout.ge },
+            { label: 'Bottom (GE)', value: HeatmapCellLayout.ge },
          ],
        },
      });
@@ -260,7 +277,35 @@ export const plugin = new PanelPlugin<PanelOptions, GraphFieldConfig>(HeatmapPan
        category,
      });
-    category = ['Display'];
+    category = ['Cell display'];
    if (!opts.calculate) {
      builder.addTextInput({
        path: 'rowsFrame.value',
        name: 'Value name',
        defaultValue: defaultPanelOptions.rowsFrame?.value,
        settings: {
          placeholder: 'Value',
        },
        category,
      });
    }
    builder
      .addUnitPicker({
        category,
        path: 'cellValues.unit',
        name: 'Unit',
        defaultValue: undefined,
      })
      .addNumberInput({
        category,
        path: 'cellValues.decimals',
        name: 'Decimals',
        settings: {
          placeholder: 'Auto',
        },
      });
    builder
      // .addRadio({
@@ -324,18 +369,6 @@ export const plugin = new PanelPlugin<PanelOptions, GraphFieldConfig>(HeatmapPan
      category,
    });
    if (!opts.calculate) {
      builder.addTextInput({
        path: 'bucketFrame.value',
        name: 'Cell value name',
        defaultValue: defaultPanelOptions.bucketFrame?.value,
        settings: {
          placeholder: 'Value',
        },
        category,
      });
    }
    builder.addBooleanSwitch({
      path: 'tooltip.yHistogram',
      name: 'Show histogram (Y axis)',
@@ -1,8 +1,13 @@
 import { MutableRefObject, RefObject } from 'react';
-import uPlot from 'uplot';
+import uPlot, { Cursor } from 'uplot';
 import {
  DashboardCursorSync,
  DataFrameType,
  DataHoverClearEvent,
  DataHoverEvent,
  DataHoverPayload,
  EventBus,
  formattedValueToString,
  getValueFormat,
  GrafanaTheme2,
@@ -12,8 +17,8 @@ import {
 } from '@grafana/data';
 import { AxisPlacement, ScaleDirection, ScaleDistribution, ScaleOrientation } from '@grafana/schema';
 import { UPlotConfigBuilder } from '@grafana/ui';
-import { readHeatmapScanlinesCustomMeta } from 'app/features/transformers/calculateHeatmap/heatmap';
+import { isHeatmapCellsDense, readHeatmapRowsCustomMeta } from 'app/features/transformers/calculateHeatmap/heatmap';
-import { HeatmapBucketLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
+import { HeatmapCellLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
 import { pointWithin, Quadtree, Rect } from '../barchart/quadtree';
@@ -55,6 +60,7 @@ export interface HeatmapZoomEvent {
 interface PrepConfigOpts {
  dataRef: RefObject<HeatmapData>;
  theme: GrafanaTheme2;
  eventBus: EventBus;
  onhover?: null | ((evt?: HeatmapHoverEvent | null) => void);
  onclick?: null | ((evt?: any) => void);
  onzoom?: null | ((evt: HeatmapZoomEvent) => void);
@@ -66,16 +72,16 @@ interface PrepConfigOpts {
  cellGap?: number | null; // in css pixels
  hideLE?: number;
  hideGE?: number;
  valueMin?: number;
  valueMax?: number;
  yAxisConfig: YAxisConfig;
  ySizeDivisor?: number;
  sync?: () => DashboardCursorSync;
 }
 export function prepConfig(opts: PrepConfigOpts) {
  const {
    dataRef,
    theme,
    eventBus,
    onhover,
    onclick,
    onzoom,
@@ -86,12 +92,14 @@ export function prepConfig(opts: PrepConfigOpts) {
    cellGap,
    hideLE,
    hideGE,
    valueMin,
    valueMax,
    yAxisConfig,
    ySizeDivisor,
    sync,
  } = opts;
  const xScaleKey = 'x';
  const xScaleUnit = 'time';
  const pxRatio = devicePixelRatio;
  let heatmapType = dataRef.current?.heatmap?.meta?.type;
@@ -131,8 +139,8 @@ export function prepConfig(opts: PrepConfigOpts) {
  onzoom &&
    builder.addHook('setSelect', (u) => {
      onzoom({
-        xMin: u.posToVal(u.select.left, 'x'),
+        xMin: u.posToVal(u.select.left, xScaleKey),
-        xMax: u.posToVal(u.select.left + u.select.width, 'x'),
+        xMax: u.posToVal(u.select.left + u.select.width, xScaleKey),
      });
      u.setSelect({ left: 0, top: 0, width: 0, height: 0 }, false);
    });
@@ -140,7 +148,7 @@ export function prepConfig(opts: PrepConfigOpts) {
  // this is a tmp hack because in mode: 2, uplot does not currently call scales.x.range() for setData() calls
  // scales.x.range() typically reads back from drilled-down panelProps.timeRange via getTimeRange()
  builder.addHook('setData', (u) => {
-    //let [min, max] = (u.scales!.x!.range! as uPlot.Range.Function)(u, 0, 100, 'x');
+    //let [min, max] = (u.scales!.x!.range! as uPlot.Range.Function)(u, 0, 100, xScaleKey);
    let { min: xMin, max: xMax } = u.scales!.x;
@@ -149,7 +157,7 @@ export function prepConfig(opts: PrepConfigOpts) {
    if (xMin !== min || xMax !== max) {
      queueMicrotask(() => {
-        u.setScale('x', { min, max });
+        u.setScale(xScaleKey, { min, max });
      });
    }
  });
@@ -159,6 +167,14 @@ export function prepConfig(opts: PrepConfigOpts) {
    rect = r;
  });
  const payload: DataHoverPayload = {
    point: {
      [xScaleUnit]: null,
    },
    data: dataRef.current?.heatmap,
  };
  const hoverEvent = new DataHoverEvent(payload);
  let pendingOnleave = 0;
  onhover &&
@@ -166,20 +182,25 @@ export function prepConfig(opts: PrepConfigOpts) {
      if (u.cursor.idxs != null) {
        for (let i = 0; i < u.cursor.idxs.length; i++) {
          const sel = u.cursor.idxs[i];
-          if (sel != null && !isToolTipOpen.current) {
+          if (sel != null) {
-            if (pendingOnleave) {
+            const { left, top } = u.cursor;
-              clearTimeout(pendingOnleave);
+            payload.rowIndex = sel;
-              pendingOnleave = 0;
+            payload.point[xScaleUnit] = u.posToVal(left!, xScaleKey);
            eventBus.publish(hoverEvent);
            if (!isToolTipOpen.current) {
              if (pendingOnleave) {
                clearTimeout(pendingOnleave);
                pendingOnleave = 0;
              }
              onhover({
                seriesIdx: i,
                dataIdx: sel,
                pageX: rect.left + left!,
                pageY: rect.top + top!,
              });
            }
-
+            return;
            onhover({
              seriesIdx: i,
              dataIdx: sel,
              pageX: rect.left + u.cursor.left!,
              pageY: rect.top + u.cursor.top!,
            });
            return; // only show the first one
          }
        }
      }
@@ -187,7 +208,12 @@ export function prepConfig(opts: PrepConfigOpts) {
      if (!isToolTipOpen.current) {
        // if tiles have gaps, reduce flashing / re-render (debounce onleave by 100ms)
        if (!pendingOnleave) {
-          pendingOnleave = setTimeout(() => onhover(null), 100) as any;
+          pendingOnleave = setTimeout(() => {
            onhover(null);
            payload.rowIndex = undefined;
            payload.point[xScaleUnit] = null;
            eventBus.publish(hoverEvent);
          }, 100) as any;
        }
      }
    });
@@ -209,7 +235,7 @@ export function prepConfig(opts: PrepConfigOpts) {
  builder.setMode(2);
  builder.addScale({
-    scaleKey: 'x',
+    scaleKey: xScaleKey,
    isTime: true,
    orientation: ScaleOrientation.Horizontal,
    direction: ScaleDirection.Right,
@@ -220,19 +246,30 @@ export function prepConfig(opts: PrepConfigOpts) {
  });
  builder.addAxis({
-    scaleKey: 'x',
+    scaleKey: xScaleKey,
    placement: AxisPlacement.Bottom,
    isTime: true,
    theme: theme,
  });
-  const yFieldConfig = dataRef.current?.heatmap?.fields[1]?.config?.custom as PanelFieldConfig | undefined;
+  const yField = dataRef.current?.heatmap?.fields[1]!;
  if (!yField) {
    return builder; // early abort (avoids error)
  }
  const yFieldConfig = yField.config?.custom as PanelFieldConfig | undefined;
  const yScale = yFieldConfig?.scaleDistribution ?? { type: ScaleDistribution.Linear };
  const yAxisReverse = Boolean(yAxisConfig.reverse);
-  const shouldUseLogScale = yScale.type !== ScaleDistribution.Linear || heatmapType === DataFrameType.HeatmapSparse;
+  const isSparseHeatmap = heatmapType === DataFrameType.HeatmapCells && !isHeatmapCellsDense(dataRef.current?.heatmap!);
  const shouldUseLogScale = yScale.type !== ScaleDistribution.Linear || isSparseHeatmap;
  const isOrdianalY = readHeatmapRowsCustomMeta(dataRef.current?.heatmap).yOrdinalDisplay != null;
  // random to prevent syncing y in other heatmaps
  // TODO: try to match TimeSeries y keygen algo to sync with TimeSeries panels (when not isOrdianalY)
  const yScaleKey = 'y_' + (Math.random() + 1).toString(36).substring(7);
  builder.addScale({
-    scaleKey: 'y',
+    scaleKey: yScaleKey,
    isTime: false,
    // distribution: ScaleDistribution.Ordinal, // does not work with facets/scatter yet
    orientation: ScaleOrientation.Vertical,
@@ -241,14 +278,37 @@ export function prepConfig(opts: PrepConfigOpts) {
    distribution: shouldUseLogScale ? ScaleDistribution.Log : ScaleDistribution.Linear,
    log: yScale.log ?? 2,
    range:
-      // sparse already accounts for le/ge by explicit yMin & yMax cell bounds, so use default log ranging
+      // sparse already accounts for le/ge by explicit yMin & yMax cell bounds, so no need to expand y range
-      heatmapType === DataFrameType.HeatmapSparse
+      isSparseHeatmap
-        ? undefined
+        ? (u, dataMin, dataMax) => {
            let scaleMin: number | null, scaleMax: number | null;
            [scaleMin, scaleMax] = shouldUseLogScale
              ? uPlot.rangeLog(dataMin, dataMax, (yScale.log ?? 2) as unknown as uPlot.Scale.LogBase, true)
              : [dataMin, dataMax];
            if (shouldUseLogScale && !isOrdianalY) {
              let { min: explicitMin, max: explicitMax } = yAxisConfig;
              // guard against <= 0
              if (explicitMin != null && explicitMin > 0) {
                scaleMin = explicitMin;
              }
              if (explicitMax != null && explicitMax > 0) {
                scaleMax = explicitMax;
              }
            }
            return [scaleMin, scaleMax];
          }
        : // dense and ordinal only have one of yMin|yMax|y, so expand range by one cell in the direction of le/ge/unknown
          (u, dataMin, dataMax) => {
            let { min: explicitMin, max: explicitMax } = yAxisConfig;
            // logarithmic expansion
            if (shouldUseLogScale) {
-              let yExp = u.scales['y'].log!;
+              let yExp = u.scales[yScaleKey].log!;
              let minExpanded = false;
              let maxExpanded = false;
@@ -270,11 +330,11 @@ export function prepConfig(opts: PrepConfigOpts) {
                }
              }
-              if (dataRef.current?.yLayout === HeatmapBucketLayout.le) {
+              if (dataRef.current?.yLayout === HeatmapCellLayout.le) {
                if (!minExpanded) {
                  dataMin /= yExp;
                }
-              } else if (dataRef.current?.yLayout === HeatmapBucketLayout.ge) {
+              } else if (dataRef.current?.yLayout === HeatmapCellLayout.ge) {
                if (!maxExpanded) {
                  dataMax *= yExp;
                }
@@ -282,6 +342,17 @@ export function prepConfig(opts: PrepConfigOpts) {
                dataMin /= yExp / 2;
                dataMax *= yExp / 2;
              }
              if (!isOrdianalY) {
                // guard against <= 0
                if (explicitMin != null && explicitMin > 0) {
                  dataMin = explicitMin;
                }
                if (explicitMax != null && explicitMax > 0) {
                  dataMax = explicitMax;
                }
              }
            }
            // linear expansion
            else {
@@ -292,9 +363,9 @@ export function prepConfig(opts: PrepConfigOpts) {
              }
              if (bucketSize) {
-                if (dataRef.current?.yLayout === HeatmapBucketLayout.le) {
+                if (dataRef.current?.yLayout === HeatmapCellLayout.le) {
                  dataMin -= bucketSize!;
-                } else if (dataRef.current?.yLayout === HeatmapBucketLayout.ge) {
+                } else if (dataRef.current?.yLayout === HeatmapCellLayout.ge) {
                  dataMax += bucketSize!;
                } else {
                  dataMin -= bucketSize! / 2;
@@ -303,35 +374,40 @@ export function prepConfig(opts: PrepConfigOpts) {
              } else {
                // how to expand scale range if inferred non-regular or log buckets?
              }
              if (!isOrdianalY) {
                dataMin = explicitMin ?? dataMin;
                dataMax = explicitMax ?? dataMax;
              }
            }
            return [dataMin, dataMax];
          },
  });
-  const isOrdianalY = readHeatmapScanlinesCustomMeta(dataRef.current?.heatmap).yOrdinalDisplay != null;
+  const dispY = yField.display ?? getValueFormat('short');
  const disp = dataRef.current?.heatmap?.fields[1].display ?? getValueFormat('short');
  builder.addAxis({
-    scaleKey: 'y',
+    scaleKey: yScaleKey,
    show: yAxisConfig.axisPlacement !== AxisPlacement.Hidden,
    placement: yAxisConfig.axisPlacement || AxisPlacement.Left,
    size: yAxisConfig.axisWidth || null,
    label: yAxisConfig.axisLabel,
    theme: theme,
-    formatValue: (v: any) => formattedValueToString(disp(v)),
+    formatValue: (v: any) => formattedValueToString(dispY(v)),
    splits: isOrdianalY
      ? (self: uPlot) => {
-          const meta = readHeatmapScanlinesCustomMeta(dataRef.current?.heatmap);
+          const meta = readHeatmapRowsCustomMeta(dataRef.current?.heatmap);
          if (!meta.yOrdinalDisplay) {
            return [0, 1]; //?
          }
          let splits = meta.yOrdinalDisplay.map((v, idx) => idx);
          switch (dataRef.current?.yLayout) {
-            case HeatmapBucketLayout.le:
+            case HeatmapCellLayout.le:
              splits.unshift(-1);
              break;
-            case HeatmapBucketLayout.ge:
+            case HeatmapCellLayout.ge:
              splits.push(splits.length);
              break;
          }
@@ -349,36 +425,31 @@ export function prepConfig(opts: PrepConfigOpts) {
      : undefined,
    values: isOrdianalY
      ? (self: uPlot, splits) => {
-          const meta = readHeatmapScanlinesCustomMeta(dataRef.current?.heatmap);
+          const meta = readHeatmapRowsCustomMeta(dataRef.current?.heatmap);
          if (meta.yOrdinalDisplay) {
-            return splits.map((v) => {
+            return splits.map((v) =>
-              const txt = meta.yOrdinalDisplay[v];
+              v < 0
-              if (!txt && v < 0) {
+                ? meta.yMinDisplay ?? '' // Check prometheus style labels
-                // Check prometheus style labels
+                : meta.yOrdinalDisplay[v] ?? ''
-                if ('le' === meta.yMatchWithLabel) {
+            );
                  return '0.0';
                }
              }
              return txt;
            });
          }
-          return splits.map((v) => `${v}`);
+          return splits;
        }
      : undefined,
  });
-  const pathBuilder = heatmapType === DataFrameType.HeatmapScanlines ? heatmapPathsDense : heatmapPathsSparse;
+  const pathBuilder = isSparseHeatmap ? heatmapPathsSparse : heatmapPathsDense;
  // heatmap layer
  builder.addSeries({
    facets: [
      {
-        scale: 'x',
+        scale: xScaleKey,
        auto: true,
        sorted: 1,
      },
      {
-        scale: 'y',
+        scale: yScaleKey,
        auto: true,
      },
    ],
@@ -397,22 +468,27 @@ export function prepConfig(opts: PrepConfigOpts) {
      hideLE,
      hideGE,
      xAlign:
-        dataRef.current?.xLayout === HeatmapBucketLayout.le
+        dataRef.current?.xLayout === HeatmapCellLayout.le
          ? -1
-          : dataRef.current?.xLayout === HeatmapBucketLayout.ge
+          : dataRef.current?.xLayout === HeatmapCellLayout.ge
          ? 1
          : 0,
-      yAlign: ((dataRef.current?.yLayout === HeatmapBucketLayout.le
+      yAlign: ((dataRef.current?.yLayout === HeatmapCellLayout.le
        ? -1
-        : dataRef.current?.yLayout === HeatmapBucketLayout.ge
+        : dataRef.current?.yLayout === HeatmapCellLayout.ge
        ? 1
        : 0) * (yAxisReverse ? -1 : 1)) as -1 | 0 | 1,
      ySizeDivisor,
      disp: {
        fill: {
          values: (u, seriesIdx) => {
-            let countFacetIdx = heatmapType === DataFrameType.HeatmapScanlines ? 2 : 3;
+            let countFacetIdx = !isSparseHeatmap ? 2 : 3;
-            return valuesToFills(u.data[seriesIdx][countFacetIdx] as unknown as number[], palette, valueMin, valueMax);
+            return valuesToFills(
              u.data[seriesIdx][countFacetIdx] as unknown as number[],
              palette,
              dataRef.current?.minValue!,
              dataRef.current?.maxValue!
            );
          },
          index: palette,
        },
@@ -426,12 +502,12 @@ export function prepConfig(opts: PrepConfigOpts) {
  builder.addSeries({
    facets: [
      {
-        scale: 'x',
+        scale: xScaleKey,
        auto: true,
        sorted: 1,
      },
      {
-        scale: 'y',
+        scale: yScaleKey,
        auto: true,
      },
    ],
@@ -454,7 +530,7 @@ export function prepConfig(opts: PrepConfigOpts) {
    scaleKey: '', // facets' scales used (above)
  });
-  builder.setCursor({
+  const cursor: Cursor = {
    drag: {
      x: true,
      y: false,
@@ -489,7 +565,30 @@ export function prepConfig(opts: PrepConfigOpts) {
        };
      },
    },
-  });
+  };
  if (sync && sync() !== DashboardCursorSync.Off) {
    cursor.sync = {
      key: '__global_',
      filters: {
        pub: (type: string, src: uPlot, x: number, y: number, w: number, h: number, dataIdx: number) => {
          if (x < 0) {
            payload.point[xScaleUnit] = null;
            eventBus.publish(new DataHoverClearEvent());
          } else {
            payload.point[xScaleUnit] = src.posToVal(x, xScaleKey);
            eventBus.publish(hoverEvent);
          }
          return true;
        },
      },
    };
    builder.setSync();
  }
  builder.setCursor(cursor);
  return builder;
 }
@@ -789,12 +888,20 @@ export function heatmapPathsSparse(opts: PathbuilderOpts) {
  };
 }
-export const valuesToFills = (values: number[], palette: string[], minValue?: number, maxValue?: number) => {
+export const boundedMinMax = (
  values: number[],
  minValue?: number,
  maxValue?: number,
  hideLE = -Infinity,
  hideGE = Infinity
 ) => {
  if (minValue == null) {
    minValue = Infinity;
    for (let i = 0; i < values.length; i++) {
-      minValue = Math.min(minValue, values[i]);
+      if (values[i] > hideLE && values[i] < hideGE) {
        minValue = Math.min(minValue, values[i]);
      }
    }
  }
@@ -802,10 +909,16 @@ export const valuesToFills = (values: number[], palette: string[], minValue?: nu
    maxValue = -Infinity;
    for (let i = 0; i < values.length; i++) {
-      maxValue = Math.max(maxValue, values[i]);
+      if (values[i] > hideLE && values[i] < hideGE) {
        maxValue = Math.max(maxValue, values[i]);
      }
    }
  }
  return [minValue, maxValue];
 };
 export const valuesToFills = (values: number[], palette: string[], minValue: number, maxValue: number) => {
  let range = maxValue - minValue;
  let paletteSize = palette.length;