Weather tile help

I was able to use the OpenWeatherMap-NWS-Alerts-Weather-Driver driver which produced almost the same icon I had on ActionTiles. In case some other folks look for information regarding Sharptools dashboard and OpenWeather.

image

3 Likes

Other tiles available in this driver:
image
image
image
image

2 Likes

How do you get to these other tiles? New to Hubitat so still learning the ropes.

Thanks!

I copied this from another thread, but the concept is the same.

  1. Select the device,
  2. then 'attribute' then the attribute you want to show. (If it is an 'optional' attribute make sure you have it turned 'on' in the device preferences). The tile attributes are:
    image image image

image
The attributes show in the list as alertTile, myTile, threedayfsctTile and weatherSummary.

3 Likes

Your post inspired me to take a look at this. I have added the capability of a weather tile to HubiGraphs. I will be developing more features and options in coming weeks. Here is a link:

2 Likes

How did you get your tile to look this way?
Thanks!

@jake.breish, I have been learning and hobbying during the past four months playing with graphs, html etc. My wife has some very specific design ideas and my job is to realize them.

To answer your question, I created an app that creates a custom iframe which can be installed as an attribute on the dashboard tile. I try to make them as customizable as possible and not require extra hardware or software to be useful. The above tile, for example only requires an OpenWeather API key. You can modify the font sizes, icons colors, background, etc. All from the app. (I am working on modifying location of elements in the tile now). At this point, I have created Graph, Weather, Forecast, and Radar Tiles. See the HubiGraph thread for more.

I do not see the same thing in my title: Clearly my setup is not allowing for the icons or maybe I do not understand the concepts. Clearly I only see one attribute but I never see a icon or picture (you can see the tile to the left.)

Ah; you are selecting the API. You should select the tile device (the one created by the toggle).

How do you get rid of the title header and footer though?

image

For any dashboard:

To hide the title (header) .... on the dashboard click the gear icon at the top right, click 'Options', then check the ' Hide Tile Template Names' box.

To hide the device name (footer) .... on the dashboard click the gear icon at the top right, click 'Advanced', click 'CSS', then add this line '.tile-title { visibility: hidden; }', then click 'Save CSS'.

Oh perfect, you are quite literally THE MAN

Is there any way to alter the CSS part for just some tiles? Like I want the footer on the other buttons because it tells me which light or door they are. But on the weather one it just overlaps stuff

I believe there is. I am not a CSS expert, so I will not guess how to do that. Suggest you search the forum for those discussions.

Each tile can be referenced individually in the CSS section using #tile-xx. Good starting point on CSS:

1 Like

I want to turn off the footer for the 3 day forecast which right now is showing what I called the device, i.e. "OpenWeather Virtual Device". I went into the Settings, (gear icon), clicked Advanced, then clicked on CSS and pasted this into the window and clicked the Save CSS button but nothing happened.

'.threedayfcstTile{ visibility: hidden; }'

BTW, I tried it with and without the single quotes and also with and without a space between threedayfcstTile and the {. None of those removed the footer.

Can you please tell me what I'm doing wrong?

Here is the tile (with the header showing so you can see the tile's title)

Here is the CSS code (in this shot I had removed the single quotes ''):
Screen Shot 2021-02-04 at 11.18.45 AM

One other question: I don't want the PoP on the 3 day forecast, but do what the wind info. I tried to turn off PoP items in the device's preferences and turn on the wind items, but it didn't change the tile. Is the 3 day forecast tile adjustable or is it fixed as is? If so, is there a way I can create a custom to tile to make those desired changes?

Try

.title-secondary {display:none}

As I stated above, I am not a CSS expert and I rarely use it. Did you try to use what I previously said?

add this line:
.tile-title { visibility: hidden; }

You should type that in exactly (or cut and paste) for it to work. It looks like you put in:

.threedayfcstTile { visibility: hidden; }

instead? I would not expect that to work.

That should remove the title from all the tiles on that dashboard. There is a way to specify specific tiles only by using their tile ID, but you will have to search the forum for CSS guidance on how to alter the CSS command to be tile specific.

The only way to remove 'PoP' from the threedayfcstTile is to alter the code in the driver. Turning off optional precipitation elements will prevent those individual attributes from being updated in the driver, but the pre-formatted tiles do not rely upon those individual selections.

Hope that helps.

Yea! That worked perfectly!! I thought that ".tile-title" was a place marker for us to put in the tile's title. When I put in what you had, i.e., .tile-title { visibility: hidden; } and then clicked Save CSS it worked perfectly.

BTW, as a note to Hubitat, it is very hard to tell when the Save CSS button was pushed. I'd suggest it is gray until a change is made. Once a change is made make it a darker color, and then revert it back to gray once it is pushed and the code is saved.

1 Like

im' really struggling to get a forcast tile working. I have been successful with a normal weather tile, but not a forecast tile. Is there a step by step post somewhere?

Look here.