RoundProgressBar

JavaScript Library

Erstelle deine eigene Progress Bar:

Allgemein

Dicke

Größe

Farbe

Farbverlauf aktivieren

Verlaufsfarbe 1

Verlaufsfarbe 2

Verlaufsfarbe 3

Hintergrundfarbe

Abgerundete Enden

Wert

Max

Min

Wert umkehren

Text

Text anzeigen

Textfarbe

Textgröße

Symbol

Schriftart

Animation

Start animieren

Geschwindigkeit (Start)

Wert animieren

Ohne Rückkehr animieren

Geschwindigkeit (Wert)

<script src="https://alwinschuster.at/rpb.min.js"></script>

<canvas class="rpb" id="myProgressBar" rpb_color="#006699" rpb_backgroundcolor="#cccccc" rpb_textcolor="#cccccc" rpb_textsize="75"></canvas>

var yourBar = rpb_getInstanceFromProgressBar("myProgressBar");
yourBar.value = 45; //set value to 45
...
yourBar.draw(); //draw bar [important!]