Build a Framework7 gauge
f7Gauge( id, type = "circle", value, size = 200, bgColor = "transparent", borderBgColor = "#eeeeee", borderColor = "#000000", borderWidth = "10", valueTextColor = "#000000", valueFontSize = "31", valueFontWeight = "500", labelText = NULL, labelTextColor = "#888888", labelFontSize = "14", labelFontWeight = "400" )
id | Gauge ID. |
---|---|
type | Gauge type. Can be "circle" or "semicircle". Default is "circle." |
value | Gauge value/percentage. Must be a number between 0 and 100. |
size | Generated SVG image size (in px). Default is 200. |
bgColor | Gauge background color. Can be any valid color string, e.g. #ff00ff, rgb(0,0,255), etc. Default is "transparent". |
borderBgColor | Main border/stroke background color. |
borderColor | Main border/stroke color. |
borderWidth | Main border/stroke width. |
valueTextColor | Value text color. |
valueFontSize | Value text font size. |
valueFontWeight | Value text font weight. |
labelText | Gauge additional label text. |
labelTextColor | Label text color. |
labelFontSize | Label text font size. |
labelFontWeight | Label text font weight. |
David Granjon dgranjon@ymail.com
if(interactive()){ library(shiny) library(shinyMobile) shinyApp( ui = f7Page( title = "Gauges", f7SingleLayout( navbar = f7Navbar(title = "f7Gauge"), f7Block( f7Gauge( id = "mygauge", type = "semicircle", value = 50, borderColor = "#2196f3", borderWidth = 10, valueFontSize = 41, valueTextColor = "#2196f3", labelText = "amount of something" ) ) ) ), server = function(input, output) {} ) }