1 Using this striaght line to demonstrate

<line x1="0" y1="0" x2="50" y2="0" stroke="black" stroke-dasharray="10 5"/>

2 When stroke-dashoffset is a positive number

stroke-dashoffset="3"

The dash and gap are shifted backward by 3.

3 When stroke-dashoffset is a negative number

stroke-dashoffset="-20"

The dash and gap are shifted forward by 20.

4 Apply stroke-dashoffset on curve

<path d="M 10 40 C 10 50 40 50 40 40 Z" stroke="black" fill="none" stroke-dasharray="10 5" stroke-dashoffset="-4"/>

The path shifted forward by 4.