将箭头添加到 SVG 描边动画

Question

我正在尝试获取包含 SVG 徽标的动画箭头。我的笔触动画可以正常工作，但我不确定如何让箭头位于该行的前面。

我想要实现的一个例子是

.shape svg {
  width:100%;
  height: auto;
}
.outline {
  stroke-dasharray: 32050;
  animation: dash 2s linear forwards;
  stroke-linejoin: round;
}

@keyframes dash {
  from {
    stroke-dashoffset: 32050;
  }
  to {
    stroke-dashoffset: 0;
  }
}

<div class="shape">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1350 370" preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,540.000000) scale(0.100000,-0.100000)" fill="#2e3464" stroke="none">
<path transform="translate(13150 7150) rotate(180 180 0)" class="outline" fill="none" stroke="#2e3464" stroke-width="200" d="M338 5250 c-61 -33 -103 -83 -116 -140 -17 -72 -17 -2995 -1 -3072 14 -61 46 -108 96 -138 l35 -20 6388 0 6389 0 35 20 c46 28 80 75 94 132 17 68 17 3005 0 3078 -13 58 -56 108 -118 140 -39 20 -67 20 -6402 20 -6294 -1 -6363 -1 -6400 -20z"/>
<path d="M730 4922 c-36 -2 -68 -6 -72 -10 -4 -4 -8 -227 -8 -495 l-1 -488 27 -32 c15 -18 41 -41 58 -52 29 -19 51 -20 499 -23 354 -3 472 -1 483 8 10 9 14 37 14 111 0 146 27 135 -346 143 -170 3 -329 9 -354 14 l-45 7 -6 65 c-4 36 -10 217 -14 403 -5 235 -11 340 -19 342 -20 6 -150 10 -216 7z"/>
<path d="M2446 4919 c-22 -5 -48 -17 -58 -25 -20 -19 -91 -136 -129 -215 -15 -31 -45 -85 -66 -120 -21 -35 -49 -86 -62 -114 -14 -27 -35 -66 -47 -86 -12 -20 -50 -90 -84 -155 -34 -65 -67 -124 -72 -131 -5 -7 -34 -61 -63 -120 -44 -87 -52 -110 -41 -121 18 -19 265 -29 305 -13 21 9 40 32 68 84 21 40 42 80 48 89 19 31 41 72 115 213 40 77 81 154 91 170 10 17 38 71 63 121 52 105 89 154 117 154 23 0 63 -61 138 -210 30 -58 57 -109 62 -114 16 -17 10 -55 -10 -66 -11 -6 -89 -10 -181 -10 -188 0 -205 -5 -195 -57 10 -56 64 -146 93 -158 9 -4 112 -10 229 -14 244 -8 226 -1 299 -118 54 -86 58 -87 237 -87 161 1 165 5 108 116 -23 46 -50 97 -61 113 -10 17 -31 55 -46 85 -15 30 -38 72 -51 93 -14 22 -44 76 -67 120 -24 45 -57 105 -73 132 -16 28 -32 58 -36 67 -3 10 -21 42 -40 70 -18 29 -43 73 -55 98 -32 66 -93 151 -123 173 -15 11 -46 23 -70 27 -73 14 -301 20 -343 9z"/>
<path d="M4267 4921 c-47 -10 -64 -33 -98 -131 -14 -41 -34 -95 -43 -120 -10 -25 -21 -61 -25 -80 -4 -19 -12 -44 -18 -55 -6 -11 -34 -90 -62 -175 -59 -178 -80 -224 -104 -228 -19 -4 -33 24 -112 218 -14 36 -34 85 -45 110 -10 25 -28 70 -40 100 -23 59 -26 67 -59 150 -13 30 -32 80 -42 111 -30 85 -42 93 -162 97 -175 7 -206 -12 -163 -97 14 -29 26 -60 26 -69 0 -9 7 -26 15 -36 8 -11 15 -30 15 -42 0 -13 4 -25 9 -28 4 -3 19 -34 31 -68 13 -35 29 -72 37 -83 7 -11 13 -27 13 -36 0 -10 7 -30 15 -46 8 -15 28 -64 45 -108 17 -44 37 -92 45 -107 8 -14 15 -35 15 -46 0 -12 4 -23 9 -27 5 -3 15 -22 22 -43 23 -71 81 -181 115 -216 25 -25 46 -37 81 -43 57 -9 287 -9 326 1 27 6 56 54 72 116 3 14 12 41 20 60 7 19 27 82 44 140 17 58 36 119 42 135 5 17 19 59 31 95 49 154 60 180 78 180 18 0 60 -67 60 -94 0 -30 159 -508 180 -544 11 -17 38 -44 61 -59 42 -27 46 -28 208 -31 193 -4 191 -5 230 103 13 33 26 64 31 70 4 5 18 38 30 73 13 34 27 65 31 68 5 3 9 13 9 24 0 10 14 45 30 78 17 34 30 65 30 71 0 6 7 27 16 48 9 21 22 52 29 68 7 17 26 64 43 105 16 41 50 125 75 185 74 180 72 174 55 191 -21 22 -75 27 -183 19 -114 -8 -122 -14 -161 -119 -14 -39 -39 -99 -55 -133 -16 -35 -29 -68 -29 -75 0 -15 -46 -134 -104 -271 -9 -21 -16 -43 -16 -50 0 -18 -70 -147 -79 -147 -21 0 -56 81 -116 270 -63 197 -77 237 -89 265 -7 17 -21 57 -31 90 -9 33 -20 65 -25 70 -4 6 -10 22 -14 37 -12 50 -45 62 -185 65 -69 1 -143 -2 -164 -6z"/>
<path d="M5873 4923 c-211 -3 -223 -4 -233 -24 -13 -23 -16 -1047 -3 -1060 24 -23 287 -28 310 -6 4 5 10 186 13 404 5 376 6 395 24 409 16 11 78 14 332 14 l313 0 27 -35 c23 -30 26 -45 27 -109 0 -81 -5 -93 -59 -126 -30 -19 -58 -22 -311 -31 -153 -6 -282 -14 -287 -19 -16 -16 65 -192 98 -216 16 -11 64 -14 211 -14 222 0 250 -4 290 -36 29 -23 30 -26 33 -129 4 -104 4 -106 30 -117 29 -12 235 -15 270 -4 29 10 40 72 31 182 -9 106 -33 163 -85 195 -32 19 -54 46 -54 66 0 5 16 17 36 28 79 43 113 130 114 293 0 160 -42 250 -142 302 -37 19 -66 23 -253 31 -115 4 -277 7 -360 6 -82 -1 -250 -3 -372 -4z"/>
<path d="M7465 4921 c-194 -6 -201 -7 -240 -32 -22 -15 -52 -41 -66 -58 -33 -39 -36 -76 -45 -471 -8 -355 -1 -412 59 -477 72 -79 33 -74 630 -67 324 4 537 11 545 17 8 6 12 40 12 103 0 79 -3 95 -17 102 -10 5 -198 12 -418 16 -220 3 -414 8 -432 12 -31 6 -32 8 -40 73 -13 108 -8 508 7 526 11 13 54 15 289 15 314 1 568 13 585 30 6 6 11 47 11 96 0 70 -3 88 -17 98 -32 24 -384 30 -863 17z"/>
<path d="M8565 4921 l-80 -6 -6 -235 c-3 -129 -3 -373 -1 -542 5 -301 6 -307 26 -312 38 -10 274 -7 281 4 4 6 6 163 5 350 -1 338 6 420 33 420 15 0 53 -40 112 -115 22 -27 44 -55 50 -61 5 -6 28 -35 50 -63 22 -29 54 -69 71 -89 16 -20 52 -66 80 -102 42 -55 109 -139 172 -215 10 -11 26 -32 38 -47 46 -61 81 -75 220 -87 129 -11 331 -6 356 10 10 7 13 110 14 531 1 313 -2 530 -8 541 -8 16 -23 17 -151 15 l-142 -3 -8 -365 c-4 -201 -9 -371 -12 -377 -9 -25 -44 -12 -76 28 -18 23 -48 59 -67 80 -20 21 -42 50 -51 63 -9 13 -43 57 -76 97 -33 40 -108 132 -166 205 -128 160 -186 225 -219 246 -46 30 -248 43 -445 29z"/>
<path d="M10546 4920 c-102 -6 -172 -14 -197 -24 -22 -9 -49 -16 -60 -16 -13 0 -46 -25 -83 -62 -92 -94 -99 -124 -104 -423 -4 -271 6 -345 60 -425 32 -48 107 -110 133 -110 9 0 30 -7 48 -16 27 -15 84 -17 452 -18 388 -1 427 1 504 19 75 18 90 25 132 66 39 38 49 55 54 93 4 26 4 51 -1 56 -5 5 -224 13 -486 17 l-476 8 -27 25 c-14 13 -35 43 -46 65 -19 38 -20 56 -17 221 3 201 7 211 73 247 39 21 54 22 496 28 250 3 461 9 467 13 17 10 15 61 -3 76 -8 7 -15 20 -15 29 -1 46 -122 111 -229 122 -124 13 -504 18 -675 9z"/>
<path d="M11978 4920 l-237 -8 -48 -29 c-28 -17 -57 -46 -70 -69 -22 -39 -23 -43 -23 -460 l0 -422 65 -61 66 -61 357 1 c196 0 438 4 536 8 205 9 206 9 206 97 0 72 -9 111 -29 120 -9 4 -196 10 -416 15 -225 4 -411 12 -426 17 -25 10 -26 12 -33 144 -9 154 -9 151 0 325 l6 132 42 5 c22 3 213 7 422 8 303 3 385 6 398 17 13 11 16 32 16 102 0 122 5 119 -188 119 -86 0 -213 2 -282 4 -69 2 -232 1 -362 -4z"/>
<path d="M7554 4471 c-64 -16 -66 -24 -24 -108 51 -102 22 -95 394 -91 218 2 329 7 336 14 8 8 1 32 -24 87 -26 58 -42 80 -63 89 -33 13 -571 22 -619 9z"/>
<path d="M12113 4473 c-152 -5 -155 -8 -113 -95 51 -110 24 -103 391 -103 207 0 322 4 328 10 20 20 -30 137 -72 168 -21 16 -48 19 -218 21 -107 2 -249 1 -316 -1z"/>
<path d="M950 3291 c-197 -7 -222 -16 -287 -105 -23 -30 -23 -32 -22 -375 0 -190 4 -379 8 -420 7 -70 9 -75 52 -116 l45 -43 295 -7 c162 -4 402 -3 534 1 l240 9 9 58 c12 81 -1 139 -34 148 -14 4 -201 7 -416 8 -365 1 -392 2 -407 19 -14 16 -17 44 -17 179 0 89 3 169 6 178 6 14 9 13 30 -6 13 -12 24 -26 24 -31 0 -5 16 -34 35 -64 l36 -56 307 4 c169 2 315 8 325 12 23 11 22 24 -12 87 -51 95 -46 94 -410 91 -225 -2 -317 1 -327 9 -18 15 -19 152 -1 167 7 6 177 15 417 22 250 7 410 15 417 22 17 14 18 168 0 191 -11 16 -44 18 -347 21 -184 2 -409 1 -500 -3z"/>
<path d="M2380 3290 c-259 -7 -312 -19 -382 -87 -78 -75 -94 -129 -107 -353 -8 -123 -6 -183 6 -290 14 -121 19 -140 48 -186 58 -91 138 -134 254 -135 42 0 103 -4 136 -9 33 -4 209 -3 390 1 334 9 428 20 480 56 27 18 40 17 85 -12 46 -29 78 -32 87 -7 4 9 20 36 35 59 41 60 46 96 17 121 -13 11 -37 31 -53 44 l-29 25 -2 224 c-3 360 -32 442 -185 515 l-65 31 -245 5 c-135 2 -346 1 -470 -2z m558 -259 c60 -31 71 -50 84 -142 14 -104 6 -159 -23 -159 -24 0 -120 52 -194 104 -74 53 -92 49 -146 -30 -24 -36 -48 -72 -54 -79 -15 -22 49 -81 135 -124 110 -54 131 -71 128 -95 -3 -20 -10 -21 -203 -27 -254 -9 -367 0 -399 30 -43 40 -58 120 -54 282 4 171 16 206 81 238 39 20 59 21 325 21 258 0 286 -2 320 -19z"/>
<path d="M3551 3292 c-29 -6 -36 -13 -44 -41 -4 -19 -7 -192 -4 -385 4 -362 5 -373 48 -471 26 -60 61 -95 124 -124 57 -27 77 -31 226 -40 112 -7 245 -7 419 0 248 10 257 11 326 40 126 53 169 118 185 287 12 118 7 701 -6 722 -10 15 -272 13 -282 -2 -4 -7 -10 -169 -13 -360 -5 -330 -6 -348 -26 -374 -11 -15 -33 -37 -48 -48 -26 -20 -40 -21 -287 -21 l-260 0 -45 47 -44 47 -1 98 c-2 198 -15 612 -19 616 -9 8 -214 15 -249 9z"/>
<path d="M5058 3293 c-36 -3 -61 -10 -70 -20 -10 -13 -13 -115 -13 -522 l0 -506 161 -3 162 -2 7 195 c4 107 6 336 3 510 -3 260 -6 317 -18 329 -16 15 -138 25 -232 19z"/>
<path d="M5582 3291 c-84 -4 -115 -10 -122 -21 -6 -9 -10 -221 -10 -521 l0 -506 143 -5 c78 -3 145 -3 150 -1 4 2 7 95 8 206 0 207 9 269 39 275 10 2 22 -12 33 -40 10 -24 31 -71 48 -106 l29 -63 313 3 c351 3 343 2 421 83 70 73 108 236 87 375 -22 140 -70 231 -146 271 -84 45 -123 49 -510 53 -203 2 -421 1 -483 -3z m756 -260 c44 -17 65 -62 66 -137 1 -51 -3 -67 -27 -101 l-28 -41 -167 -4 c-92 -2 -219 -2 -283 0 -141 5 -141 5 -147 143 -4 89 -2 99 19 129 l24 32 255 -4 c176 -3 265 -8 288 -17z"/>
<path d="M8259 3291 c-82 -5 -102 -10 -140 -34 -44 -28 -92 -91 -137 -177 -12 -25 -33 -63 -46 -85 -13 -22 -37 -66 -55 -97 -17 -32 -45 -84 -62 -115 -18 -32 -40 -73 -50 -91 -9 -18 -23 -39 -29 -47 -19 -22 -58 -18 -73 8 -53 85 -76 125 -129 222 -34 61 -81 149 -105 196 -109 210 -130 221 -411 217 l-197 -3 -3 -522 -2 -522 132 -3 c99 -2 135 0 145 10 7 8 11 18 8 23 -4 5 -1 158 5 341 9 270 14 336 26 348 13 13 17 12 34 -10 11 -14 27 -41 37 -60 10 -19 37 -67 61 -106 23 -39 42 -74 42 -77 0 -4 19 -39 43 -79 79 -134 137 -237 137 -247 0 -4 7 -14 15 -21 8 -7 15 -19 15 -27 0 -8 14 -32 30 -53 28 -35 36 -39 93 -45 34 -3 91 -3 126 2 67 8 79 18 111 92 6 13 19 36 29 50 11 15 30 47 43 71 13 25 43 77 66 117 23 39 42 74 42 78 0 3 14 26 30 50 17 24 30 46 30 49 0 4 20 40 45 80 25 41 45 77 45 81 0 17 55 75 71 75 18 0 19 -14 19 -364 0 -279 3 -366 13 -373 7 -6 70 -8 150 -5 l137 4 0 512 c0 281 -4 516 -8 522 -9 14 -204 23 -333 15z"/>
<path d="M11233 3292 c-31 -2 -57 -9 -65 -19 -10 -12 -14 -95 -18 -364 -3 -191 -8 -350 -12 -354 -11 -12 -44 13 -89 66 -96 114 -116 138 -164 199 -27 34 -55 71 -61 82 -6 10 -18 24 -26 31 -9 7 -44 48 -78 92 -212 271 -201 265 -488 265 -165 0 -212 -3 -221 -14 -8 -9 -13 -167 -18 -518 -6 -491 -6 -506 13 -514 10 -5 80 -8 155 -6 l136 3 7 350 c4 193 10 357 13 365 10 27 39 14 78 -37 54 -69 127 -159 145 -180 8 -9 74 -92 145 -185 72 -92 162 -201 202 -241 l71 -73 254 2 253 3 3 440 c3 420 -1 568 -16 591 -8 12 -138 22 -219 16z"/>
<path d="M11816 3292 c-163 -1 -254 -6 -263 -13 -21 -18 -18 -202 4 -220 13 -11 114 -15 542 -17 289 -2 564 1 611 5 l85 8 3 105 c1 58 -1 110 -5 116 -9 12 -545 21 -977 16z"/>
<path d="M8840 3279 c-32 -13 -77 -56 -98 -94 -15 -26 -17 -79 -20 -419 -3 -430 -4 -423 61 -491 l38 -40 532 4 c293 2 535 5 540 8 13 8 8 180 -5 191 -8 6 -165 11 -408 14 -394 5 -430 8 -451 40 -9 14 -2 539 8 548 22 19 163 30 404 31 145 1 302 4 349 7 l85 7 3 103 3 102 -508 -1 c-312 0 -518 -4 -533 -10z"/>
<path d="M12025 2979 c-4 -6 -7 -170 -8 -365 0 -294 2 -357 14 -369 19 -19 273 -34 283 -17 6 10 8 207 6 663 0 40 -17 52 -87 64 -21 4 -57 13 -81 21 -51 17 -118 18 -127 3z"/>
<path d="M9093 2854 c-17 -8 -16 -44 2 -68 8 -11 15 -27 15 -35 0 -9 11 -29 24 -46 l24 -30 300 -3 c311 -4 342 -1 342 37 0 21 -44 109 -66 131 -12 13 -64 15 -322 17 -169 1 -313 0 -319 -3z"/>
</g>
</svg>
</div>

