Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Temperature Heatmap, it is possible? #483

Open
Trikos opened this issue Nov 17, 2024 · 1 comment
Open

Temperature Heatmap, it is possible? #483

Trikos opened this issue Nov 17, 2024 · 1 comment
Labels
enhancement New feature or request

Comments

@Trikos
Copy link

Trikos commented Nov 17, 2024

Here’s a corrected and polished version:

I’m looking for a library that can display temperature sensors as a heatmap, creating a colored graph similar to those seen on weather channels.
IMG_0324

Instead of a map of American states, I’d like to visualize my house’s layout (viewed from above) to get a real-time temperature heatmap of the rooms and walls.

Is this possible?

The graph only needs a way to:
• Define the outline of the house (e.g., using a paint-style image or a simple layout sketch).
• Position the sensors at specific (x, y) coordinates, such as near a wall or in precise locations.
• Automatically blend colors between hot and cold areas where sensor ranges overlap.

Additionally, it would be great if:
1. The sensor heatmap starts with a circular area around each sensor and expands as their values dictate.
2. Overlapping areas merge smoothly to show a continuous gradient.
3. The radius of each sensor’s influence could be adjustable (e.g., in meters).

Do you think I’m dreaming?

@Trikos Trikos added the enhancement New feature or request label Nov 17, 2024
@dbuezas
Copy link
Owner

dbuezas commented Nov 17, 2024

You're definitely dreaming, but it is a really cool idea!

This is how I would approach it:

  1. Put an image behind and make the plot area transparent like this user did: Transparent plotly-graph (e.g. for in Picture-Elements-Card) #48
  2. Create a variable with a matrix of say 10 x 10,
  3. Grab each temperature sensor and put their values in the approximate coordinates inside the matrix so they match with the sketch of your house. leave all cells which are not sensors as undefined
  4. Plot it as a heatmap e.g Heatmap of 30-Panel Solar Array's Current States #277
  5. Fill the undefined cells via interpolation. You'll have to create an algorithm for that which is not trivial
  6. Give up writing the algorithm from scratch, open ChatGPT and tell it something like

    i have a sparse matrix where some values are defined and some are undefined. Those are temperatures. Fill the undefined values of the matrix using interpolation in javascript. Put everything in a single function I can call with the matrix as a parameter`

Good luck and come back to say how it went! :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants