Мне нужна анимация подписи на моем SVG, которую я пробовал, но отображается только половина ее? ⇐ CSS

[Anonymous]

Код: Выделить всё

#signature{
animation: drawSignature 3s linear forwards;
}
#underline {
animation: drawUnderline 1s linear forwards;
animation-delay: 3s; /* Delay to match signature duration */
}

@keyframes drawSignature {
to {
stroke-dashoffset: 0;
}
}
@keyframes drawUnderline {
to {
stroke-dashoffset: 0;
}
}

dasharray и Stroke-dashoffset верны, поскольку я рассчитал их с помощью javascript getTotalLength( ) для каждого пути подписи и подчеркивания. мне нужен эффект, при котором сначала моя подпись анимируется, а затем подчеркивается
но из приведенного выше кода анимируется только половина подписи, а затем подчеркивается путь, исправьте это?
Я пробовал приведенный выше код и с использованием ИИ все еще ничего не работает. Я хочу, чтобы сначала мой путь к подписи был анимирован, а затем подчеркнут путь, чтобы создать эффект подписи рисунка

Подробнее здесь: https://stackoverflow.com/questions/792 ... ts-is-show