动画从左到右，但我希望它从右到左，为什么？

Question

我有以下svg动画，简单的svg线动画：

line {
  stroke: black;
  stroke-width: 2;
  stroke-dasharray: 190, 190;
  stroke-dashoffset: 190;
  animation: drawline 5s 0.5s linear forwards;
}

@keyframes drawline {
  0% {
    stroke-dashoffset: 190;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

<svg xmlns="http://www.w3.org/2000/svg" width="190" height="200" viewBox="0 0 44 75">
            <line stroke-dasharray="190" x1="0" y1="10" x2="190" y2="10" />
        </svg>

既然我的动画drawline说从stroke-dashoffset: 190转到stroke-dashoffset: 0，我希望这个动画从右到左，但是这个动画从左到右，为什么呢？有人可以解释一下吗？

注意：这是why个问题，而不是to-do-this-question的问题。

Answer 1

<line stroke-dasharray="190" x1="0" y1="10" x2="190" y2="10" />

应该是

<line stroke-dasharray="190" x1="190" y1="10" x2="0" y2="10" />

x1是起点，x2是结束

＆＃13;

＆＃13;

line {
  stroke: black;
  stroke-width: 2;
  stroke-dasharray: 190, 190;
  stroke-dashoffset: 190;
  animation: drawline 5s 0.5s linear forwards;
}

@keyframes drawline {
  0% {
    stroke-dashoffset: 190;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

＆＃13;

<svg xmlns="http://www.w3.org/2000/svg" width="190" height="200" viewBox="0 0 44 75">
            <line stroke-dasharray="190" x1="190" y1="10" x2="0" y2="10" />
        </svg>

＆＃13;

＆＃13;

＆＃13;