I am creating a map and would like show sensor name and last value in a popup when the mouse is passed on under the connectionline.
Connectionline on-mouseover (tooltip - ptip - popover)
Article Comments
To view the last intervals of traffic interfaces I added a custom tooltip .
Items added to the Status Icons ( Tooltip , linklong , animate - flicker )
<- Status Icons : Status and Last Value ( transparen ) Custom Sensor ->
<div class="map_object map_icon map_icon_large mapicon_status_transparent" id="<@itemid>" objectid="<@objectid>" subid="<@subid>" style="<#mapobject type="topleftcoordinates" subid="<@subid>" mode="<@editmode>">">
<#mapobject type="objectgrip" mode="<@editmode>">
<#mapobject type="htmlbefore" subid="<@subid>">
<a href="/sensor.htm?id=<@objectid>" show="linklong">
<div data-toggle="tooltip" data-placement="top"
title=" <b> Switch: <#objectproperty name="ParentDevice" show="text" id="<@objectid>">
<p>Interface: <#objectproperty name="Name" id="<@objectid>">
<p>Tráfego: <#objectstatus name="lastvalue" id="<@objectid>"></b>">
<div class="animate-flicker"> <#objectstatus name="downsens" id="<@objectid>">
<#objectstatus name="warnsens" id="<@objectid>"> </div>
<#objectstatus name="partialdownsens" id="<@objectid>">
<#objectstatus name="downacksens" id="<@objectid>">
<#objectstatus name="upsens" id="<@objectid>">
<#objectstatus name="pausedsens" id="<@objectid>">
<#objectstatus name="unusualsens" id="<@objectid>">
<#objectstatus name="undefinedsens" id="<@objectid>">
<#mapobject type="htmlafter" subid="<@subid>"> </a>
<#mapobject type="htmlafter" subid="<@subid>">
</div>
</div>
Aug, 2015 - Permalink
Could you add some more details for that? Sounds interesting, but as of right now, it doesn't work correctly. Is some custom CSS missing?
Aug, 2015 - Permalink
I added an animation for sensors with status dwon using the class ( animate - flicker )
Paste the data below the file ( styles_custom.css ) .
.withfadeout {
-webkit-transition: all 10s ease-in-out;
-moz-transition: all 10s ease-in-out;
-ms-transition: all 10s ease-in-out;
-o-transition: all 10s ease-in-out;
transition: all 10s ease-in-out;
}
@keyframes flickerAnimation { /* flame pulses */
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
.animate-flicker {
opacity:1;
animation: flickerAnimation 5s infinite;
}
Aug, 2015 - Permalink
Hi,
Sorry, that won't work - you'll need to put the last value object beneath the line,
that's how it would work. No popover though :)
Jul, 2015 - Permalink