Share My Creation Global Temperature Anomalies - Heatmap Custom View

Hi,

Maybe you guys saw these graphs, showing the global temperature as a vertical bar chart.

I think those charts are very easy to understand, and that particular one raised Global Warming awareness a lot, because it displays scientific data in a more appealing representation.

So I was wondering if I could do it in B4J, and I found this post on reddit, which has a link to temperature data in the comments. I thought, I should do it for B4J, that way I can raise awareness for global warming on this forum!

So I think I did a good job in finding an efficient way to make it in B4J:
Capture1.PNG


The Heatmap is implemented as a custom view. It's using a canvas to make the chart. It can display the graph as full size vertical lines, or scaled according to the data.

To produce the gradient, I use BitmapCreator and create a gradient in memory. This way I can produce a gradient with many color steps. I just then have to "GetPixel" at the correct normalized position in the heatmap. It's much easier than trying to blend the colors together (which is what I did at the beginning).

The controls are like this:
  • Middle click + drag: zoom in, zoom out
  • Right click + drag: pan left / right the graph
  • Double Right Click: reset zoom

I've attached the project source. Run it in release mode to improve the framerate. You can use this library in your projects, but I'm not going to provide support for it, so I don't release it as a library.

Enjoy, and spread the word to save the planet!

DISCLAIMER: All source data from this website: http://berkeleyearth.lbl.gov
 

Attachments

  • Capture2.PNG
    Capture2.PNG
    84.4 KB · Views: 311
  • Capture3.PNG
    Capture3.PNG
    37.5 KB · Views: 295
  • TemperatureHeatmap_Source.zip
    73.5 KB · Views: 320

jmon

Well-Known Member
Licensed User
Longtime User
Change the color gradient, for more contrast, or different colors:
B4X:
hm.SetColorRange(Array As Int(xui.Color_ARGB(255, 1, 1, 80), _
    xui.Color_ARGB(255, 27, 72, 249), _
    xui.Color_ARGB(255, 255, 255, 255), _
    xui.Color_ARGB(255, 255, 137, 2), _
    xui.Color_ARGB(255, 255, 1, 1)))
Capture4.PNG
 

jmon

Well-Known Member
Licensed User
Longtime User
-1126 degree to plus 1125 degree?
hehe, yes, that would be concerning :)

maybe my windows locale are different from your computer. I didn't add the "." my self
 
Top