Answer 1

您不能使用笔划-破折号数组为标记设置动画。 "draw/no-draw" 数组的位置正在沿着路径滑动，但路径本身没有移动，这意味着标记没有移动。

Answer 2

You can't animate a marker using a stroke-dash-array. The position of the "draw/no-draw" array is being slid along the path, but the path itself doesn't move, which means the marker doesn't move. @Michael Mullany

但是您可以用三角形替换标记，并使其沿着动画的相同路径移动

为此，请使用命令 animateMotion

<animateMotion
   id="an"
   dur="7s"
   repeatCount="1"
   rotate="auto-reverse"
   begin="0s"
   fill="freeze"
   restart="whenNotActive">
       <mpath xlink:href="#border"/>
</animateMotion>

其中 id =" border " 是动画路径

持续时间动画stroke-dashoffset和animateMotion使相同的。然后看起来三角形与线

.shape svg {
  width:100%;
  height: auto;
}
.outline {
  stroke-dasharray: 3253;
  animation: dash 7s linear forwards;
  stroke-linejoin: round;
}

@keyframes dash {
  from {
    stroke-dashoffset: 3253;
  }
  to {
    stroke-dashoffset: 0;
  }
}
</style>

<svg id="svg2" version="1.1" xmlns="http://www.w3.org/2000/svg"   xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1350 370" preserveAspectRatio="xMidYMid meet">

