| 1 |
// SVG circle progress bar % |
| 2 |
const circle = document.querySelector(".wtotem_from__circle"); |
| 3 |
if(circle){ |
| 4 |
const radius = circle.r.baseVal.value; |
| 5 |
const circumference = 2 * Math.PI * radius; |
| 6 |
const percentCircle = document.querySelector(".wtotem_from__percent"); |
| 7 |
|
| 8 |
circle.style.strokeDasharray = `${circumference} ${circumference}`; |
| 9 |
circle.style.strokeDashoffset = circumference; |
| 10 |
|
| 11 |
const setProgress = (percent) => { |
| 12 |
const offset = circumference - (percent / 100) * circumference; |
| 13 |
circle.style.strokeDashoffset = offset; |
| 14 |
percentCircle.textContent = `${percent}%`; |
| 15 |
}; |
| 16 |
setProgress(percentCircle.dataset.value); |
| 17 |
} |
| 18 |
//---------------------------------- |
| 19 |
|
