Developing datasource plugin with React

Grafana Plugin Development
1

Hi, have several questions on new plugin platform.

  1. Why tutorial does not contain info on using backendSrv? Could you please add this to tutorial, cause most of developers simply will not generate data like it is done in example project, but would like to request this data from remote.

  2. In 7.0 release notes it was said, that Grafana now supports wide range of input types, not just tables an timeseries, but I didn’t find how exactly data returned by backend should look like. There’s a section about data frames in docs, but as I understood data frames are only abstractions to unify all data formats to one. Could you please provide me with exact descriptions of data formats, that Grafana backed does accept.

Thank you.

1 Like
2
  1. Here is my usual pattern for the backendSrv
import { BackendSrvRequest, getBackendSrv } from '@grafana/runtime';
export default class Client {
  private doRequest(options: BackendSrvRequest, maxRetries = 1): Promise<any> {
    const request: BackendSrvRequest = {
      url: `${this.url}/${options.route}/${options.url}`,
      method: options.method,
      data: options.data,
    };
    return getBackendSrv()
      .datasourceRequest(request)
      .catch((error: any) => {
        if (maxRetries > 0) {
          return this.doRequest(options, maxRetries - 1);
        }
        throw error;
      });
  }
  1. I believe the data frame is the new format. Here is how to construct a DF.
import { FieldType, MutableDataFrame } from '@grafana/data';

const dataFrame = new MutableDataFrame();
dataFrame.addField({ name: 'Time', type: FieldType.time });
dataFrame.addField({ name: 'Foo', type: FieldType.string });
let row = { Time: epoch, Foo: "bar" };
dataFrame.add(row, true);

BUT the support of the dataframe is still limited to the official plugins. The 3rd party plugins don’t seem to work with the dataframe. The WorldMap plugin doesn’t work for example. What surprised me is the visualization panels are NOT datasource agnostic. It has to check the data type and switch the processing accordingly.

So I learned it’s up to the visualization panels as to which data format to support. The WorldMap worked fine as soon as I switched it back to TimeSeries. I suggest the good old TimeSeries for the time being.

3 Likes