# How i can make a status panel in Kibana? **URL:** \ **Category:** Kibana\ **Tags:** vega\ **Created:** [January 7, 2022, 3:46pm UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765 "2022-01-07T15:46:46Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![Cap\_Ho](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/cap_ho/32/79703_2.png) [@Cap\_Ho](https://discuss.elastic.co/u/Cap_Ho)\ **Post date:** [January 7, 2022, 3:46pm UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765/1 "2022-01-07T15:46:46Z")
Most of the dashboard development may use the "status panel" to represent the on/off for service/server/machine. In Grafana , it have two libs: 1. [Status Panel plugin for Grafana | Grafana Labs](https://grafana.com/grafana/plugins/vonage-status-panel/) 2. [Stat | Grafana Labs](https://grafana.com/docs/grafana/latest/visualizations/stat-panel/) which may help to make something which a. display the status b. color changes based on the value ![image](https://us1.discourse-cdn.com/elastic/original/3X/d/7/d78e4cad0faca6013643bd4772d4a054f40dd655.png) i do try the following way in Kibana but none of them fulfill my need. My data set sample (i try to use Boolean , String and Integer to see which one work): {time:'2022/01/07 11:11:11', serviceName : "ServiceA", isServerOnBoolean : true, isServerOnString : 'On', isServerOnInteger : 1} 1. Using Metrics visualization by using "TopHit" with isServerOnString , i may display the status. But i cannot change the color since Metrics only accept color range based on numeric. If i use "TopHit" with "isServerOnInteger ", i may use the color range. But the metrics will display "ServiceA 1" which is strange.. 2. Using MarkDown in Tsvb i would like to use the MarkDown with Handlebar (using If) with Css to "visualize" the effect. But i found that the MarkDown in Tsvb don't support class. So i cannot use class to separate different css.(for example if isServerOnBoolean.TopHit.raw then using css table "on" class). 3. Vega Most of the time when elastic stack expert will told us to have a look on vega when the visualization is not provided. But i cannot find any similar sample on that. Anyone may have some suggestion for me? In Grafana it is very easy to make it. But in Kibana i found that it is difficult for me. thx ---
**Author:** ![flash1293](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/flash1293/32/41227_2.png) [@flash1293](https://discuss.elastic.co/u/flash1293)\ **Post date:** [January 13, 2022, 10:44am UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765/2 "2022-01-13T10:44:16Z")
The color formatter on a string field allows you to specify matching patterns also for strings: ![Screenshot 2022-01-13 at 11.42.27](https://us1.discourse-cdn.com/elastic/original/3X/b/e/becbd6017d1abfa5fc62947794c8688ccc1d2707.png) ![Screenshot 2022-01-13 at 11.42.57](https://us1.discourse-cdn.com/elastic/original/3X/8/b/8b254dc21e27aaa491f820cae8a84f76acd4cee4.png) Would that fit your use case? I agree that we should provide that as a high-level functionality though, I will bring it up with the team. ---
**Author:** ![leandrojmp](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/leandrojmp/32/107231_2.png) [@leandrojmp](https://discuss.elastic.co/u/leandrojmp)\ **Post date:** [January 13, 2022, 2:25pm UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765/3 "2022-01-13T14:25:38Z")
@flash1293 Is there any issue with a feature request for a visualization like the one shared by the OP? I had a similar need sometime ago when I was trying to move my monitoring dashboards from Grafana to Kibana and gave up because it was not possible to easily have a visualization like that in Kibana. Changing only the color of the text does not help as it is pretty common to have this kind of visualization on TVs and a squared filled with color is way easy to see. If there is an open issue with this feature request I would happily give my input. ---
**Author:** ![aaron-nimocks](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aaron-nimocks/32/73965_2.png) [@aaron-nimocks](https://discuss.elastic.co/u/aaron-nimocks)\ **Post date:** [January 13, 2022, 3:49pm UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765/4 "2022-01-13T15:49:19Z")
Here is a [quick proof of concept in Vega](https://vega.github.io/editor/#/url/vega/N4IgJAzgxgFgpgWwIYgFwhgF0wBwqgegIDc4BzJAOjIEtMYBXAI0poHsDp5kTykSArJQBWENgDsQAGhAB3GgBN6aAIwAGDWpnwaZLGgAsGmTiQKFNcWTQCZCpJhSoA2qHFIEcNCEdMANl4yxEh+DHAQaK4gAF4SXugACgBKACLSIBCOZPEqMgBObLKqMpkODBHoeXAK6RDhEOziFeoA7ABMMggQ1uggAL5SoLHi8SDJaSVZ8R0gBUWouRmOmOXeZFVwkiX1jRUAbGoGnd3e-YMxcd7jtVNoAMz5hcVLZRUg63CbtTsSFS3HPRAZyGl0SqRuSGyhke80WpRWbwAnnA-H4ntsIA1fmg2osuoCABJwJA4AAEAGUaNEvAMQSMruDJpD4rZZk8FkyEWsNlsMj8mvc2jN8adaRd6WCJi8oag9jDnvDVugPl8MViBQsBABOAGi87DUbXJky-5s2GcpXvHnfTG7e4GYUnXpig0MqWlGUADnlHJeXMq1Rt6oqbTu3pAIvQAEkAPLA8WGxnS+I6s0K5aWlW8uq27GyrQRp1Al2gsZJj05AtzdOvbmfbP8ip3O5ywuA+OuyUQmUqRbV32Kt5ZoN21B3VmR4v60tG5OqGb9uEZofWtWjgSmycd0vkgAqAHFuzkfTNB3XVXzcxqC1uSxKQHvD8bpieLUiUWiimu81qjm3vAAsogbB5IipIADLEgA1tu96Pke9yvn6marpewZoDeRawaM8HPtCaaoKey7ng2V4VJh7Z3jhB4IagrL9kRtbKqhOboagFF6nS1FPnOspIWezH1iOeYcc605wTReGoKaDFviRwnXrqYlcd4uG8eGsnIe+qLomho4GAI4aTrG2GqZJvGpppAlWkJ36Kf+ykJmZPEVqoVbsox-o2RerGjqJU4qegamuQsfYeXJAY1HZzQCMYDkgLuNCeGwDCYBAAA6eTpeICRIFAUFwJgEFsJiplBeZIUqAu4VafJ0UYUpxYALp9E1JRQCE4SRG4HijAAHtAnXpJgiI4KMTBIOIUUgAobDIJYaCgPYjjeL4ATpAAZjQKI1OgrkDLMk0yqAmRwDg85qAdpjmJYZBRuIIx5PcYruJ43iIoN60yCNY3eBNU3pLN82SKgS0OE4PhIP4gQgFtO3eNWB15Ed8QnZgZ0XX0rWdEgeRQRUUSveNbB9TGqVwE932jaMVRQJgm0FAgi0zeDq1Q+tB2bFAbAKKjICbOjT2g7DNCoszcN+LttUHX1zOff18ubdtkvePtMiInLHXregH1azDEtS4jMjyEoMDM8EoQppd2hwLo+jCxbYRuZdWMvb13iulTv3oOjfX0zIG2M8zy0Q2tNIyFzPN8wLFPM7LwuK+gA160r8N7bcMhsBtG11PTY7WyAGsJynOuKwHyuG7pWc54VOIF77eegAbHuXAdIS6CDoCO6MUAx09rtu296fMsN1OrXAfsM3Nwesz77Ph-z4jc7zzN93HmtDUnZci2nc6Z9nuc2AXRcnSXhfb83lRVwfteEfXE+NzvKvD1Cbd+B35shE76C9+Igv9K7c4RNVaNlHt7HwD8p5M2FiHNm0MziL2XtHP+sdhbx1PpvEAychrl13q5feNc85tAEAdE+GQz66xwU-SuX4QDV0PqgIwB0G6f0tqpUBb8P4Oy-j3NeA8gHuz2o2AAtOIBgCAmCxy9qMFhAcg4wNnpDeBnMl5R1XigoWoB0HkMwdgr61DVYZzoTfPOBxSEb21ufFOuDn5pgIQwph31IHC0vnpbEnCyCdxAN3bwv9-4DxakAA). It's incomplete and could use some styling and centering but it might give you an idea how this can be done there. ![image](https://us1.discourse-cdn.com/elastic/original/3X/a/d/ad133a8319a24aff3c890bfd966afdc8d29dce45.png) ---
**Author:** ![flash1293](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/flash1293/32/41227_2.png) [@flash1293](https://discuss.elastic.co/u/flash1293)\ **Post date:** [January 14, 2022, 8:48am UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765/5 "2022-01-14T08:48:30Z")
It's a bunch of different features coming together to make this possible in Lens: - Allow conditional coloring for metrics [[Lens] Allow palette configuration for metric by dej611 · Pull Request #116170 · elastic/kibana · GitHub](https://github.com/elastic/kibana/pull/116170) and [[Lens] Make metric color fill the entire space by dej611 · Pull Request #122091 · elastic/kibana · GitHub](https://github.com/elastic/kibana/pull/122091) (will ship in 8.1) - Breakdown dimension for metrics [[Lens] Support a "break down by" option for the Metric chart type · Issue #79015 · elastic/kibana · GitHub](https://github.com/elastic/kibana/issues/79015) - Extend conditional colorings to color by term [[Lens] Support categorical coloring by name · Issue #101942 · elastic/kibana · GitHub](https://github.com/elastic/kibana/issues/101942) - Allow "last value" of string [[Lens] unable to add last value of date/string field · Issue #104787 · elastic/kibana · GitHub](https://github.com/elastic/kibana/issues/104787) It won't be in 8.1 but this kind of features is exactly what we are targeting at the moment. ---
**Author:** ![leandrojmp](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/leandrojmp/32/107231_2.png) [@leandrojmp](https://discuss.elastic.co/u/leandrojmp)\ **Post date:** [January 14, 2022, 1:09pm UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765/6 "2022-01-14T13:09:44Z")
Just looked into the issues and they are exactly what I was waiting to be able to do, pretty great! ---
**Author:** ![Cap\_Ho](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/cap_ho/32/79703_2.png) [@Cap\_Ho](https://discuss.elastic.co/u/Cap_Ho)\ **Post date:** [January 15, 2022, 3:54pm UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765/7 "2022-01-15T15:54:29Z")
it look great! thx @aaron-nimocks i am very new to Vega. So i don't know how to make it. Your POC help me a lot! ---
**Author:** ![Cap\_Ho](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/cap_ho/32/79703_2.png) [@Cap\_Ho](https://discuss.elastic.co/u/Cap_Ho)\ **Post date:** [January 15, 2022, 3:56pm UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765/8 "2022-01-15T15:56:15Z")
Looking forward for this! Thx @flash1293 ---
**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\ **Post date:** [February 12, 2022, 3:56pm UTC](https://discuss.elastic.co/t/how-i-can-make-a-status-panel-in-kibana/293765/9 "2022-02-12T15:56:45Z")
This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.