<g transform="translate(0 10) scale(0.9)">
 <path class="outline" id="border" d="m1317.2 348c6.1-3.3 10.3-8.3 11.6-14 1.7-7.2 1.7-299.5 0.1-307.2-1.4-6.1-4.6-10.8-9.6-13.8l-3.5-2H677 38.1l-3.5 2c-4.6 2.8-8 7.5-9.4 13.2-1.7 6.8-1.7 300.5 0 307.8 1.3 5.8 5.6 10.8 11.8 14 3.9 2 6.7 2 640.2 2 629.4-0.1 636.3-0.1 640-2z" style="fill:none;stroke-width:20;stroke:#2e3464" stroke-linecap="round"/>
  <path d="m73 45.8c-3.6 0.2-6.8 0.6-7.2 1C65.4 47.2 65 69.5 65 96.3l-0.1 48.8 2.7 3.2c1.5 1.8 4.1 4.1 5.8 5.2 2.9 1.9 5.1 2 49.9 2.3 35.4 0.3 47.2 0.1 48.3-0.8 1-0.9 1.4-3.7 1.4-11.1 0-14.6 2.7-13.5-34.6-14.3-17-0.3-32.9-0.9-35.4-1.4l-4.5-0.7-0.6-6.5c-0.4-3.6-1-21.7-1.4-40.3-0.5-23.5-1.1-34-1.9-34.2-2-0.6-15-1-21.6-0.7zM244.6 46.1" fill="#2e3464"/>
  <path d="m244.6 46.1c-2.2 0.5-4.8 1.7-5.8 2.5-2 1.9-9.1 13.6-12.9 21.5-1.5 3.1-4.5 8.5-6.6 12-2.1 3.5-4.9 8.6-6.2 11.4-1.4 2.7-3.5 6.6-4.7 8.6-1.2 2-5 9-8.4 15.5-3.4 6.5-6.7 12.4-7.2 13.1-0.5 0.7-3.4 6.1-6.3 12-4.4 8.7-5.2 11-4.1 12.1 1.8 1.9 26.5 2.9 30.5 1.3 2.1-0.9 4-3.2 6.8-8.4 2.1-4 4.2-8 4.8-8.9 1.9-3.1 4.1-7.2 11.5-21.3 4-7.7 8.1-15.4 9.1-17 1-1.7 3.8-7.1 6.3-12.1 5.2-10.5 8.9-15.4 11.7-15.4 2.3 0 6.3 6.1 13.8 21 3 5.8 5.7 10.9 6.2 11.4 1.6 1.7 1 5.5-1 6.6-1.1 0.6-8.9 1-18.1 1-18.8 0-20.5 0.5-19.5 5.7 1 5.6 6.4 14.6 9.3 15.8 0.9 0.4 11.2 1 22.9 1.4 24.4 0.8 22.6 0.1 29.9 11.8 5.4 8.6 5.8 8.7 23.7 8.7 16.1-0.1 16.5-0.5 10.8-11.6-2.3-4.6-5-9.7-6.1-11.3-1-1.7-3.1-5.5-4.6-8.5-1.5-3-3.8-7.2-5.1-9.3-1.4-2.2-4.4-7.6-6.7-12-2.4-4.5-5.7-10.5-7.3-13.2-1.6-2.8-3.2-5.8-3.6-6.7-0.3-1-2.1-4.2-4-7-1.8-2.9-4.3-7.3-5.5-9.8-3.2-6.6-9.3-15.1-12.3-17.3-1.5-1.1-4.6-2.3-7-2.7-7.3-1.4-30.1-2-34.3-0.9z" fill="#2e3464"/>
  <path d="m426.7 45.9c-4.7 1-6.4 3.3-9.8 13.1-1.4 4.1-3.4 9.5-4.3 12-1 2.5-2.1 6.1-2.5 8-0.4 1.9-1.2 4.4-1.8 5.5-0.6 1.1-3.4 9-6.2 17.5-5.9 17.8-8 22.4-10.4 22.8-1.9 0.4-3.3-2.4-11.2-21.8-1.4-3.6-3.4-8.5-4.5-11-1-2.5-2.8-7-4-10-2.3-5.9-2.6-6.7-5.9-15-1.3-3-3.2-8-4.2-11.1-3-8.5-4.2-9.3-16.2-9.7-17.5-0.7-20.6 1.2-16.3 9.7 1.4 2.9 2.6 6 2.6 6.9 0 0.9 0.7 2.6 1.5 3.6 0.8 1.1 1.5 3 1.5 4.2 0 1.3 0.4 2.5 0.9 2.8 0.4 0.3 1.9 3.4 3.1 6.8 1.3 3.5 2.9 7.2 3.7 8.3 0.7 1.1 1.3 2.7 1.3 3.6 0 1 0.7 3 1.5 4.6 0.8 1.5 2.8 6.4 4.5 10.8 1.7 4.4 3.7 9.2 4.5 10.7 0.8 1.4 1.5 3.5 1.5 4.6 0 1.2 0.4 2.3 0.9 2.7 0.5 0.3 1.5 2.2 2.2 4.3 2.3 7.1 8.1 18.1 11.5 21.6 2.5 2.5 4.6 3.7 8.1 4.3 5.7 0.9 28.7 0.9 32.6-0.1 2.7-0.6 5.6-5.4 7.2-11.6 0.3-1.4 1.2-4.1 2-6 0.7-1.9 2.7-8.2 4.4-14 1.7-5.8 3.6-11.9 4.2-13.5 0.5-1.7 1.9-5.9 3.1-9.5 4.9-15.4 6-18 7.8-18 1.8 0 6 6.7 6 9.4 0 3 15.9 50.8 18 54.4 1.1 1.7 3.8 4.4 6.1 5.9 4.2 2.7 4.6 2.8 20.8 3.1 19.3 0.4 19.1 0.5 23-10.3 1.3-3.3 2.6-6.4 3.1-7 0.4-0.5 1.8-3.8 3-7.3 1.3-3.4 2.7-6.5 3.1-6.8 0.5-0.3 0.9-1.3 0.9-2.4 0-1 1.4-4.5 3-7.8 1.7-3.4 3-6.5 3-7.1 0-0.6 0.7-2.7 1.6-4.8 0.9-2.1 2.2-5.2 2.9-6.8 0.7-1.7 2.6-6.4 4.3-10.5 1.6-4.1 5-12.5 7.5-18.5 7.4-18 7.2-17.4 5.5-19.1-2.1-2.2-7.5-2.7-18.3-1.9-11.4 0.8-12.2 1.4-16.1 11.9-1.4 3.9-3.9 9.9-5.5 13.3-1.6 3.5-2.9 6.8-2.9 7.5 0 1.5-4.6 13.4-10.4 27.1-0.9 2.1-1.6 4.3-1.6 5 0 1.8-7 14.7-7.9 14.7-2.1 0-5.6-8.1-11.6-27-6.3-19.7-7.7-23.7-8.9-26.5-0.7-1.7-2.1-5.7-3.1-9-0.9-3.3-2-6.5-2.5-7-0.4-0.6-1-2.2-1.4-3.7-1.2-5-4.5-6.2-18.5-6.5-6.9-0.1-14.3 0.2-16.4 0.6z" fill="#2e3464"/>
  <path d="M587.3 45.7C566.2 46 565 46.1 564 48.1c-1.3 2.3-1.6 104.7-0.3 106 2.4 2.3 28.7 2.8 31 0.6 0.4-0.5 1-18.6 1.3-40.4 0.5-37.6 0.6-39.5 2.4-40.9 1.6-1.1 7.8-1.4 33.2-1.4h31.3l2.7 3.5c2.3 3 2.6 4.5 2.7 10.9 0 8.1-0.5 9.3-5.9 12.6-3 1.9-5.8 2.2-31.1 3.1-15.3 0.6-28.2 1.4-28.7 1.9-1.6 1.6 6.5 19.2 9.8 21.6 1.6 1.1 6.4 1.4 21.1 1.4 22.2 0 25 0.4 29 3.6 2.9 2.3 3 2.6 3.3 12.9 0.4 10.4 0.4 10.6 3 11.7 2.9 1.2 23.5 1.5 27 0.4 2.9-1 4-7.2 3.1-18.2-0.9-10.6-3.3-16.3-8.5-19.5-3.2-1.9-5.4-4.6-5.4-6.6 0-0.5 1.6-1.7 3.6-2.8 7.9-4.3 11.3-13 11.4-29.3 0-16-4.2-25-14.2-30.2-3.7-1.9-6.6-2.3-25.3-3.1-11.5-0.4-27.7-0.7-36-0.6-8.2 0.1-25 0.3-37.2 0.4z" fill="#2e3464"/>
  <path d="m746.5 45.9c-19.4 0.6-20.1 0.7-24 3.2-2.2 1.5-5.2 4.1-6.6 5.8-3.3 3.9-3.6 7.6-4.5 47.1-0.8 35.5-0.1 41.2 5.9 47.7 7.2 7.9 3.3 7.4 63 6.7 32.4-0.4 53.7-1.1 54.5-1.7 0.8-0.6 1.2-4 1.2-10.3 0-7.9-0.3-9.5-1.7-10.2-1-0.5-19.8-1.2-41.8-1.6-22-0.3-41.4-0.8-43.2-1.2-3.1-0.6-3.2-0.8-4-7.3-1.3-10.8-0.8-50.8 0.7-52.6 1.1-1.3 5.4-1.5 28.9-1.5 31.4-0.1 56.8-1.3 58.5-3 0.6-0.6 1.1-4.7 1.1-9.6 0-7-0.3-8.8-1.7-9.8-3.2-2.4-38.4-3-86.3-1.7z" fill="#2e3464"/>
  <path d="m856.5 45.9-8 0.6-0.6 23.5c-0.3 12.9-0.3 37.3-0.1 54.2 0.5 30.1 0.6 30.7 2.6 31.2 3.8 1 27.4 0.7 28.1-0.4 0.4-0.6 0.6-16.3 0.5-35-0.1-33.8 0.6-42 3.3-42 1.5 0 5.3 4 11.2 11.5 2.2 2.7 4.4 5.5 5 6.1 0.5 0.6 2.8 3.5 5 6.3 2.2 2.9 5.4 6.9 7.1 8.9 1.6 2 5.2 6.6 8 10.2 4.2 5.5 10.9 13.9 17.2 21.5 1 1.1 2.6 3.2 3.8 4.7 4.6 6.1 8.1 7.5 22 8.7 12.9 1.1 33.1 0.6 35.6-1 1-0.7 1.3-11 1.4-53.1 0.1-31.3-0.2-53-0.8-54.1-0.8-1.6-2.3-1.7-15.1-1.5l-14.2 0.3-0.8 36.5c-0.4 20.1-0.9 37.1-1.2 37.7-0.9 2.5-4.4 1.2-7.6-2.8-1.8-2.3-4.8-5.9-6.7-8-2-2.1-4.2-5-5.1-6.3-0.9-1.3-4.3-5.7-7.6-9.7-3.3-4-10.8-13.2-16.6-20.5-12.8-16-18.6-22.5-21.9-24.6-4.6-3-24.8-4.3-44.5-2.9z" fill="#2e3464"/>
  <path d="m1054.6 46c-10.2 0.6-17.2 1.4-19.7 2.4-2.2 0.9-4.9 1.6-6 1.6-1.3 0-4.6 2.5-8.3 6.2-9.2 9.4-9.9 12.4-10.4 42.3-0.4 27.1 0.6 34.5 6 42.5 3.2 4.8 10.7 11 13.3 11 0.9 0 3 0.7 4.8 1.6 2.7 1.5 8.4 1.7 45.2 1.8 38.8 0.1 42.7-0.1 50.4-1.9 7.5-1.8 9-2.5 13.2-6.6 3.9-3.8 4.9-5.5 5.4-9.3 0.4-2.6 0.4-5.1-0.1-5.6-0.5-0.5-22.4-1.3-48.6-1.7l-47.6-0.8-2.7-2.5c-1.4-1.3-3.5-4.3-4.6-6.5-1.9-3.8-2-5.6-1.7-22.1 0.3-20.1 0.7-21.1 7.3-24.7 3.9-2.1 5.4-2.2 49.6-2.8 25-0.3 46.1-0.9 46.7-1.3 1.7-1 1.5-6.1-0.3-7.6-0.8-0.7-1.5-2-1.5-2.9-0.1-4.6-12.2-11.1-22.9-12.2-12.4-1.3-50.4-1.8-67.5-0.9z" fill="#2e3464"/>
  <path d="m1197.8 46-23.7 0.8-4.8 2.9c-2.8 1.7-5.7 4.6-7 6.9-2.2 3.9-2.3 4.3-2.3 46v42.2l6.5 6.1 6.6 6.1 35.7-0.1c19.6 0 43.8-0.4 53.6-0.8 20.5-0.9 20.6-0.9 20.6-9.7 0-7.2-0.9-11.1-2.9-12-0.9-0.4-19.6-1-41.6-1.5-22.5-0.4-41.1-1.2-42.6-1.7-2.5-1-2.6-1.2-3.3-14.4-0.9-15.4-0.9-15.1 0-32.5l0.6-13.2 4.2-0.5c2.2-0.3 21.3-0.7 42.2-0.8 30.3-0.3 38.5-0.6 39.8-1.7 1.3-1.1 1.6-3.2 1.6-10.2 0-12.2 0.5-11.9-18.8-11.9-8.6 0-21.3-0.2-28.2-0.4-6.9-0.2-23.2-0.1-36.2 0.4z" fill="#2e3464"/>
  <path d="m755.4 90.9c-6.4 1.6-6.6 2.4-2.4 10.8 5.1 10.2 2.2 9.5 39.4 9.1 21.8-0.2 32.9-0.7 33.6-1.4 0.8-0.8 0.1-3.2-2.4-8.7-2.6-5.8-4.2-8-6.3-8.9-3.3-1.3-57.1-2.2-61.9-0.9z" fill="#2e3464"/>
  <path d="m1211.3 90.7c-15.2 0.5-15.5 0.8-11.3 9.5 5.1 11 2.4 10.3 39.1 10.3 20.7 0 32.2-0.4 32.8-1 2-2-3-13.7-7.2-16.8-2.1-1.6-4.8-1.9-21.8-2.1-10.7-0.2-24.9-0.1-31.6 0.1z" fill="#2e3464"/>
  <path d="m95 208.9c-19.7 0.7-22.2 1.6-28.7 10.5-2.3 3-2.3 3.2-2.2 37.5 0 19 0.4 37.9 0.8 42 0.7 7 0.9 7.5 5.2 11.6l4.5 4.3 29.5 0.7c16.2 0.4 40.2 0.3 53.4-0.1l24-0.9 0.9-5.8c1.2-8.1-0.1-13.9-3.4-14.8-1.4-0.4-20.1-0.7-41.6-0.8-36.5-0.1-39.2-0.2-40.7-1.9-1.4-1.6-1.7-4.4-1.7-17.9 0-8.9 0.3-16.9 0.6-17.8 0.6-1.4 0.9-1.3 3 0.6 1.3 1.2 2.4 2.6 2.4 3.1 0 0.5 1.6 3.4 3.5 6.4l3.6 5.6 30.7-0.4c16.9-0.2 31.5-0.8 32.5-1.2 2.3-1.1 2.2-2.4-1.2-8.7-5.1-9.5-4.6-9.4-41-9.1-22.5 0.2-31.7-0.1-32.7-0.9-1.8-1.5-1.9-15.2-0.1-16.7 0.7-0.6 17.7-1.5 41.7-2.2 25-0.7 41-1.5 41.7-2.2 1.7-1.4 1.8-16.8 0-19.1-1.1-1.6-4.4-1.8-34.7-2.1-18.4-0.2-40.9-0.1-50 0.3z" fill="#2e3464"/>
  <path d="m238 209c-25.9 0.7-31.2 1.9-38.2 8.7-7.8 7.5-9.4 12.9-10.7 35.3-0.8 12.3-0.6 18.3 0.6 29 1.4 12.1 1.9 14 4.8 18.6 5.8 9.1 13.8 13.4 25.4 13.5 4.2 0 10.3 0.4 13.6 0.9 3.3 0.4 20.9 0.3 39-0.1 33.4-0.9 42.8-2 48-5.6 2.7-1.8 4-1.7 8.5 1.2 4.6 2.9 7.8 3.2 8.7 0.7 0.4-0.9 2-3.6 3.5-5.9 4.1-6 4.6-9.6 1.7-12.1-1.3-1.1-3.7-3.1-5.3-4.4l-2.9-2.5-0.2-22.4c-0.3-36-3.2-44.2-18.5-51.5l-6.5-3.1-24.5-0.5c-13.5-0.2-34.6-0.1-47 0.2zm55.8 25.9c6 3.1 7.1 5 8.4 14.2 1.4 10.4 0.6 15.9-2.3 15.9-2.4 0-12-5.2-19.4-10.4-7.4-5.3-9.2-4.9-14.6 3-2.4 3.6-4.8 7.2-5.4 7.9-1.5 2.2 4.9 8.1 13.5 12.4 11 5.4 13.1 7.1 12.8 9.5-0.3 2-1 2.1-20.3 2.7-25.4 0.9-36.7 0-39.9-3-4.3-4-5.8-12-5.4-28.2 0.4-17.1 1.6-20.6 8.1-23.8 3.9-2 5.9-2.1 32.5-2.1 25.8 0 28.6 0.2 32 1.9z" fill="#2e3464"/>
  <path d="m355.1 208.8c-2.9 0.6-3.6 1.3-4.4 4.1-0.4 1.9-0.7 19.2-0.4 38.5 0.4 36.2 0.5 37.3 4.8 47.1 2.6 6 6.1 9.5 12.4 12.4 5.7 2.7 7.7 3.1 22.6 4 11.2 0.7 24.5 0.7 41.9 0 24.8-1 25.7-1.1 32.6-4 12.6-5.3 16.9-11.8 18.5-28.7 1.2-11.8 0.7-70.1-0.6-72.2-1-1.5-27.2-1.3-28.2 0.2-0.4 0.7-1 16.9-1.3 36-0.5 33-0.6 34.8-2.6 37.4-1.1 1.5-3.3 3.7-4.8 4.8-2.6 2-4 2.1-28.7 2.1h-26l-4.5-4.7-4.4-4.7-0.1-9.8c-0.2-19.8-1.5-61.2-1.9-61.6-0.9-0.8-21.4-1.5-24.9-0.9z" fill="#2e3464"/>
  <path d="m505.8 208.7c-3.6 0.3-6.1 1-7 2-1 1.3-1.3 11.5-1.3 52.2v50.6l16.1 0.3 16.2 0.2 0.7-19.5c0.4-10.7 0.6-33.6 0.3-51-0.3-26-0.6-31.7-1.8-32.9-1.6-1.5-13.8-2.5-23.2-1.9z" fill="#2e3464"/>
  <path d="m558.2 208.9c-8.4 0.4-11.5 1-12.2 2.1-0.6 0.9-1 22.1-1 52.1v50.6l14.3 0.5c7.8 0.3 14.5 0.3 15 0.1 0.4-0.2 0.7-9.5 0.8-20.6 0-20.7 0.9-26.9 3.9-27.5 1-0.2 2.2 1.2 3.3 4 1 2.4 3.1 7.1 4.8 10.6l2.9 6.3 31.3-0.3c35.1-0.3 34.3-0.2 42.1-8.3 7-7.3 10.8-23.6 8.7-37.5-2.2-14-7-23.1-14.6-27.1-8.4-4.5-12.3-4.9-51-5.3-20.3-0.2-42.1-0.1-48.3 0.3zm75.6 26c4.4 1.7 6.5 6.2 6.6 13.7 0.1 5.1-0.3 6.7-2.7 10.1l-2.8 4.1-16.7 0.4c-9.2 0.2-21.9 0.2-28.3 0-14.1-0.5-14.1-0.5-14.7-14.3-0.4-8.9-0.2-9.9 1.9-12.9l2.4-3.2 25.5 0.4c17.6 0.3 26.5 0.8 28.8 1.7z" fill="#2e3464"/>
  <path d="m825.9 208.9c-8.2 0.5-10.2 1-14 3.4-4.4 2.8-9.2 9.1-13.7 17.7-1.2 2.5-3.3 6.3-4.6 8.5-1.3 2.2-3.7 6.6-5.5 9.7-1.7 3.2-4.5 8.4-6.2 11.5-1.8 3.2-4 7.3-5 9.1-0.9 1.8-2.3 3.9-2.9 4.7-1.9 2.2-5.8 1.8-7.3-0.8-5.3-8.5-7.6-12.5-12.9-22.2-3.4-6.1-8.1-14.9-10.5-19.6-10.9-21-13-22.1-41.1-21.7l-19.7 0.3-0.3 52.2-0.2 52.2 13.2 0.3c9.9 0.2 13.5 0 14.5-1 0.7-0.8 1.1-1.8 0.8-2.3-0.4-0.5-0.1-15.8 0.5-34.1 0.9-27 1.4-33.6 2.6-34.8 1.3-1.3 1.7-1.2 3.4 1 1.1 1.4 2.7 4.1 3.7 6 1 1.9 3.7 6.7 6.1 10.6 2.3 3.9 4.2 7.4 4.2 7.7 0 0.4 1.9 3.9 4.3 7.9 7.9 13.4 13.7 23.7 13.7 24.7 0 0.4 0.7 1.4 1.5 2.1 0.8 0.7 1.5 1.9 1.5 2.7 0 0.8 1.4 3.2 3 5.3 2.8 3.5 3.6 3.9 9.3 4.5 3.4 0.3 9.1 0.3 12.6-0.2 6.7-0.8 7.9-1.8 11.1-9.2 0.6-1.3 1.9-3.6 2.9-5 1.1-1.5 3-4.7 4.3-7.1 1.3-2.5 4.3-7.7 6.6-11.7 2.3-3.9 4.2-7.4 4.2-7.8 0-0.3 1.4-2.6 3-5 1.7-2.4 3-4.6 3-4.9 0-0.4 2-4 4.5-8 2.5-4.1 4.5-7.7 4.5-8.1 0-1.7 5.5-7.5 7.1-7.5 1.8 0 1.9 1.4 1.9 36.4 0 27.9 0.3 36.6 1.3 37.3 0.7 0.6 7 0.8 15 0.5l13.7-0.4v-51.2c0-28.1-0.4-51.6-0.8-52.2-0.9-1.4-20.4-2.3-33.3-1.5z" fill="#2e3464"/>
  <path d="m1123.3 208.8c-3.1 0.2-5.7 0.9-6.5 1.9-1 1.2-1.4 9.5-1.8 36.4-0.3 19.1-0.8 35-1.2 35.4-1.1 1.2-4.4-1.3-8.9-6.6-9.6-11.4-11.6-13.8-16.4-19.9-2.7-3.4-5.5-7.1-6.1-8.2-0.6-1-1.8-2.4-2.6-3.1-0.9-0.7-4.4-4.8-7.8-9.2-21.2-27.1-20.1-26.5-48.8-26.5-16.5 0-21.2 0.3-22.1 1.4-0.8 0.9-1.3 16.7-1.8 51.8-0.6 49.1-0.6 50.6 1.3 51.4 1 0.5 8 0.8 15.5 0.6l13.6-0.3 0.7-35c0.4-19.3 1-35.7 1.3-36.5 1-2.7 3.9-1.4 7.8 3.7 5.4 6.9 12.7 15.9 14.5 18 0.8 0.9 7.4 9.2 14.5 18.5 7.2 9.2 16.2 20.1 20.2 24.1l7.1 7.3 25.4-0.2 25.3-0.3 0.3-44c0.3-42-0.1-56.8-1.6-59.1-0.8-1.2-13.8-2.2-21.9-1.6z" fill="#2e3464"/>
  <path d="m1181.6 208.8c-16.3 0.1-25.4 0.6-26.3 1.3-2.1 1.8-1.8 20.2 0.4 22 1.3 1.1 11.4 1.5 54.2 1.7 28.9 0.2 56.4-0.1 61.1-0.5l8.5-0.8 0.3-10.5c0.1-5.8-0.1-11-0.5-11.6-0.9-1.2-54.5-2.1-97.7-1.6z" fill="#2e3464"/>
  <path d="m884 210.1c-3.2 1.3-7.7 5.6-9.8 9.4-1.5 2.6-1.7 7.9-2 41.9-0.3 43-0.4 42.3 6.1 49.1l3.8 4 53.2-0.4c29.3-0.2 53.5-0.5 54-0.8 1.3-0.8 0.8-18-0.5-19.1-0.8-0.6-16.5-1.1-40.8-1.4-39.4-0.5-43-0.8-45.1-4-0.9-1.4-0.2-53.9 0.8-54.8 2.2-1.9 16.3-3 40.4-3.1 14.5-0.1 30.2-0.4 34.9-0.7l8.5-0.7 0.3-10.3 0.3-10.2-50.8 0.1c-31.2 0-51.8 0.4-53.3 1z" fill="#2e3464"/>
  <path d="m1202.5 240.1c-0.4 0.6-0.7 17-0.8 36.5 0 29.4 0.2 35.7 1.4 36.9 1.9 1.9 27.3 3.4 28.3 1.7 0.6-1 0.8-20.7 0.6-66.3 0-4-1.7-5.2-8.7-6.4-2.1-0.4-5.7-1.3-8.1-2.1-5.1-1.7-11.8-1.8-12.7-0.3z" fill="#2e3464"/>
  <path d="m909.3 252.6c-1.7 0.8-1.6 4.4 0.2 6.8 0.8 1.1 1.5 2.7 1.5 3.5 0 0.9 1.1 2.9 2.4 4.6l2.4 3 30 0.3c31.1 0.4 34.2 0.1 34.2-3.7 0-2.1-4.4-10.9-6.6-13.1-1.2-1.3-6.4-1.5-32.2-1.7-16.9-0.1-31.3 0-31.9 0.3z" fill="#2e3464"/>
         <polyline transform="translate(7 -25) rotate(90)" points="0,0 25,43.3 50,0" fill="#4B55A3" >
 <animateMotion
   id="an"
   dur="7s"
   repeatCount="1"
   rotate="auto-reverse"
   begin="0s"
   fill="freeze"
   restart="whenNotActive">
       <mpath xlink:href="#border"/>
