Add heatmap plot widget

[JohannesProgrammiert]

Add widget for heatmap plot. Takes ImPlot as inspiration.

Preview:

demo.webm

TODO before ready

• [ ] Update CHANGELOG.md
• [x] update egui_demo_lib
• [ ] cargo fmt and clippy and ./sh/check.sh
• [x] debug color mapping
• [x] merge https://github.com/emilk/egui/pull/2284 and close https://github.com/emilk/egui/issues/889

Closes https://github.com/emilk/egui/issues/2245.

[wlwatkins]

I see in the commit that you're working on Interpolation between the point, I believe that this is some sort of blueing between pixels. If so, is it going to be optional?

[wlwatkins]

I tried the implementation, but it gets very laggy when loading relatively large arrays. I tried your example and it works fine, but when loading a 1200x360px the whole ui is unresponsive. Do you think the issue is with egui itself? compared to the example in imgui where we see the high fps white noise, i think there still some work to do...

[voelklmichael]

Hi, I'm working on a heatmap widget for egui. If you want to take a look: egui_heatmap

[JohannesProgrammiert]

I believe that this is some sort of blueing between pixels. If so, is it going to be optional?

I don't understand, sorry. I map user-defined colors to a user-defined resolution, i.e. a number of color-steps. For example, if a user defines the colors [black, red, white] and specifies RESOLUTION = 5 it is linearly interpolated to [black, dark-red, red, light-red, white]. Then, data values are mapped to one of the 5 colors. If you don't want any interpolation just specify a RESOLUTION that matches your number of colors.

but when loading a 1200x360px the whole ui is unresponsive

Yes, the implementation is very basic, drawing each data point one-by-one, as primitive. For large amounts of data, this becomes inefficient. 1200x360 is basically an image ... maybe we can draw the map in the same way we would draw an actual bitmap image, but it would require some more time and investment.

I think it is a good start to get some inspiration from the imgui source code.

Hi, I'm working on a heatmap widget for egui.

Hi, I tested your examples. Good work, but it is laggy for me, too, and for some reason the UI looks distorted. If you manage to resolve the hickups feel free to replace this MR with yours.

[JohannesProgrammiert]

Example added to the demo lib:

[JohannesProgrammiert]

Recently, I implemented a polar plot widget for ImGui using GLSL shaders. I needed it to visualize radar spectrum data. It takes a two-dimensional array as input and performs a color mapping and then an (optional) transformation to polar coordinate space. With GPU acceleration, this runs smoothly even for larger arrays.

It could be used here to greatly improve performance.

Is it possible (and reasonable) to use shaders in egui-plot widgets? Or are there some major issues with it? Interestingly, large realtime heatmap plots is a feature not even available in ImPlot.

[watsaig]

@JohannesProgrammiert the heatmap looks great -- is there any reason this PR is still in progress?

[JohannesProgrammiert]

Some reasons:

• It is not rebased on current master
• I did not yet consider emilk's review (thanks a lot, btw)
• the performance is not as good as imgui's. It can be greatly improved using shaders but I don't know how complicated that is in terms of integration and compatibility.

But generally, it works and could be merged to provide an "early access" version of this feature.

[wlwatkins]

i remember trying this out a few months back and it worked good enough for a mvp. Do you have an idea of the timeline? I remember this was the missing widet for me to switch to egui and rust in general for production. I'll clone this and update my code as it seems to conflict with the latest branch, but if you are about to merge it within the next few weeks, i might just wait ;)

[jjimenezroda]

Not sure if it is covered, but it would be great to be able to set a background image so that you could use a heatmap on top of it to represent different aspects (e.g. a map and on top the heatmap to represent temperatures).

[emilk]

egui_plot has recently been moved to its own repository, at https://github.com/emilk/egui_plot

This will hopefully speed up its development by having more reviewers and maintainers.

Please re-open this PR at https://github.com/emilk/egui_plot/pulls

See also:

• https://github.com/emilk/egui/issues/4705
• https://github.com/emilk/egui/pull/4828