[smartly] custom temperature gradient HOWTO

[spelcheck]

Continuing the discussion from [smartly] bug report and support thread:

@lgkahn

ok but if i want to customize to my own color template what do i need to do… and i assume i need to run it back through smartly…

The default values for F (auto detected F/C btw) using the values below make a gradient that looks like this:

-30, 15, 32, 33, 70, 90, 100, 120

You can override them, though!

Under the color tab when editing the tile in SMARTLY, you’ll see some help text below the input box. Currently we are only supporting a single gradient color-scheme, but in the future we’ll allow creating our own.

So, the gradient is roughly purple > blue > light blue > green > yellow > orange > red.

 
The default values are in the help text, so if you wanted to just tweak it so your “comfortable” temperature is 20 degrees lower (moving the green of the gradient down 20 degrees) for F, you’d use:

NUMBERS, COMMAS AND SPACES ONLY

-30, 15, 32, 33, 50, 90, 100, 120

Or if you wanted to lose the hard edge from 32 to 33 degrees, you can have a tighter green “comfortable” range by using:

-30, 15, 32, 50, 60, 70, 100, 120

Anyways, play with the values and if you make a good recipe post it here.

---

 

[lgkahn]

thanks … will leave alone for now since mine has about 30 colors… if i run it back throuh smartly though can i get teh truncation somehow for all temperature tiles?

[spelcheck]

I’ve added a screenshot of the default color gradient to the OP. Look above

[lgkahn]

looks good ill give it a try on the test dashboard… i did notice when i ran my existing through smartly there is an issue after pasting back that the smartly tile is not being hidden.

also if you use the global setting since i dont want to do it for 50 tiles. where do you paste the gradient in… i only see a checkbox and a place to paste the battery gradient in?

[spelcheck]

@lgkahn

issue after pasting back that the smartly tile is not being hidden.

That normally means smartly-inject is not loading correctly.

[lgkahn]

its loading becuase i can enlarge and move the tiles around?
it disappears when i click on the paw and enable it and move stuff around… comes back when i turn it off?

[lgkahn]

also when i check the global color box and go back it is unchecked and when i paste my values stil lhave decimal pts.

[lgkahn]

working find now when i ran it through again. go figure… there colors are a little too neon for me. i perfer like i did to change colors only every 10% or so and a little darker green etc.

Summary

ie

and i guess it rounds off just to calculate the color tile but then uses the full temp… nice

also why are some black text and some white…

[spelcheck]

@lgkahn

also why are some black text and some white…

It’s a visibility calculation in chroma.js, to determine whether or not to use black or white text. It breaks on the 50% mark of luminosity, but we might want to bias it in one direction or the other at some point in the future.

[lgkahn]

also another slight issue when the temp code kicks in. it is blowing away the transparency i have set for the tiles… see the existing page…

Summary

[spelcheck]

I’m sorry my friend, that will need to be a future feature… I’m thinking a dropdown for ‘transparency’.

temperature chroma post-processing transparencies

[lgkahn]

there seems to be some issue with the overriding color for an indiv. tile… it is not changing the color of the first tile regardless if i set the green at 50 60 or 70

ie

Summary

its not letting me make any more replies say 20 max try again tommorrow… i just removed all the spaces still not working

you mean get rid of the f for farenheit then it really is not working as default comes out yellow instead of green

[spelcheck]

apologies instructions are unclear, the only thing that should be in that field are numbers and commas.

[spelcheck]

@lgkahn

you mean get rid of the f for farenheit then it really is not working as default comes out yellow instead of green

no that’s correct, 69 degrees would be 2/3 the way between green to yellow.

-10 purple
10 purple to blue (from -10)
20 blue to light blue (from 10)
40 light blue to green (from 20)
50 green to green (from 40)
80 green to yellow (from 50)
100 yellow to orange (from 80)
120 orange to red (from 100)

with your values, 40-50 is your green band

[spelcheck]

@lgkahn

also if you use the global setting since i dont want to do it for 50 tiles. where do you paste the gradient in… i only see a checkbox and a place to paste the battery gradient in?

currently the temperature gradient can only be overridden at the tile level… so by default it’ll just be the gradient posted in the OP

[BlueMoon23]

Still playing with the latest Smartly, but spotted that the color gradient is working locally, but when I access via the cloud, it remains a purple color. Is the gradient intended to work on only the local dashboard?

[spelcheck]

Please give it a try now! You might need to shift+refresh but please try a normal refresh first.

[BlueMoon23]

Hi,

Yes, it works with a refresh, but every time I load a (cloud) dashboard, I then need to do a refresh. Can the refresh be built in to the load page sequence?

[spelcheck]

Hmm, it shouldn’t need a refresh after loading the dash. I’ll take a look. Meantime could you try in an incognito window to rule out browser caching issues?

[BlueMoon23]

You could be right with the Browser caching or it could be Firefox specific. I tried it on my Tablet in Chrome and it worked fine, I tried it in private mode in Firefox and it also worked fine, it’s just FF normal that it’s not updating without a refresh.