I don’t think this response was sufficiently targeted to the request. I have a different use case for the same feature, i.e. to have a time-series thumbnail image as the data presented in one cell of a table. See this image for an example:
I’m using open source grafana-9.4.3-r1, my data source is VictoriaMetrics (Prometheus/PromQL) and I have set up tables joining multiple data sources and played with the different options… but nothing like a little thumbnail timeseries graph for a cell. I could probably create a monstronsity of saved images with a specific naming convention and then use a generic image link plugin, but it seems to be a common scenario that would benefit from having a native plugin to support it (and rely on browser-side rendering of thumbnails rather than centralizing in an image rendering server).
I am also interested in this type of visualization. The closest I found are these small time series graphs Small multiples in Grafana | Nelson's log but I would like to have them in a table cell, just like Grafana can do with gauges, for example
Apache ECharts does not have a table functionality. Of course, you can add custom functionality.
We are thinking of creating a new table plugin based on the new Experimental InteractiveTable component (Webpack App), which will work great for this use case.
@oestape: I have played with similar small charts, but I need to display supplemental information with them in my scenario. So that means I need to use a repeating row variable to add extra widgets along side the small graph. Here is an example of my current “state of the art” to make small tables:
There are 2 big problems:
The row widget itself claims a lot of wasted vertical space that I would like to be compact like a table row. Hence the request for a new type of object (timeseries panel thumbnail) to go in a table cell.
The timeseries panel widget does not have an easily editable “padding” option to decrease the internal borders. As a consequence, the usable space for the graph itself is too tiny to be useful for the external dimensions I want for the panel, even when all the easily adjustable options are turned off to just leave the charted data. That is a separate request!
Note: I did squeeze in some of the extra data I wanted as a legend in table mode set to the right of the chart. But that only works for data that can be extracted/regexed from labels. That combined with making the graphs the minimal size with a useful image results in the following… still much bigger than I would like and not satisfying for the end users (note: click on the image to see actual size pixels, as rendered on a typical work laptop screen).
I need to cut the vertical real estate in half or a quarter, in part by using tables and in part by removing the fixed padding that is wasted in this panel use case.
@mikhailvolkov This looks like an interesting solution. I didn’t quite understand if the work of transforming the datapoints to an image can be offloaded to the client browser or if we’d need a server for generating this code that would scale up as the number of users and requests increases. Please post back here if/when you develop a prototype or product with this.
One thing that I haven’t figured out yet is how to set the minimum vertical range in the graph like in the regular timeseries panel, so we aren’t distracted by tiny values that look significant. I want to see those as a nearly flat line close to zero so eyes are only drawn to the values over a certain magnitude. In other words, I don’t care about 6 milli-packets per second, but it jumps out in this rendering and I don’t know how to squash it.
