关于markdown:Markdown取数函数让人惊艳的可视化

38次阅读

共计 1601 个字符,预计需要花费 5 分钟才能阅读完成。

Redash 中文版反对残缺的 Markdown 技术,之前曾经介绍过 markdown 能够增加视频接入监控的流媒体服务器等高级性能,大大拓展了传统大大拓展了传统 dashboard 的表现力。接下来咱们介绍 Redash 中 Markdown 的另外一个重要性能:取数函数

传统的 BI 或 Dashboard 侧重于数据图表展示,满屏全是数据和图表,短少图片、文字、视频等综合排版能力;博客等自媒体网站采纳的 Markdown 技术排版能力强,但图表能力弱。

而 Redash 中文版推出 markdown 部件,完满地展现了二者的长处。配合取数函数,轻松将数据展现进去,不必框置在固定的图表或者表格中,还能够增加各种让人惊艳的成果。

1、实时取数数据

案例如下:

<marquee behavior=”scroll” direction=”up” scrollamout=”3″ height=”200″ >

<font color=#ed912e size=3 >

{{“query”:123,”colName”:”id1″,”rowNumber”:0}}{{“query”:123,”colName”:”id2″,”rowNumber”:0}} {{“query”:123,”colName”:”id3″,”rowNumber”:0}}

{{“query”:123,”colName”:”id1″,”rowNumber”:0}}{{“query”:123,”colName”:”id2″,”rowNumber”:0}} {{“query”:123,”colName”:”id3″,”rowNumber”:0}}

{{“query”:123,”colName”:”id1″,”rowNumber”:0}}{{“query”:123,”colName”:”id2″,”rowNumber”:0}} {{“query”:123,”colName”:”id3″,”rowNumber”:0}}

</font>

</marquee>

//query 取查问,colName 别离取对应列名,rowNumber 取行数

数据滚动播放成果:

2、图文组合排版

Markdown 反对插入网络图片链接、svg 图片、视频、背景等多媒体,图文联合让可视化图表更自在,数据信息更活泼。

图文联合排版成果:

2、chart.js 图表展现:

Markdown 反对 chart.Js,极大的丰盛了图表款式。

在 markdown 编辑界面能够任意增加多种 chart 图表款式,同时反对取数函数取数据,数据能够通过 markdown 部件中 chart.js 图表展现进去,具体应用可参考 https://chartjs.bootcss.com/samples/

示例:


{"type": "polarArea","data": {"datasets": [{"data": ["{{"querys":123,"colName":"id","rowNumber":0}}",

"{{"querys":123,"colName":"id","rowNumber":1}}",

"{{"querys":123,"colName":"id","rowNumber":2}}",

"{{"querys":123,"colName":"id","rowNumber":3}}",

"{{"querys":123,"colName":"id","rowNumber":4}}"],"backgroundColor": ["#FF6384","#4BC0C0","#FFCE56","#E7E9ED","#36A2EB"],"label": "我的数据"}

],"labels": ["a","b","c","d","e"]},"options": {}}

//markdown 的代码块中取数函数须要用 querys 来取值,因为 redash 软件反对 Json 格局,须要在编辑器中批改案例格局

效果图:

正文完
 0