</animateMotion> 
    <set attributeName="fill-opacity" to="0" begin="an.end"  />  
</polyline> 
</g>
  </svg>

更新

对于评论中的问题

is it possible to get the arrow to stay at the end of the animation, instead of closing the box, to leave a space open on the bottom of the ride side of the box and keep the arrow visible at the bottom right corner? – Charlie Wedel

要在动画结束后保留箭头需要删除

<set attributeName="fill-opacity" to="0" begin="an.end" />
要遏制没有到达右上角的按钮必须缩小： stroke-dasharray: 3163; stroke-dasharray: 3163;
箭头相对直线的位置可调

<polyline transform="translate(80 -25) rotate(90)"
三角形标记的长度我还是可以玩的加长到 80

points="0,0 25,80 50,0"

.shape svg {
  width:100%;
  height: auto;
}
.outline {
  stroke-dasharray: 3163;
  animation: dash 7s linear forwards;
  stroke-linejoin: round;
}

@keyframes dash {
  from {
    stroke-dashoffset: 3163;
  }
  to {
    stroke-dashoffset: 0;
  }
}

<svg id="svg2" version="1.1" xmlns="http://www.w3.org/2000/svg"   xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1350 370" preserveAspectRatio="xMidYMid meet">

<g transform="translate(0 10) scale(0.9)">
 <path class="outline" id="border" d="m1317.2 348c6.1-3.3 10.3-8.3 11.6-14 1.7-7.2 1.7-299.5 0.1-307.2-1.4-6.1-4.6-10.8-9.6-13.8l-3.5-2H677 38.1l-3.5 2c-4.6 2.8-8 7.5-9.4 13.2-1.7 6.8-1.7 300.5 0 307.8 1.3 5.8 5.6 10.8 11.8 14 3.9 2 6.7 2 640.2 2 629.4-0.1 636.3-0.1 640-2z" style="fill:none;stroke-width:20;stroke:#2e3464" stroke-linecap="round"/>
  <path d="m73 45.8c-3.6 0.2-6.8 0.6-7.2 1C65.4 47.2 65 69.5 65 96.3l-0.1 48.8 2.7 3.2c1.5 1.8 4.1 4.1 5.8 5.2 2.9 1.9 5.1 2 49.9 2.3 35.4 0.3 47.2 0.1 48.3-0.8 1-0.9 1.4-3.7 1.4-11.1 0-14.6 2.7-13.5-34.6-14.3-17-0.3-32.9-0.9-35.4-1.4l-4.5-0.7-0.6-6.5c-0.4-3.6-1-21.7-1.4-40.3-0.5-23.5-1.1-34-1.9-34.2-2-0.6-15-1-21.6-0.7zM244.6 46.1" fill="#2e3464"/>
  <path d="m244.6 46.1c-2.2 0.5-4.8 1.7-5.8 2.5-2 1.9-9.1 13.6-12.9 21.5-1.5 3.1-4.5 8.5-6.6 12-2.1 3.5-4.9 8.6-6.2 11.4-1.4 2.7-3.5 6.6-4.7 8.6-1.2 2-5 9-8.4 15.5-3.4 6.5-6.7 12.4-7.2 13.1-0.5 0.7-3.4 6.1-6.3 12-4.4 8.7-5.2 11-4.1 12.1 1.8 1.9 26.5 2.9 30.5 1.3 2.1-0.9 4-3.2 6.8-8.4 2.1-4 4.2-8 4.8-8.9 1.9-3.1 4.1-7.2 11.5-21.3 4-7.7 8.1-15.4 9.1-17 1-1.7 3.8-7.1 6.3-12.1 5.2-10.5 8.9-15.4 11.7-15.4 2.3 0 6.3 6.1 13.8 21 3 5.8 5.7 10.9 6.2 11.4 1.6 1.7 1 5.5-1 6.6-1.1 0.6-8.9 1-18.1 1-18.8 0-20.5 0.5-19.5 5.7 1 5.6 6.4 14.6 9.3 15.8 0.9 0.4 11.2 1 22.9 1.4 24.4 0.8 22.6 0.1 29.9 11.8 5.4 8.6 5.8 8.7 23.7 8.7 16.1-0.1 16.5-0.5 10.8-11.6-2.3-4.6-5-9.7-6.1-11.3-1-1.7-3.1-5.5-4.6-8.5-1.5-3-3.8-7.2-5.1-9.3-1.4-2.2-4.4-7.6-6.7-12-2.4-4.5-5.7-10.5-7.3-13.2-1.6-2.8-3.2-5.8-3.6-6.7-0.3-1-2.1-4.2-4-7-1.8-2.9-4.3-7.3-5.5-9.8-3.2-6.6-9.3-15.1-12.3-17.3-1.5-1.1-4.6-2.3-7-2.7-7.3-1.4-30.1-2-34.3-0.9z" fill="#2e3464"/>
  <path d="m426.7 45.9c-4.7 1-6.4 3.3-9.8 13.1-1.4 4.1-3.4 9.5-4.3 12-1 2.5-2.1 6.1-2.5 8-0.4 1.9-1.2 4.4-1.8 5.5-0.6 1.1-3.4 9-6.2 17.5-5.9 17.8-8 22.4-10.4 22.8-1.9 0.4-3.3-2.4-11.2-21.8-1.4-3.6-3.4-8.5-4.5-11-1-2.5-2.8-7-4-10-2.3-5.9-2.6-6.7-5.9-15-1.3-3-3.2-8-4.2-11.1-3-8.5-4.2-9.3-16.2-9.7-17.5-0.7-20.6 1.2-16.3 9.7 1.4 2.9 2.6 6 2.6 6.9 0 0.9 0.7 2.6 1.5 3.6 0.8 1.1 1.5 3 1.5 4.2 0 1.3 0.4 2.5 0.9 2.8 0.4 0.3 1.9 3.4 3.1 6.8 1.3 3.5 2.9 7.2 3.7 8.3 0.7 1.1 1.3 2.7 1.3 3.6 0 1 0.7 3 1.5 4.6 0.8 1.5 2.8 6.4 4.5 10.8 1.7 4.4 3.7 9.2 4.5 10.7 0.8 1.4 1.5 3.5 1.5 4.6 0 1.2 0.4 2.3 0.9 2.7 0.5 0.3 1.5 2.2 2.2 4.3 2.3 7.1 8.1 18.1 11.5 21.6 2.5 2.5 4.6 3.7 8.1 4.3 5.7 0.9 28.7 0.9 32.6-0.1 2.7-0.6 5.6-5.4 7.2-11.6 0.3-1.4 1.2-4.1 2-6 0.7-1.9 2.7-8.2 4.4-14 1.7-5.8 3.6-11.9 4.2-13.5 0.5-1.7 1.9-5.9 3.1-9.5 4.9-15.4 6-18 7.8-18 1.8 0 6 6.7 6 9.4 0 3 15.9 50.8 18 54.4 1.1 1.7 3.8 4.4 6.1 5.9 4.2 2.7 4.6 2.8 20.8 3.1 19.3 0.4 19.1 0.5 23-10.3 1.3-3.3 2.6-6.4 3.1-7 0.4-0.5 1.8-3.8 3-7.3 1.3-3.4 2.7-6.5 3.1-6.8 0.5-0.3 0.9-1.3 0.9-2.4 0-1 1.4-4.5 3-7.8 1.7-3.4 3-6.5 3-7.1 0-0.6 0.7-2.7 1.6-4.8 0.9-2.1 2.2-5.2 2.9-6.8 0.7-1.7 2.6-6.4 4.3-10.5 1.6-4.1 5-12.5 7.5-18.5 7.4-18 7.2-17.4 5.5-19.1-2.1-2.2-7.5-2.7-18.3-1.9-11.4 0.8-12.2 1.4-16.1 11.9-1.4 3.9-3.9 9.9-5.5 13.3-1.6 3.5-2.9 6.8-2.9 7.5 0 1.5-4.6 13.4-10.4 27.1-0.9 2.1-1.6 4.3-1.6 5 0 1.8-7 14.7-7.9 14.7-2.1 0-5.6-8.1-11.6-27-6.3-19.7-7.7-23.7-8.9-26.5-0.7-1.7-2.1-5.7-3.1-9-0.9-3.3-2-6.5-2.5-7-0.4-0.6-1-2.2-1.4-3.7-1.2-5-4.5-6.2-18.5-6.5-6.9-0.1-14.3 0.2-16.4 0.6z" fill="#2e3464"/>
  <path d="M587.3 45.7C566.2 46 565 46.1 564 48.1c-1.3 2.3-1.6 104.7-0.3 106 2.4 2.3 28.7 2.8 31 0.6 0.4-0.5 1-18.6 1.3-40.4 0.5-37.6 0.6-39.5 2.4-40.9 1.6-1.1 7.8-1.4 33.2-1.4h31.3l2.7 3.5c2.3 3 2.6 4.5 2.7 10.9 0 8.1-0.5 9.3-5.9 12.6-3 1.9-5.8 2.2-31.1 3.1-15.3 0.6-28.2 1.4-28.7 1.9-1.6 1.6 6.5 19.2 9.8 21.6 1.6 1.1 6.4 1.4 21.1 1.4 22.2 0 25 0.4 29 3.6 2.9 2.3 3 2.6 3.3 12.9 0.4 10.4 0.4 10.6 3 11.7 2.9 1.2 23.5 1.5 27 0.4 2.9-1 4-7.2 3.1-18.2-0.9-10.6-3.3-16.3-8.5-19.5-3.2-1.9-5.4-4.6-5.4-6.6 0-0.5 1.6-1.7 3.6-2.8 7.9-4.3 11.3-13 11.4-29.3 0-16-4.2-25-14.2-30.2-3.7-1.9-6.6-2.3-25.3-3.1-11.5-0.4-27.7-0.7-36-0.6-8.2 0.1-25 0.3-37.2 0.4z" fill="#2e3464"/>
  <path d="m746.5 45.9c-19.4 0.6-20.1 0.7-24 3.2-2.2 1.5-5.2 4.1-6.6 5.8-3.3 3.9-3.6 7.6-4.5 47.1-0.8 35.5-0.1 41.2 5.9 47.7 7.2 7.9 3.3 7.4 63 6.7 32.4-0.4 53.7-1.1 54.5-1.7 0.8-0.6 1.2-4 1.2-10.3 0-7.9-0.3-9.5-1.7-10.2-1-0.5-19.8-1.2-41.8-1.6-22-0.3-41.4-0.8-43.2-1.2-3.1-0.6-3.2-0.8-4-7.3-1.3-10.8-0.8-50.8 0.7-52.6 1.1-1.3 5.4-1.5 28.9-1.5 31.4-0.1 56.8-1.3 58.5-3 0.6-0.6 1.1-4.7 1.1-9.6 0-7-0.3-8.8-1.7-9.8-3.2-2.4-38.4-3-86.3-1.7z" fill="#2e3464"/>
  <path d="m856.5 45.9-8 0.6-0.6 23.5c-0.3 12.9-0.3 37.3-0.1 54.2 0.5 30.1 0.6 30.7 2.6 31.2 3.8 1 27.4 0.7 28.1-0.4 0.4-0.6 0.6-16.3 0.5-35-0.1-33.8 0.6-42 3.3-42 1.5 0 5.3 4 11.2 11.5 2.2 2.7 4.4 5.5 5 6.1 0.5 0.6 2.8 3.5 5 6.3 2.2 2.9 5.4 6.9 7.1 8.9 1.6 2 5.2 6.6 8 10.2 4.2 5.5 10.9 13.9 17.2 21.5 1 1.1 2.6 3.2 3.8 4.7 4.6 6.1 8.1 7.5 22 8.7 12.9 1.1 33.1 0.6 35.6-1 1-0.7 1.3-11 1.4-53.1 0.1-31.3-0.2-53-0.8-54.1-0.8-1.6-2.3-1.7-15.1-1.5l-14.2 0.3-0.8 36.5c-0.4 20.1-0.9 37.1-1.2 37.7-0.9 2.5-4.4 1.2-7.6-2.8-1.8-2.3-4.8-5.9-6.7-8-2-2.1-4.2-5-5.1-6.3-0.9-1.3-4.3-5.7-7.6-9.7-3.3-4-10.8-13.2-16.6-20.5-12.8-16-18.6-22.5-21.9-24.6-4.6-3-24.8-4.3-44.5-2.9z" fill="#2e3464"/>
  <path d="m1054.6 46c-10.2 0.6-17.2 1.4-19.7 2.4-2.2 0.9-4.9 1.6-6 1.6-1.3 0-4.6 2.5-8.3 6.2-9.2 9.4-9.9 12.4-10.4 42.3-0.4 27.1 0.6 34.5 6 42.5 3.2 4.8 10.7 11 13.3 11 0.9 0 3 0.7 4.8 1.6 2.7 1.5 8.4 1.7 45.2 1.8 38.8 0.1 42.7-0.1 50.4-1.9 7.5-1.8 9-2.5 13.2-6.6 3.9-3.8 4.9-5.5 5.4-9.3 0.4-2.6 0.4-5.1-0.1-5.6-0.5-0.5-22.4-1.3-48.6-1.7l-47.6-0.8-2.7-2.5c-1.4-1.3-3.5-4.3-4.6-6.5-1.9-3.8-2-5.6-1.7-22.1 0.3-20.1 0.7-21.1 7.3-24.7 3.9-2.1 5.4-2.2 49.6-2.8 25-0.3 46.1-0.9 46.7-1.3 1.7-1 1.5-6.1-0.3-7.6-0.8-0.7-1.5-2-1.5-2.9-0.1-4.6-12.2-11.1-22.9-12.2-12.4-1.3-50.4-1.8-67.5-0.9z" fill="#2e3464"/>
  <path d="m1197.8 46-23.7 0.8-4.8 2.9c-2.8 1.7-5.7 4.6-7 6.9-2.2 3.9-2.3 4.3-2.3 46v42.2l6.5 6.1 6.6 6.1 35.7-0.1c19.6 0 43.8-0.4 53.6-0.8 20.5-0.9 20.6-0.9 20.6-9.7 0-7.2-0.9-11.1-2.9-12-0.9-0.4-19.6-1-41.6-1.5-22.5-0.4-41.1-1.2-42.6-1.7-2.5-1-2.6-1.2-3.3-14.4-0.9-15.4-0.9-15.1 0-32.5l0.6-13.2 4.2-0.5c2.2-0.3 21.3-0.7 42.2-0.8 30.3-0.3 38.5-0.6 39.8-1.7 1.3-1.1 1.6-3.2 1.6-10.2 0-12.2 0.5-11.9-18.8-11.9-8.6 0-21.3-0.2-28.2-0.4-6.9-0.2-23.2-0.1-36.2 0.4z" fill="#2e3464"/>
  <path d="m755.4 90.9c-6.4 1.6-6.6 2.4-2.4 10.8 5.1 10.2 2.2 9.5 39.4 9.1 21.8-0.2 32.9-0.7 33.6-1.4 0.8-0.8 0.1-3.2-2.4-8.7-2.6-5.8-4.2-8-6.3-8.9-3.3-1.3-57.1-2.2-61.9-0.9z" fill="#2e3464"/>
  <path d="m1211.3 90.7c-15.2 0.5-15.5 0.8-11.3 9.5 5.1 11 2.4 10.3 39.1 10.3 20.7 0 32.2-0.4 32.8-1 2-2-3-13.7-7.2-16.8-2.1-1.6-4.8-1.9-21.8-2.1-10.7-0.2-24.9-0.1-31.6 0.1z" fill="#2e3464"/>
  <path d="m95 208.9c-19.7 0.7-22.2 1.6-28.7 10.5-2.3 3-2.3 3.2-2.2 37.5 0 19 0.4 37.9 0.8 42 0.7 7 0.9 7.5 5.2 11.6l4.5 4.3 29.5 0.7c16.2 0.4 40.2 0.3 53.4-0.1l24-0.9 0.9-5.8c1.2-8.1-0.1-13.9-3.4-14.8-1.4-0.4-20.1-0.7-41.6-0.8-36.5-0.1-39.2-0.2-40.7-1.9-1.4-1.6-1.7-4.4-1.7-17.9 0-8.9 0.3-16.9 0.6-17.8 0.6-1.4 0.9-1.3 3 0.6 1.3 1.2 2.4 2.6 2.4 3.1 0 0.5 1.6 3.4 3.5 6.4l3.6 5.6 30.7-0.4c16.9-0.2 31.5-0.8 32.5-1.2 2.3-1.1 2.2-2.4-1.2-8.7-5.1-9.5-4.6-9.4-41-9.1-22.5 0.2-31.7-0.1-32.7-0.9-1.8-1.5-1.9-15.2-0.1-16.7 0.7-0.6 17.7-1.5 41.7-2.2 25-0.7 41-1.5 41.7-2.2 1.7-1.4 1.8-16.8 0-19.1-1.1-1.6-4.4-1.8-34.7-2.1-18.4-0.2-40.9-0.1-50 0.3z" fill="#2e3464"/>
  <path d="m238 209c-25.9 0.7-31.2 1.9-38.2 8.7-7.8 7.5-9.4 12.9-10.7 35.3-0.8 12.3-0.6 18.3 0.6 29 1.4 12.1 1.9 14 4.8 18.6 5.8 9.1 13.8 13.4 25.4 13.5 4.2 0 10.3 0.4 13.6 0.9 3.3 0.4 20.9 0.3 39-0.1 33.4-0.9 42.8-2 48-5.6 2.7-1.8 4-1.7 8.5 1.2 4.6 2.9 7.8 3.2 8.7 0.7 0.4-0.9 2-3.6 3.5-5.9 4.1-6 4.6-9.6 1.7-12.1-1.3-1.1-3.7-3.1-5.3-4.4l-2.9-2.5-0.2-22.4c-0.3-36-3.2-44.2-18.5-51.5l-6.5-3.1-24.5-0.5c-13.5-0.2-34.6-0.1-47 0.2zm55.8 25.9c6 3.1 7.1 5 8.4 14.2 1.4 10.4 0.6 15.9-2.3 15.9-2.4 0-12-5.2-19.4-10.4-7.4-5.3-9.2-4.9-14.6 3-2.4 3.6-4.8 7.2-5.4 7.9-1.5 2.2 4.9 8.1 13.5 12.4 11 5.4 13.1 7.1 12.8 9.5-0.3 2-1 2.1-20.3 2.7-25.4 0.9-36.7 0-39.9-3-4.3-4-5.8-12-5.4-28.2 0.4-17.1 1.6-20.6 8.1-23.8 3.9-2 5.9-2.1 32.5-2.1 25.8 0 28.6 0.2 32 1.9z" fill="#2e3464"/>
  <path d="m355.1 208.8c-2.9 0.6-3.6 1.3-4.4 4.1-0.4 1.9-0.7 19.2-0.4 38.5 0.4 36.2 0.5 37.3 4.8 47.1 2.6 6 6.1 9.5 12.4 12.4 5.7 2.7 7.7 3.1 22.6 4 11.2 0.7 24.5 0.7 41.9 0 24.8-1 25.7-1.1 32.6-4 12.6-5.3 16.9-11.8 18.5-28.7 1.2-11.8 0.7-70.1-0.6-72.2-1-1.5-27.2-1.3-28.2 0.2-0.4 0.7-1 16.9-1.3 36-0.5 33-0.6 34.8-2.6 37.4-1.1 1.5-3.3 3.7-4.8 4.8-2.6 2-4 2.1-28.7 2.1h-26l-4.5-4.7-4.4-4.7-0.1-9.8c-0.2-19.8-1.5-61.2-1.9-61.6-0.9-0.8-21.4-1.5-24.9-0.9z" fill="#2e3464"/>
  <path d="m505.8 208.7c-3.6 0.3-6.1 1-7 2-1 1.3-1.3 11.5-1.3 52.2v50.6l16.1 0.3 16.2 0.2 0.7-19.5c0.4-10.7 0.6-33.6 0.3-51-0.3-26-0.6-31.7-1.8-32.9-1.6-1.5-13.8-2.5-23.2-1.9z" fill="#2e3464"/>
  <path d="m558.2 208.9c-8.4 0.4-11.5 1-12.2 2.1-0.6 0.9-1 22.1-1 52.1v50.6l14.3 0.5c7.8 0.3 14.5 0.3 15 0.1 0.4-0.2 0.7-9.5 0.8-20.6 0-20.7 0.9-26.9 3.9-27.5 1-0.2 2.2 1.2 3.3 4 1 2.4 3.1 7.1 4.8 10.6l2.9 6.3 31.3-0.3c35.1-0.3 34.3-0.2 42.1-8.3 7-7.3 10.8-23.6 8.7-37.5-2.2-14-7-23.1-14.6-27.1-8.4-4.5-12.3-4.9-51-5.3-20.3-0.2-42.1-0.1-48.3 0.3zm75.6 26c4.4 1.7 6.5 6.2 6.6 13.7 0.1 5.1-0.3 6.7-2.7 10.1l-2.8 4.1-16.7 0.4c-9.2 0.2-21.9 0.2-28.3 0-14.1-0.5-14.1-0.5-14.7-14.3-0.4-8.9-0.2-9.9 1.9-12.9l2.4-3.2 25.5 0.4c17.6 0.3 26.5 0.8 28.8 1.7z" fill="#2e3464"/>
  <path d="m825.9 208.9c-8.2 0.5-10.2 1-14 3.4-4.4 2.8-9.2 9.1-13.7 17.7-1.2 2.5-3.3 6.3-4.6 8.5-1.3 2.2-3.7 6.6-5.5 9.7-1.7 3.2-4.5 8.4-6.2 11.5-1.8 3.2-4 7.3-5 9.1-0.9 1.8-2.3 3.9-2.9 4.7-1.9 2.2-5.8 1.8-7.3-0.8-5.3-8.5-7.6-12.5-12.9-22.2-3.4-6.1-8.1-14.9-10.5-19.6-10.9-21-13-22.1-41.1-21.7l-19.7 0.3-0.3 52.2-0.2 52.2 13.2 0.3c9.9 0.2 13.5 0 14.5-1 0.7-0.8 1.1-1.8 0.8-2.3-0.4-0.5-0.1-15.8 0.5-34.1 0.9-27 1.4-33.6 2.6-34.8 1.3-1.3 1.7-1.2 3.4 1 1.1 1.4 2.7 4.1 3.7 6 1 1.9 3.7 6.7 6.1 10.6 2.3 3.9 4.2 7.4 4.2 7.7 0 0.4 1.9 3.9 4.3 7.9 7.9 13.4 13.7 23.7 13.7 24.7 0 0.4 0.7 1.4 1.5 2.1 0.8 0.7 1.5 1.9 1.5 2.7 0 0.8 1.4 3.2 3 5.3 2.8 3.5 3.6 3.9 9.3 4.5 3.4 0.3 9.1 0.3 12.6-0.2 6.7-0.8 7.9-1.8 11.1-9.2 0.6-1.3 1.9-3.6 2.9-5 1.1-1.5 3-4.7 4.3-7.1 1.3-2.5 4.3-7.7 6.6-11.7 2.3-3.9 4.2-7.4 4.2-7.8 0-0.3 1.4-2.6 3-5 1.7-2.4 3-4.6 3-4.9 0-0.4 2-4 4.5-8 2.5-4.1 4.5-7.7 4.5-8.1 0-1.7 5.5-7.5 7.1-7.5 1.8 0 1.9 1.4 1.9 36.4 0 27.9 0.3 36.6 1.3 37.3 0.7 0.6 7 0.8 15 0.5l13.7-0.4v-51.2c0-28.1-0.4-51.6-0.8-52.2-0.9-1.4-20.4-2.3-33.3-1.5z" fill="#2e3464"/>
  <path d="m1123.3 208.8c-3.1 0.2-5.7 0.9-6.5 1.9-1 1.2-1.4 9.5-1.8 36.4-0.3 19.1-0.8 35-1.2 35.4-1.1 1.2-4.4-1.3-8.9-6.6-9.6-11.4-11.6-13.8-16.4-19.9-2.7-3.4-5.5-7.1-6.1-8.2-0.6-1-1.8-2.4-2.6-3.1-0.9-0.7-4.4-4.8-7.8-9.2-21.2-27.1-20.1-26.5-48.8-26.5-16.5 0-21.2 0.3-22.1 1.4-0.8 0.9-1.3 16.7-1.8 51.8-0.6 49.1-0.6 50.6 1.3 51.4 1 0.5 8 0.8 15.5 0.6l13.6-0.3 0.7-35c0.4-19.3 1-35.7 1.3-36.5 1-2.7 3.9-1.4 7.8 3.7 5.4 6.9 12.7 15.9 14.5 18 0.8 0.9 7.4 9.2 14.5 18.5 7.2 9.2 16.2 20.1 20.2 24.1l7.1 7.3 25.4-0.2 25.3-0.3 0.3-44c0.3-42-0.1-56.8-1.6-59.1-0.8-1.2-13.8-2.2-21.9-1.6z" fill="#2e3464"/>
  <path d="m1181.6 208.8c-16.3 0.1-25.4 0.6-26.3 1.3-2.1 1.8-1.8 20.2 0.4 22 1.3 1.1 11.4 1.5 54.2 1.7 28.9 0.2 56.4-0.1 61.1-0.5l8.5-0.8 0.3-10.5c0.1-5.8-0.1-11-0.5-11.6-0.9-1.2-54.5-2.1-97.7-1.6z" fill="#2e3464"/>
  <path d="m884 210.1c-3.2 1.3-7.7 5.6-9.8 9.4-1.5 2.6-1.7 7.9-2 41.9-0.3 43-0.4 42.3 6.1 49.1l3.8 4 53.2-0.4c29.3-0.2 53.5-0.5 54-0.8 1.3-0.8 0.8-18-0.5-19.1-0.8-0.6-16.5-1.1-40.8-1.4-39.4-0.5-43-0.8-45.1-4-0.9-1.4-0.2-53.9 0.8-54.8 2.2-1.9 16.3-3 40.4-3.1 14.5-0.1 30.2-0.4 34.9-0.7l8.5-0.7 0.3-10.3 0.3-10.2-50.8 0.1c-31.2 0-51.8 0.4-53.3 1z" fill="#2e3464"/>
  <path d="m1202.5 240.1c-0.4 0.6-0.7 17-0.8 36.5 0 29.4 0.2 35.7 1.4 36.9 1.9 1.9 27.3 3.4 28.3 1.7 0.6-1 0.8-20.7 0.6-66.3 0-4-1.7-5.2-8.7-6.4-2.1-0.4-5.7-1.3-8.1-2.1-5.1-1.7-11.8-1.8-12.7-0.3z" fill="#2e3464"/>
  <path d="m909.3 252.6c-1.7 0.8-1.6 4.4 0.2 6.8 0.8 1.1 1.5 2.7 1.5 3.5 0 0.9 1.1 2.9 2.4 4.6l2.4 3 30 0.3c31.1 0.4 34.2 0.1 34.2-3.7 0-2.1-4.4-10.9-6.6-13.1-1.2-1.3-6.4-1.5-32.2-1.7-16.9-0.1-31.3 0-31.9 0.3z" fill="#2e3464"/>
         <polyline transform="translate(80 -25) rotate(90)" points="0,0 25,80 50,0" fill="#4B55A3" >
 <animateMotion
   id="an"
   dur="7s"
   repeatCount="1"
   rotate="auto-reverse"
   begin="0s"
   fill="freeze"
   restart="whenNotActive">
       <mpath xlink:href="#border"/>
</animateMotion> 
 <!--   <set attributeName="fill-opacity" to="0" begin="an.end"  />  -->
</polyline> 
</g>
  </svg>

将箭头添加到 SVG 描边动画

Add arrow to SVG stroke animation

css

animation

svg

svg-animate