Skip to content
This repository has been archived by the owner on Jun 18, 2024. It is now read-only.

statusmap (version 0.3.4) plugin compatibility with Grafana 7.3.6 #176

Open
zameeransari opened this issue Feb 17, 2021 · 6 comments
Open
Labels
data frames Issues related to data frames support
Milestone

Comments

@zameeransari
Copy link

We have upgraded our Grafana from 6.7.2 to 7.3.6, and statusmap plugin (version 0.3.4) is widely used in our dashboards. They all went blank. As a workaround I'm replacing statusmap with heatmap plugin. Is this known compatibility issue with Grafana 7.3.x?
Our Data source is Azure Data Explorer and Data format is time series.

Also tried with immediate previous version, but no luck. Please help.

@diafour
Copy link
Collaborator

diafour commented Feb 17, 2021

Hello! I've done a quick test of v0.3.4 and saw no issue in Grafana 7.3.6 and switch to 7.4.0. It is known that v0.3.4 is not compatible with 7.4.x (fixed in #172). I'll redo a test in 7.3.6 before cutting v0.4.0.

@diafour
Copy link
Collaborator

diafour commented Feb 17, 2021

I have no issues with v0.3.4 in Grafana 7.3.6. Can you please check that plugin in your setup works with random values from "--Grafana--" datasource?

Снимок экрана 2021-02-17 в 13 30 58

@zameeransari
Copy link
Author

zameeransari commented Feb 24, 2021

Statusmap plugin is throwing series of browser exceptions while it is using Azure Data Explorer as data source:

Error: <g> attribute transform: Expected number, "translate(NaN,0)".
deprecationWarning.ts:14 [Deprecation warning] kbn.ts: kbn.secondsToHms() is deprecated. Use @grafana/data instead
w @ deprecationWarning.ts:14
secondsToHms @ kbn.ts:36
calculateInterval @ module.ts:323
updateTimeRange @ module.ts:281
Promise.then (async)
value @ metrics_panel_ctrl.ts:104
s.emit @ index.js:202
value @ emitter.ts:29
value @ PanelModel.ts:278
value @ DashboardModel.ts:267
(anonymous) @ actions.ts:509
c @ runtime.js:45
(anonymous) @ runtime.js:271
forEach.e.<computed> @ runtime.js:97
L @ app.f6aff061b5e274f402d0.js:2
i @ app.f6aff061b5e274f402d0.js:2
Promise.then (async)
L @ app.f6aff061b5e274f402d0.js:2
i @ app.f6aff061b5e274f402d0.js:2
(anonymous) @ app.f6aff061b5e274f402d0.js:2
(anonymous) @ app.f6aff061b5e274f402d0.js:2
(anonymous) @ actions.ts:488
(anonymous) @ index.js:8
i @ store.ts:27
value @ DashboardModel.ts:260
value @ TimeSrv.ts:216
n.onRefresh @ DashNavTimeControls.tsx:62
y @ react-dom.production.min.js:15
w @ react-dom.production.min.js:15
(anonymous) @ react-dom.production.min.js:16
S @ react-dom.production.min.js:16
k @ react-dom.production.min.js:17
_ @ react-dom.production.min.js:17
T @ react-dom.production.min.js:17
jr @ react-dom.production.min.js:81
se @ react-dom.production.min.js:285
Ar @ react-dom.production.min.js:83
Tr @ react-dom.production.min.js:84
kr @ react-dom.production.min.js:84
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
ue @ react-dom.production.min.js:285
Er @ react-dom.production.min.js:82
attr.js:17 Error: <g> attribute transform: Expected number, "translate(NaN,10)".
(anonymous) @ attr.js:17
each @ each.js:5
attr @ attr.js:53
addYAxis @ rendering.ts:273
addStatusmapCanvas @ rendering.ts:344
render @ rendering.ts:767
onRender @ rendering.ts:125
s.emit @ index.js:202
value @ emitter.ts:29
value @ panel_ctrl.ts:102
(anonymous) @ panel_directive.ts:64
(anonymous) @ angular.js:20566
p @ angular.js:6428
(anonymous) @ angular.js:6707
setTimeout (async)
i.defer @ angular.js:6705
a @ angular.js:20564
(anonymous) @ panel_directive.ts:62
s.emit @ index.js:181
value @ emitter.ts:29
value @ PanelChromeAngular.tsx:149
mc @ react-dom.production.min.js:251
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
gc @ react-dom.production.min.js:244
ic @ react-dom.production.min.js:223
(anonymous) @ react-dom.production.min.js:121
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
Xo @ react-dom.production.min.js:121
Yo @ react-dom.production.min.js:120
ec @ react-dom.production.min.js:214
enqueueSetState @ react-dom.production.min.js:133
O.setState @ react.production.min.js:13
n._onResize @ index.esm.js:302
(anonymous) @ index.esm.js:78
(anonymous) @ index.esm.js:77
requestAnimationFrame (async)
a @ index.esm.js:34
s @ index.esm.js:73
scroll (async)
c @ index.esm.js:54
addResizeListener @ index.esm.js:155
value @ index.esm.js:329
mc @ react-dom.production.min.js:251
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
gc @ react-dom.production.min.js:244
ic @ react-dom.production.min.js:223
(anonymous) @ react-dom.production.min.js:121
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
Xo @ react-dom.production.min.js:121
Yo @ react-dom.production.min.js:120
ue @ react-dom.production.min.js:285
Er @ react-dom.production.min.js:82
angular.js:14800 TypeError: Cannot read property 'from' of undefined
at StatusmapRenderer.addXAxis (rendering.ts:183)
at StatusmapRenderer.addStatusmapCanvas (rendering.ts:354)
at StatusmapRenderer.render (rendering.ts:767)
at StatusmapRenderer.onRender (rendering.ts:125)
at s.emit (index.js:202)
at e.value (emitter.ts:29)
at StatusHeatmapCtrl.value (panel_ctrl.ts:102)
at panel_directive.ts:64
at angular.js:20566
at p (angular.js:6428)
(anonymous) @ angular.js:14800
(anonymous) @ angular.js:11218
(anonymous) @ angular.js:20569
p @ angular.js:6428
(anonymous) @ angular.js:6707
setTimeout (async)
i.defer @ angular.js:6705
a @ angular.js:20564
(anonymous) @ panel_directive.ts:62
s.emit @ index.js:181
value @ emitter.ts:29
value @ PanelChromeAngular.tsx:149
mc @ react-dom.production.min.js:251
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
gc @ react-dom.production.min.js:244
ic @ react-dom.production.min.js:223
(anonymous) @ react-dom.production.min.js:121
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
Xo @ react-dom.production.min.js:121
Yo @ react-dom.production.min.js:120
ec @ react-dom.production.min.js:214
enqueueSetState @ react-dom.production.min.js:133
O.setState @ react.production.min.js:13
n._onResize @ index.esm.js:302
(anonymous) @ index.esm.js:78
(anonymous) @ index.esm.js:77
requestAnimationFrame (async)
a @ index.esm.js:34
s @ index.esm.js:73
scroll (async)
c @ index.esm.js:54
addResizeListener @ index.esm.js:155
value @ index.esm.js:329
mc @ react-dom.production.min.js:251
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
gc @ react-dom.production.min.js:244
ic @ react-dom.production.min.js:223
(anonymous) @ react-dom.production.min.js:121
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
Xo @ react-dom.production.min.js:121
Yo @ react-dom.production.min.js:120
ue @ react-dom.production.min.js:285
Er @ react-dom.production.min.js:82
angular.js:14800 TypeError: Cannot read property 'from' of undefined
at StatusmapRenderer.addXAxis (rendering.ts:183)
at StatusmapRenderer.addStatusmapCanvas (rendering.ts:354)
at StatusmapRenderer.render (rendering.ts:767)
at StatusmapRenderer.onRender (rendering.ts:125)
at s.emit (index.js:202)
at e.value (emitter.ts:29)
at StatusHeatmapCtrl.value (panel_ctrl.ts:102)
at panel_directive.ts:64
at angular.js:20566
at p (angular.js:6428) "Possibly unhandled rejection: {}"
(anonymous) @ angular.js:14800
(anonymous) @ angular.js:11218
l @ angular.js:17199
$digest @ angular.js:18351
$apply @ angular.js:18649
(anonymous) @ angular.js:20574
p @ angular.js:6428
(anonymous) @ angular.js:6707
setTimeout (async)
i.defer @ angular.js:6705
a @ angular.js:20564
(anonymous) @ panel_directive.ts:62
s.emit @ index.js:181
value @ emitter.ts:29
value @ PanelChromeAngular.tsx:149
mc @ react-dom.production.min.js:251
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
gc @ react-dom.production.min.js:244
ic @ react-dom.production.min.js:223
(anonymous) @ react-dom.production.min.js:121
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
Xo @ react-dom.production.min.js:121
Yo @ react-dom.production.min.js:120
ec @ react-dom.production.min.js:214
enqueueSetState @ react-dom.production.min.js:133
O.setState @ react.production.min.js:13
n._onResize @ index.esm.js:302
(anonymous) @ index.esm.js:78
(anonymous) @ index.esm.js:77
requestAnimationFrame (async)
a @ index.esm.js:34
s @ index.esm.js:73
scroll (async)
c @ index.esm.js:54
addResizeListener @ index.esm.js:155
value @ index.esm.js:329
mc @ react-dom.production.min.js:251
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
gc @ react-dom.production.min.js:244
ic @ react-dom.production.min.js:223
(anonymous) @ react-dom.production.min.js:121
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
Xo @ react-dom.production.min.js:121
Yo @ react-dom.production.min.js:120
ue @ react-dom.production.min.js:285
Er @ react-dom.production.min.js:82
9rendering.ts:672 Uncaught TypeError: Cannot read property 'invert' of undefined
at StatusmapRenderer.emitGraphHoverEvent (rendering.ts:672)
at StatusmapRenderer.onMouseMove (rendering.ts:639)
at HTMLDivElement.dispatch (jquery.js:5429)
at HTMLDivElement.b.handle (jquery.js:5233)
emitGraphHoverEvent @ rendering.ts:672
onMouseMove @ rendering.ts:639
dispatch @ jquery.js:5429
b.handle @ jquery.js:5233
deprecationWarning.ts:14 [Deprecation warning] kbn.ts: kbn.secondsToHms() is deprecated. Use @grafana/data instead
w @ deprecationWarning.ts:14
secondsToHms @ kbn.ts:36
calculateInterval @ module.ts:323
updateTimeRange @ module.ts:281
Promise.then (async)
value @ metrics_panel_ctrl.ts:104
s.emit @ index.js:202
value @ emitter.ts:29
value @ PanelModel.ts:278
n.onRunQuery @ QueryEditorRow.tsx:161
y @ react-dom.production.min.js:15
w @ react-dom.production.min.js:15
(anonymous) @ react-dom.production.min.js:16
S @ react-dom.production.min.js:16
k @ react-dom.production.min.js:17
_ @ react-dom.production.min.js:17
T @ react-dom.production.min.js:17
jr @ react-dom.production.min.js:81
se @ react-dom.production.min.js:285
Ar @ react-dom.production.min.js:83
Tr @ react-dom.production.min.js:84
kr @ react-dom.production.min.js:84
KqkS.t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:120
ue @ react-dom.production.min.js:285
Er @ react-dom.production.min.js:82
4rendering.ts:672 Uncaught TypeError: Cannot read property 'invert' of undefined
at StatusmapRenderer.emitGraphHoverEvent (rendering.ts:672)
at StatusmapRenderer.onMouseMove (rendering.ts:639)
at HTMLDivElement.dispatch (jquery.js:5429)
at HTMLDivElement.b.handle (jquery.js:5233)
emitGraphHoverEvent @ rendering.ts:672
onMouseMove @ rendering.ts:639
dispatch @ jquery.js:5429
b.handle @ jquery.js:5233

It is working fine with MS-SQL data source. There could be possibility of incompatibility of statusmap with Azure Data Explorer plugin.

@diafour Any thoughts?

@diafour
Copy link
Collaborator

diafour commented Feb 24, 2021

So here is the answer: #143 (comment). Somehow Azure datasource returns data in 'table' format instead of required 'timeseries'.

@diafour diafour added the data frames Issues related to data frames support label Mar 4, 2021
@zameeransari
Copy link
Author

@diafour Is there any update on this issue?

@diafour
Copy link
Collaborator

diafour commented Apr 16, 2021

@zameeransari Sorry, I have no time for the plugin improvements until June.

@diafour diafour added this to the 0.5.0 milestone Nov 3, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
data frames Issues related to data frames support
Projects
None yet
Development

No branches or pull requests

2 participants