QueryOptions: Add resolution option / factor that multiplies with MaxDataPoints

.betterer.results

@@ -5265,7 +5265,7 @@ exports[`better eslint`] = {
       [496, 25, 293, "Do not use any type assertions.", "3989849883"],
       [498, 21, 213, "Do not use any type assertions.", "2695721884"]
     ],
-    "public/app/features/dashboard/state/PanelModel.ts:2979822970": [
+    "public/app/features/dashboard/state/PanelModel.ts:3874897162": [
       [112, 16, 3, "Unexpected any. Specify a different type.", "193409811"],
       [131, 10, 3, "Unexpected any. Specify a different type.", "193409811"],
       [145, 15, 3, "Unexpected any. Specify a different type.", "193409811"],
@@ -5273,28 +5273,28 @@ exports[`better eslint`] = {
       [150, 14, 3, "Unexpected any. Specify a different type.", "193409811"],
       [151, 21, 3, "Unexpected any. Specify a different type.", "193409811"],
       [153, 19, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [191, 21, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [199, 22, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [210, 18, 11, "Do not use any type assertions.", "3816020039"],
-      [210, 26, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [214, 18, 11, "Do not use any type assertions.", "3816020039"],
-      [214, 26, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [218, 14, 11, "Do not use any type assertions.", "3816020039"],
-      [218, 22, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [223, 7, 11, "Do not use any type assertions.", "3816020039"],
-      [223, 15, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [285, 17, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [369, 21, 11, "Do not use any type assertions.", "3816020039"],
-      [369, 29, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [382, 7, 11, "Do not use any type assertions.", "3816020039"],
-      [382, 15, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [433, 14, 11, "Do not use any type assertions.", "3816020039"],
-      [433, 22, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [453, 16, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [464, 22, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [512, 22, 18, "Do not use any type assertions.", "1060162663"],
-      [595, 38, 3, "Unexpected any. Specify a different type.", "193409811"],
-      [654, 14, 3, "Unexpected any. Specify a different type.", "193409811"]
+      [192, 21, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [200, 22, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [211, 18, 11, "Do not use any type assertions.", "3816020039"],
+      [211, 26, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [215, 18, 11, "Do not use any type assertions.", "3816020039"],
+      [215, 26, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [219, 14, 11, "Do not use any type assertions.", "3816020039"],
+      [219, 22, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [224, 7, 11, "Do not use any type assertions.", "3816020039"],
+      [224, 15, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [286, 17, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [373, 21, 11, "Do not use any type assertions.", "3816020039"],
+      [373, 29, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [386, 7, 11, "Do not use any type assertions.", "3816020039"],
+      [386, 15, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [437, 14, 11, "Do not use any type assertions.", "3816020039"],
+      [437, 22, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [457, 16, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [468, 22, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [517, 22, 18, "Do not use any type assertions.", "1060162663"],
+      [600, 38, 3, "Unexpected any. Specify a different type.", "193409811"],
+      [659, 14, 3, "Unexpected any. Specify a different type.", "193409811"]
     ],
     "public/app/features/dashboard/state/TimeModel.ts:2763994651": [
       [3, 8, 3, "Unexpected any. Specify a different type.", "193409811"],
@@ -6572,7 +6572,7 @@ exports[`better eslint`] = {
     "public/app/features/query/components/QueryGroup.tsx:775269015": [
       [248, 33, 3, "Unexpected any. Specify a different type.", "193409811"]
     ],
-    "public/app/features/query/components/QueryGroupOptions.tsx:1642191191": [
+    "public/app/features/query/components/QueryGroupOptions.tsx:183861686": [
       [116, 48, 28, "Do not use any type assertions.", "2379647796"]
     ],
     "public/app/features/query/state/DashboardQueryRunner/AlertStatesWorker.test.ts:2602787036": [

public/app/features/dashboard/components/PanelEditor/PanelEditorQueries.tsx

@@ -35,6 +35,7 @@ export class PanelEditorQueries extends PureComponent<Props> {
       },
       queries: panel.targets,
       maxDataPoints: panel.maxDataPoints,
+      resolution: panel.resolution,
       minInterval: panel.interval,
       timeRange: {
         from: panel.timeFrom,

public/app/features/dashboard/state/PanelModel.ts

@@ -156,6 +156,7 @@ export class PanelModel implements DataConfigSource, IPanelModel {
   declare fieldConfig: FieldConfigSource;
 
   maxDataPoints?: number | null;
+  resolution?: number | null;
   interval?: string | null;
   description?: string;
   links?: DataLink[];
@@ -330,6 +331,8 @@ export class PanelModel implements DataConfigSource, IPanelModel {
     width: number,
     publicDashboardAccessToken?: string
   ) {
+    const maxDataPoints = Math.floor((this.maxDataPoints ?? width) * (this.resolution ?? 1));
+
     this.getQueryRunner().run({
       datasource: this.datasource,
       queries: this.targets,
@@ -339,7 +342,7 @@ export class PanelModel implements DataConfigSource, IPanelModel {
       timezone: dashboardTimezone,
       timeRange: timeData.timeRange,
       timeInfo: timeData.timeInfo,
-      maxDataPoints: this.maxDataPoints || Math.floor(width),
+      maxDataPoints: maxDataPoints,
       minInterval: this.interval,
       scopedVars: this.scopedVars,
       cacheTimeout: this.cacheTimeout,
@@ -501,6 +504,7 @@ export class PanelModel implements DataConfigSource, IPanelModel {
     this.hideTimeOverride = options.timeRange?.hide;
     this.interval = options.minInterval;
     this.maxDataPoints = options.maxDataPoints;
+    this.resolution = options.resolution;
     this.targets = options.queries;
     this.configRev++;
 

public/app/features/query/components/QueryGroupOptions.tsx

@@ -1,8 +1,8 @@
 import { css } from '@emotion/css';
 import React, { PureComponent, ChangeEvent, FocusEvent } from 'react';
 
-import { rangeUtil, PanelData, DataSourceApi } from '@grafana/data';
-import { Switch, Input, InlineField, InlineFormLabel, stylesFactory } from '@grafana/ui';
+import { rangeUtil, PanelData, DataSourceApi, SelectableValue } from '@grafana/data';
+import { Switch, Input, InlineField, InlineFormLabel, stylesFactory, Select } from '@grafana/ui';
 import { QueryOperationRow } from 'app/core/components/QueryOperationRow/QueryOperationRow';
 import { config } from 'app/core/config';
 import { QueryGroupOptions } from 'app/types';
@@ -168,11 +168,29 @@ export class QueryGroupOptionsEditor extends PureComponent<Props, State> {
     );
   }
 
+  onResolutionChange = (resolution: SelectableValue<number | undefined>) => {
+    this.props.onChange({
+      ...this.props.options,
+      resolution: resolution.value,
+    });
+  };
+
   renderMaxDataPointsOption() {
     const { data, options } = this.props;
-    const realMd = data.request?.maxDataPoints;
+    let realMd = data.request?.maxDataPoints;
+    if (realMd && options.resolution) {
+      realMd = Math.floor(realMd * options.resolution);
+    }
+
     const value = options.maxDataPoints ?? '';
     const isAuto = value === '';
+    const resolutionOptions = [
+      { label: '100%', value: undefined },
+      { label: '80%', value: 0.9 },
+      { label: '50%', value: 0.8 },
+      { label: '30%', value: 0.3 },
+      { label: '10%', value: 0.1 },
+    ];
 
     return (
       <div className="gf-form-inline">
@@ -200,6 +218,14 @@ export class QueryGroupOptionsEditor extends PureComponent<Props, State> {
             <>
               <div className="gf-form-label query-segment-operator">=</div>
               <div className="gf-form-label">Width of panel</div>
+              <div className="gf-form-label query-segment-operator">*</div>
+              <Select
+                width={10}
+                value={options.resolution}
+                options={resolutionOptions}
+                placeholder="1"
+                onChange={this.onResolutionChange}
+              />
             </>
           )}
         </div>

public/app/types/query.ts

@@ -5,6 +5,7 @@ export interface QueryGroupOptions {
   dataSource: QueryGroupDataSource;
   maxDataPoints?: number | null;
   minInterval?: string | null;
+  resolution?: number | null;
   cacheTimeout?: string | null;
   timeRange?: {
     from?: string | null;