Solar Power Flow Animations in Sitemaps

People have kindly posted UI widgets for solar power flow animations. And I was wondering if would be possible to do something similar in a regular sitemap. And the answer is definitely yes!

sitemap-solar-animation

NOTE: it is important to know that OH sitemaps require .PNG icons; and fortunately the PNG format does support animated images.

My sitemap code is here…

Frame {
    // top line
    Text icon="none" label=""
    Text item=Solar_DC_Power icon=[>0=arrowdowngreen, hourglass]
    Text icon="none" label=""
    // middle line
    Text item=Battery_Charge_Power icon="arrowleftgreen" visibility=[>0]
    Text item=Battery_Discharge_Power icon="arrowrightred" visibility=[<0]
    Text item=Battery_Discharge_Power label="Battery (Dis)charge Power" icon="hourglass" visibility=[Battery_Charge_Power==0 AND Battery_Discharge_Power==0]
    Text item=Inverter_System_Status_Code label="SOLAR INVERTER [status code: %d]" icon="inverter"
    Text item=Electricity_Load_Power icon="arrowrightred"
    // bottom line
    Text icon="none" label=""
    Text item=Electricity_Import_Power icon="arrowupred" visibility=[>0] 
    Text item=Electricity_Export_Power icon="arrowdowngreen" visibility=[<0]
    Text item=Electricity_Export_Power label="Electricity Import/Export Power" icon="hourglass" visibility=[Electricity_Import_Power==0 AND Electricity_Export_Power==0]
    Text icon="none" label=""
}

And the icons are here…

arrowdowngreen
arrowupred
arrowleftgreen
arrowrightred
hourglass
inverter

Note: Animated icons created by Freepik - Flaticon

8 Likes