Does this support Mysql database.

syedsfayaz commented 5 years ago

I have requirement to show the status of my Jenkins jobs on a dashboard. Is it possible to use this plugin.

Attached link for more details. Its just a basic idea but if it even works close to this I will try to use it.

https://community.grafana.com/t/custom-dashboard-to-show-builds-progress/19871/2

algenty commented 5 years ago

Hi, I dont kown if it work with mysql, why not. Flowcharting uses transformed Series from grafana. All series have the same model then it must work.

BR Arnaud

syedsfayaz commented 5 years ago

HI, I have a specific requirement.

I have few Jenkins jobs which are internally connected that executes one after the other based on the success or failure of the previous job.

Dev --> Qa --> UAT – Prod and every stage has few Jenkins jobs.

Dev == git checkout, compile, junits, create artifact. qa == configure env, deploy, run selenium tests.

I want to show this dependency and flow of software on flow chart like a pipeline. and show status of jenkins builds. I tried to use grafana table panel with mysql databse. But that does not look like a neat representation of data on dashboard.

I want to use the shapes in the flow chart and get it placed similar to this diagram and show show some data in the boxes.

algenty commented 5 years ago

I dont think i understand your request, my english is powerless You can use tooltips to display metrics like it https://twitter.com/gf_flowcharting/status/1150462463353282560

syedsfayaz commented 5 years ago

Sorry for the confusion. But can we display data dynamically from a database as part of the flow chart. Or its only for a static data. Can you point me towards some advanced documentation for configuring this.

syedsfayaz commented 5 years ago

I tried to run a query on this plugin to get data from sql. It gives me error. Does this take only numeric values and not string?

SELECT 'Server' as SetUp, BuildNo, stage, reg_date AS "time", Buildstatus FROM DashboardDB.WindowsServer WHERE stage IN (SELECT stage FROM DashboardDB.WindowsServer WHERE reg_date = (SELECT MAX(reg_date) FROM DashboardDB.WindowsServer)) ORDER BY stage DESC LIMIT 1

algenty commented 5 years ago

Have you see getting started at https://algenty.github.io/flowcharting-repository/STARTED.html Documentation at https://algenty.github.io/flowcharting-repository/

Flowcharting not change metrics/request, it just to display it into graph

syedsfayaz commented 5 years ago

I dont have any metrics here. I have a plain table data with some values. I want to show these values on flow chart.

My table data looks like this.

I want to show these values on chart. And change the colour based on Buildstatus(0 or 1) 0 = success, 1 = failed

I created a chart like this using plugin on grafana Drawio.

I want to show

syedsfayaz commented 5 years ago

Update. When I run this as a table data I am seeing data in the output.

But the panel shows error.

algenty commented 5 years ago

Can you open console javascript, and copy/paste message. Try 0.4.0 version too, not release at this time try to change your request to return only one value

syedsfayaz commented 5 years ago

I also changed to single value result. I can see the sql result for table data but plugin shows error. Can I just download and untar the new version in to my grafana.

Panel data error: TypeError: Cannot read property 'length' of undefined
    at e.isMsResolutionNeeded (template_srv.ts:66)
    at new e (time_series2.ts:245)
    at FlowchartCtrl.seriesHandler (flowchart_ctrl.js:201)
    at Array.map (<anonymous>)
    at FlowchartCtrl.onDataReceived (flowchart_ctrl.js:125)
    at s.emit (index.js:150)
    at e.emit (actions.ts:29)
    at FlowchartCtrl.t.handleQueryResult (metrics_panel_ctrl.ts:247)
    at angular.js:17051
    at angular.js:17095
utils.js:243  INFO : ctrl.onRefresh() undefined
utils.js:243  INFO : ctrl.onRender() undefined
utils.js:243  INFO : ctrl.onDataReceived() undefined
utils.js:243  INFO : ctrl.seriesHandler() undefined
utils.js:243  INFO : ctrl.onRender() undefined
utils.js:243  INFO : flowchartHandler.render() undefined
utils.js:243  INFO : FlowchartHandler.refresh() undefined
utils.js:243  INFO : flowchart[Main].refresh() undefined
utils.js:243  INFO : XGraph.refreshGraph() undefined
metrics_panel_ctrl.ts:179 Panel data error: TypeError: Cannot read property 'length' of undefined
    at e.isMsResolutionNeeded (template_srv.ts:66)
    at new e (time_series2.ts:245)
    at FlowchartCtrl.seriesHandler (flowchart_ctrl.js:201)
    at Array.map (<anonymous>)
    at FlowchartCtrl.onDataReceived (flowchart_ctrl.js:125)
    at s.emit (index.js:150)
    at e.emit (actions.ts:29)
    at FlowchartCtrl.t.handleQueryResult (metrics_panel_ctrl.ts:247)
    at angular.js:17051
    at angular.js:17095

