Use of datasource in Apache eChart


I’m currently having trouble displaying some data through the Apache eChart plugin. Indeed, I retrieved the data as below but nothing is displayed on the curve.

So I would like to know how to solve this problem?


What do you see when you add

console.log('Sunny Seattle', series)

on line 11 and check your console


@Seji Take a look at the video where we explained how to use Data sources in Apache ECharts.


Thanks for your answer @yosiasz. When i add this console.log('Sunny Seattle', series), i have those lines :

Sorry meant to say

console.log('Sunny Seattle', wind)

put it in line 15.

1 Like

Thank you for the tutorial but I couldn’t find where my error came from.

@Seji You don’t need to redefine as constants tws, twd and time variables inside map function as they are already defined with let at the beginning.

Please remove const and try again.

1 Like

I removed the const but I still have the same error.

@Seji, It’s an error for the wind array, which has an undefined element. You should push elements to the wind array or define it with three elements from the start like

const wind = [[], [], []]

It’s not clear which visualization you are using. To have an array with three nested arrays following your logic, I would suggest:

const wind = => {
  const tws = s.fields.find((f) => === 'tws').values.buffer;
  const twd = s.fields.find((f) => === 'twd').values.buffer;
  const time = s.fields.find((f) => f.type === 'time').values.buffer;

  return [tws, twd, time];

I always wondered about this .values.buffer
What pattern is this?


I believe it’s defined in DataFrames, grafana/processDataFrame.ts at main · grafana/grafana · GitHub.


Thanks for your help @yosiasz and @mikhailvolkov. I used another graphic and changed the part of the code that didn’t fit. I think I was not using the parameters in their correct form.

However, I have another problem as it does not display the last value in the table but the first value.


So wack and unusual, wonder why didnt they leave it just at values

@Seji, Great that it works.

You should be able to limit the number of returned records from PostgreSQL to the latest one, which will be the optimal solution.

1 Like

Thanks, I used the following query to retrieve the last value : SELECT horaire AS "time", twd FROM of50 ORDER BY horaire DESC LIMIT 1


@Seji, thank you for confirming. Let us know if there is anything else.

1 Like