Skip to content

Instantly share code, notes, and snippets.

@mdirienzo
mdirienzo / SVG-viewBox-Example.html
Last active December 25, 2015 15:08
An example that shows certain variables affecting how SVG displays content.
<!-- No Viewbox -->
<svg width="100px" height="100px">
<rect x="0" y="0" width="5" height="5"
fill="yellow" stroke="blue" stroke-width="0.2" />
<rect x="1" y="1" width="3" height="3"
fill="yellow" stroke="red" stroke-width="0.2" />
<text x="1.5" y="3" font-size="1" font-family="Verdana" >
AAA
</text>
</svg>
@mdirienzo
mdirienzo / README.md
Last active December 2, 2020 08:04
Progress Bars - An animated progress bar widget for Dashing.

Progress Bar Widget

Description

A widget made for Dashing. This widget shows multiple animated progress bars and reacts dynamically to new information being passed in. Anything with a current state and with a projected max/goal state can easily be represented with this widget. Some sample ideas would be to show progress, completion, capacity, load, fundraising, and much more.

Features

  • Animating progress bars - Both the number and bar will grow or shrink based on new data that is being passed to it.
  • Responsive Design - Allows the widget to be resized to any height or width and still fit appropriately. The progress bars will split up all available space amongst each other, squeezing in when additional progress bars fill the widget.