syedsfayaz commented 5 years ago

Copied new plugin to /var/lib/grafana/plugin directory and unzipped and restarted service. Still seeing error. Does this plugin not support string values.

Console output.

app.9d62d98149547e1107ad.js:1 store updating angular $location.url /d/928Vfraiz/table?tab=visualization&openVizPicker&orgId=1
app.9d62d98149547e1107ad.js:1 store updating angular $location.url /d/928Vfraiz/table?panelId=9&edit&fullscreen&tab=visualization&openVizPicker&orgId=1
jquery.js:9725 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
send @ jquery.js:9725
app.9d62d98149547e1107ad.js:1 store updating angular $location.url /d/928Vfraiz/table?tab=queries&panelId=9&edit&fullscreen&orgId=1
:3001/api/tsdb/query:1 Failed to load resource: the server responded with a status of 400 (Bad Request)
app.9d62d98149547e1107ad.js:1 Panel data error: Object
:3001/api/tsdb/query:1 Failed to load resource: the server responded with a status of 400 (Bad Request)
app.9d62d98149547e1107ad.js:1 Panel data error: Object
16app.9d62d98149547e1107ad.js:1 Panel data error: TypeError: Cannot read property 'length' of undefined
    at e.isMsResolutionNeeded (app.9d62d98149547e1107ad.js:1)
    at new e (app.9d62d98149547e1107ad.js:1)
    at FlowchartCtrl.seriesHandler (:3001/public/plugins/agenty-flowcharting-panel/flowchart_ctrl.js:222)
    at Array.map (<anonymous>)
    at FlowchartCtrl.onDataReceived (:3001/public/plugins/agenty-flowcharting-panel/flowchart_ctrl.js:135)
    at s.emit (vendor.9d62d98149547e1107ad.js:103)
    at e.emit (app.9d62d98149547e1107ad.js:1)
    at FlowchartCtrl.t.handleQueryResult (app.9d62d98149547e1107ad.js:1)
    at vendor.9d62d98149547e1107ad.js:147
    at vendor.9d62d98149547e1107ad.js:147

algenty commented 5 years ago

can you give me your xml graph please ?

syedsfayaz commented 5 years ago

Do let me know if this is not what you are asking.

algenty commented 5 years ago

its not in xml def, it's in your SQL request, must be return only one column with the time. I think its a good idea for next release to select column for metric but at this time flowcharting like diagram or status panel support only one column like it select time, mymetric from my table => OK sellect time, mymetric1, mymetric2 from table => KO

In your case, you must build 4 request select time,buildMo from ... select setup from ... ect

BR Arnaud,

PS : I have non database in mysql, i'll try to install it and test

syedsfayaz commented 5 years ago

I tried this but am not getting any results. Its in time series format. Looks like its not liking the table format data.

When I switch to table format I see this error. As you said I have removed all except kept one metrics.

XML output. <mxGraphModel dx="786" dy="589" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="827" pageHeight="1169" math="0" shadow="0"><root><mxCell id="0"/><mxCell id="1" parent="0"/><mxCell id="27" value="" style="shape=step;perimeter=stepPerimeter;whiteSpace=wrap;html=1;fixedSize=1;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333;" vertex="1" parent="1"><mxGeometry x="40" y="180" width="190" height="80" as="geometry"/></mxCell><mxCell id="28" value="" style="shape=step;perimeter=stepPerimeter;whiteSpace=wrap;html=1;fixedSize=1;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333;" vertex="1" parent="1"><mxGeometry x="220" y="180" width="190" height="80" as="geometry"/></mxCell><mxCell id="29" value="" style="shape=step;perimeter=stepPerimeter;whiteSpace=wrap;html=1;fixedSize=1;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333;" vertex="1" parent="1"><mxGeometry x="400" y="180" width="190" height="80" as="geometry"/></mxCell><mxCell id="30" value="" style="shape=step;perimeter=stepPerimeter;whiteSpace=wrap;html=1;fixedSize=1;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333;" vertex="1" parent="1"><mxGeometry x="580" y="180" width="190" height="80" as="geometry"/></mxCell></root></mxGraphModel>

