Tovább a tartalomhoz

Kördiagram és Folyamatjelző sáv elem

A Kördiagram és a Folyamatjelző sáv elem beállításai: százalék, méret, színek, feliratok és sávok.

Két elem mutat százalékos értéket: a Kördiagram körívvel, a Folyamatjelző sáv vízszintes sávokkal.

A Kördiagram kör alakú folyamatjelzőt rajzol, a közepén százalékkal, ikonnal vagy saját szöveggel.

https://minta-bolt.hu/elemek/?bricks=run
A Kördiagram elem beállításai a szerkesztőben

A képen a Százalék, a méret, a vonal, a Tartalom és a színek mezői látszanak.

Beállítás Mit csinál Alapérték
Százalék A megjelenített érték, 0 és 100 között. 60
Diagram mérete px-ben A kör átmérője képpontban. 160
Vonalvastagság px-ben A jelzősáv vastagsága. 8
Vonal végződése A vonal végének alakja: négyzetes, lekerekített vagy vágott. Négyzetes
Tartalom Mi jelenjen meg a kör közepén: százalék, ikon vagy szöveg. Százalék
Ikon A középső ikon. Csak akkor látszik, ha a Tartalom ikon. Nincs
Szöveg A középső egyedi szöveg. Csak akkor látszik, ha a Tartalom szöveg. Nincs
Sáv színe A jelzősáv színe. Az elsődleges téma színe
Háttérsáv színe A háttérpálya színe. Világos háttérszín
Skála hossza px-ben A skálajelek hossza. Nincs
Skála színe A skálajelek színe. Csak akkor látszik, ha a skála hossza meg van adva. Nincs

A Folyamatjelző sáv animált, vízszintes sávokat jelenít meg felirattal és százalékkal. Egy elemben több sáv is lehet.

https://minta-bolt.hu/elemek/?bricks=run
A Folyamatjelző sáv elem beállításai a szerkesztőben

A képen a két sáv listája, a Hozzáadás sáv gomb, majd a Magasság, a Térközök, a Százalék megjelenítése kapcsoló és a színek látszanak.

Minden sávnak három mezője van:

Mező Mit csinál
Felirat A sáv szöveges címkéje.
Százalék A kitöltöttség 0 és 100 között. Dinamikus adat is használható.
Sáv színe Ennek a sávnak a kitöltőszíne.

Az összes sávra érvényes beállítások:

Beállítás Mit csinál Alapérték
Magasság A sávok magassága. 8px
Térközök A sávok közötti távolság. 20px
Százalék megjelenítése A százalékértéket a felirat mellett mutatja. Be
Sáv színe A sávok alapértelmezett színe. Nincs
Sáv háttérszíne A sávpálya háttere. Nincs
Sáv kerete A sávok szegélye. Nincs
Címke tipográfiája A feliratok betűstílusa. Nincs
Százalék tipográfiája A százalékértékek betűstílusa. Csak bekapcsolt százalékmegjelenítésnél látszik. Nincs

Készült:

Tiszteletben tartjuk a magánszférádat

Sütiket használunk a böngészési élmény javítására és a forgalom elemzésére. Az analitika csak akkor indul, ha engeded. Adatvédelmi irányelvek, Sütitájékoztató.

Sütibeállítások