Вопрос как расчитать stroke-dasharray и stroke-dashoffset для полукроголо прогресс бара?

[chopix]

всем привет, есть вот такой компонент с полукруглым прогресс баром, как расчитать для него stroke-dasharray и stroke-dashoffset?

HTML:

<template>
  <svg width="100%" height="100%" viewBox="0 0 100 50" xmlns="http://www.w3.org/2000/svg">
    <linearGradient id='g1' gradientUnits='userSpaceOnUse' x1='100.27%' y1='99.73%' x2='-0.27%' y2='.27%'>
      <stop offset='.003' stop-color='#FFFFFF'/>
      <stop offset='1.002' stop-color='#fff' stop-opacity='0'/>
    </linearGradient>
    <linearGradient id='g2' gradientUnits='userSpaceOnUse' x1='100.3%' y1='50.31%' x2='-0.3%' y2='49.69%'>
      <stop offset='.001' stop-color='#4EE541'/>
      <stop offset='.996' stop-color='#4ee541' stop-opacity='0'/>
    </linearGradient>
    <path d="M 5 25 A 20 20 0 0 1 95 25" stroke="black" stroke-width="5" fill="none" />
    <path id="progress" d="M 5 25 A 20 20 0 0 1 95 25" stroke="green" stroke-width="5" fill="none"/>
  </svg>
</template>

<script setup lang='ts'>

const props = defineProps({
    progress: {
        type: Number,
        required: true
    },
    maxProgress: {
        type: Number,
        required: true,
    }
})


</script>

<style scoped lang='scss'>
</style>