Support relative max data points

### Discussed in https://github.com/grafana/grafana/discussions/50134 <div type='discussions-op-text'> ^{Originally posted by **breezewish** June 3, 2022} Update: A demo of this proposal has been implemented in https://github.com/grafana/grafana/pull/50214 <img width="476" alt="image" src="https://user-images.githubusercontent.com/1916485/171783453-300d5724-2988-4243-bc27-3dc42efe37fa.png"> The max data points options now only have two options: - An absolute number of data points - Auto, equals to the panel visible width It would be better to additionally support percentage notation, e.g. specifying `30%` in this option. This enables user to control **how "dense" the chart should be displayed** dynamically. Specifying `100%` would be just identical to specifying `auto`. Note that a `50%` max data point is not identical to set resolution to `1/2`: Consider that we have a metric that usually changes sharply. When the time range is large, e.g. 1 day, this chart is hard to read due to the density of the data points: <img width="639" alt="image" src="https://user-images.githubusercontent.com/1916485/171783888-18f71c4b-0528-4030-9179-913f7612cb70.png"> User could possibly improve it by setting to a lower resolution, e.g. `1/10`: <img width="637" alt="image" src="https://user-images.githubusercontent.com/1916485/171784217-97dbc163-b0a8-446d-84e4-0fceb35eb267.png"> However, this resolution change causes new problems when user want to view details, e.g. by selecting a 30 minute time range: <img width="637" alt="image" src="https://user-images.githubusercontent.com/1916485/171784526-03043c12-3f32-432e-918d-dfa88f911e8f.png"> User cannot view the exact detail, due to the low resolution, even when the panel is large and more data points can be displayed in the screen. An ideal charts looks like this, by displaying more details to users: <img width="641" alt="image" src="https://user-images.githubusercontent.com/1916485/171784710-f9378bb9-c64c-439a-859c-5d1a2c881f2e.png…