Hi there, Im trying to use the Apache Echarts with my sql Query in Grafana but unable to sort what is wrong with my code. The current error im getting is = Echarts Execution Error Data is not defined.
Grafana v- 9.5
Apache echarts - 5.X
Table View comes correctly
with school name and ticket count per school
eg:
TableView:
School a - 10 tickets
School b - 11 tickets
School c - 12 tickets…
SQLQuery named as A
SELECT top 5
company_name as ‘school’,
count([dbo].[v_rpt_Service].[TicketNbr]) AS ‘ticket’
FROM v_rpt_Service
WHERE Board_Name IN(‘Field Technicians’)
–AND Parent is null
AND closed_flag = ‘0’
AND SubTypeItem_RecID !=305 --Maintenance Visit
Group by company_name
My code :
let school = ;
let ticket = ;
data.series.map((s) => {
if (s.refId === “A”) {
school = s.fields.find((f) => f.name === “school”).values;
ticket = s.fields.find((f) => f.name === “ticket”).values;
}
});
return {
grid: {
bottom: “3%”,
containLabel: true,
left: “3%”,
right: “4%”,
top: “4%”
},
series: [
{
data: school,
itemStyle: {
borderColor: “#EE6666”,
borderWidth: 3,
color: “yellow”
},
lineStyle: {
color: “#5470C6”,
type: “dashed”,
width: 4
},
symbol: “triangle”,
symbolSize: 20,
type: “line”
}
],
xAxis: {
data: ticket,
type: “category”
},
yAxis: {
type: “value”
}
};
My Json from query(Grafana) is this:
[
{
“schema”: {
“refId”: “A”,
“meta”: {
“executedQueryString”: “SELECT top 5\r\ncompany_name as ‘school’,\r\ncount([dbo].[v_rpt_Service].[TicketNbr]) AS ‘ticket’\r\n\r\n\r\n–CASE WHEN Ticket_Owner_First_name is null THEN ‘Unassigned’ ELSE CONCAT(Ticket_Owner_First_Name, ’ ', SUBSTRING(Ticket_Owner_Last_Name, 1, 1)) END AS Owner, [dbo].[v_rpt_Service_Open].[company_name] AS ‘Company_name’, [dbo].[v_rpt_Service_Open].[status_description] AS ‘Status Description’, [dbo].[v_rpt_Service_Open].[Age] AS ‘Age’\r\nFROM [dbo].[v_rpt_Service] WITH(NOLOCK) \r\nWHERE Board_Name IN(‘Field Technicians’) \r\n–AND Parent is null\r\nAND closed_flag = ‘0’\r\nAND SubTypeItem_RecID !=305 --Maintenance Visit \r\n\r\n\r\n\r\nGroup by company_name\r\n”
},
“fields”: [
{
“name”: “school”,
“type”: “string”,
“typeInfo”: {
“frame”: “string”,
“nullable”: true
},
“config”: {}
},
{
“name”: “ticket”,
“type”: “number”,
“typeInfo”: {
“frame”: “int64”,
“nullable”: true
},
“config”: {}
}
]
},
“data”: {
“values”: [
[
“ABC school”,
“Point A school”,
“Bob’s school”,
“Jusep School”,
“Don Lord school”
],
[
7,
12,
7,
9,
13
]
]
}
}
]
Echart:
https://echarts.volkovlabs.io/d/tg6gWiKVk/line?orgId=1&editPanel=28
Any help appreciated.