store updating angular $location.url /d/928Vfraiz/table?tab=queries&panelId=9&edit&fullscreen&orgId=1
:3001/api/tsdb/query:1 Failed to load resource: the server responded with a status of 400 (Bad Request)
app.9d62d98149547e1107ad.js:1 Panel data error: Object
:3001/api/tsdb/query:1 Failed to load resource: the server responded with a status of 400 (Bad Request)
app.9d62d98149547e1107ad.js:1 Panel data error: Object
2app.9d62d98149547e1107ad.js:1 Panel data error: TypeError: Cannot read property 'length' of undefined
    at e.isMsResolutionNeeded (app.9d62d98149547e1107ad.js:1)
    at new e (app.9d62d98149547e1107ad.js:1)
    at FlowchartCtrl.seriesHandler (:3001/public/plugins/agenty-flowcharting-panel/flowchart_ctrl.js:222)
    at Array.map (<anonymous>)
    at FlowchartCtrl.onDataReceived (:3001/public/plugins/agenty-flowcharting-panel/flowchart_ctrl.js:135)
    at s.emit (vendor.9d62d98149547e1107ad.js:103)
    at e.emit (app.9d62d98149547e1107ad.js:1)
    at FlowchartCtrl.t.handleQueryResult (app.9d62d98149547e1107ad.js:1)
    at vendor.9d62d98149547e1107ad.js:147
    at vendor.9d62d98149547e1107ad.js:147
app.9d62d98149547e1107ad.js:1 store updating angular $location.url /d/928Vfraiz/table?tab=visualization&panelId=9&edit&fullscreen&orgId=1
app.9d62d98149547e1107ad.js:1 store updating angular $location.url /d/928Vfraiz/table?tab=queries&panelId=9&edit&fullscreen&orgId=1
4app.9d62d98149547e1107ad.js:1 Panel data error: TypeError: Cannot read property 'length' of undefined
    at e.isMsResolutionNeeded (app.9d62d98149547e1107ad.js:1)
    at new e (app.9d62d98149547e1107ad.js:1)
    at FlowchartCtrl.seriesHandler (:3001/public/plugins/agenty-flowcharting-panel/flowchart_ctrl.js:222)
    at Array.map (<anonymous>)
    at FlowchartCtrl.onDataReceived (:3001/public/plugins/agenty-flowcharting-panel/flowchart_ctrl.js:135)
    at s.emit (vendor.9d62d98149547e1107ad.js:103)
    at e.emit (app.9d62d98149547e1107ad.js:1)
    at FlowchartCtrl.t.handleQueryResult (app.9d62d98149547e1107ad.js:1)
    at vendor.9d62d98149547e1107ad.js:147
    at vendor.9d62d98149547e1107ad.js:147
app.9d62d98149547e1107ad.js:1 store updating angular $location.url /d/928Vfraiz/table?tab=visualization&panelId=9&edit&fullscreen&orgId=1

algenty commented 5 years ago

i have installed mariadb, i'll try this week end

syedsfayaz commented 5 years ago

Can you please adjust your plugin so that it also works for table data not just time series data.

syedsfayaz commented 5 years ago

@algenty After some trying I was able to get one value displayed on the pane. But I am only able to get one value that is integer and able to show by running "timeseries" query and its showing only numbers not string or text data.

When I change this to table format the error comes.

ehasting commented 5 years ago

Hello,

First! Awesome work with this plugin!

i can agree that i am seeing same behaviour using PostgreSQL. It works fine with series and number value to be able to trigger color behaviour of diagram! - but text-data can not be displayed on object id.

...'length' of property undefined using Table as query output and Value column must have numeric datatype...

algenty commented 5 years ago

Hi, Congratulation :) Yes i know, for the moment, only number can be display, i'll work on it

algenty commented 5 years ago

Try last 0.4.0, it support string values. For information, Flowcharting support only time series

algenty commented 4 years ago

Can you try experimental version at https://algenty.github.io/flowcharting-repository/ARCHIVES.html

algenty / grafana-flowcharting

Does this support Mysql database. #33