Timothy's Dev Stuff

A collection of code snippets and other developer things.

Animated Dashed SVG Stroke

I had a project in which the client wanted dashed lines, like those on a map, animated. They provided the SVG files as part of their design – so I tried using that and seeing what I could find. This article at CSS-Tricks had a solution but it wasn’t quite what I was looking for. They animated a solid line, somewhat, by adjusting the dasharray and dashoffset (the length of the dashes and the length between the dashes) to pretend to draw the line.

I ran with that and tried everything I could to get it to work but could not. Then, I had this “aha!” moment. I could use the software I have available to me to see if I could convert the stroke itself to a bunch of paths, then manipulate each path with a script. My software of choice was Affinity Designer 2. I am uncertain if the same or similar options will be available in open-source software or other suites.

In Affinity, with the stroke selected, I went to Layer > Expand Stroke. This converted the dashed stroke into individual rectangles. The next step was to right-click that object and choose Geometry > Separate Curves. This separated every rectangle into its own layer. I could the export this SVG and open it in VS Code for a few more adjustments (and to make sure I had individual paths as I had hoped). I added an ID and class to the SVG for manipulating with jQuery. I also changed their fill to be completely transparent with the plan to use jQuery to change them to the color of my choice (in this case, white).

The SVG is below; it’s pretty thiccc.

<svg id="dashed-lines-01" class="animated-dash" width="100%" height="100%" viewBox="0 0 737 828" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
    <path d="M0.413,124.159L-0.103,123.303C0.753,122.786 1.61,122.27 2.467,121.755L2.982,122.612C2.125,123.127 1.269,123.643 0.413,124.159Z" style="fill:#ffffff00;"/>
    <path d="M8.129,119.531L7.617,118.672C8.476,118.16 9.335,117.649 10.196,117.138L10.706,117.997C9.846,118.508 8.987,119.019 8.129,119.531Z" style="fill:#ffffff00;"/>
    <path d="M15.869,114.944L15.361,114.082C16.223,113.575 17.085,113.068 17.948,112.562L18.454,113.424C17.592,113.93 16.73,114.437 15.869,114.944Z" style="fill:#ffffff00;"/>
    <path d="M23.634,110.4L23.131,109.535C23.996,109.032 24.861,108.531 25.727,108.029L26.228,108.895C25.363,109.396 24.498,109.897 23.634,110.4Z" style="fill:#ffffff00;"/>
    <path d="M31.425,105.901L30.928,105.034C31.795,104.536 32.664,104.039 33.533,103.544L34.028,104.412C33.16,104.908 32.292,105.404 31.425,105.901Z" style="fill:#ffffff00;"/>
    <path d="M39.244,101.451L38.752,100.58C39.623,100.088 40.495,99.597 41.367,99.107L41.857,99.978C40.985,100.468 40.114,100.959 39.244,101.451Z" style="fill:#ffffff00;"/>
    <path d="M47.092,97.051L46.606,96.177C47.48,95.691 48.355,95.206 49.23,94.721L49.715,95.597C48.84,96.08 47.966,96.565 47.092,97.051Z" style="fill:#ffffff00;"/>
    <path d="M54.969,92.706L54.489,91.828C55.367,91.348 56.245,90.869 57.124,90.391L57.602,91.269C56.724,91.747 55.846,92.226 54.969,92.706Z" style="fill:#ffffff00;"/>
    <path d="M62.877,88.416L62.404,87.536C63.285,87.062 64.166,86.589 65.049,86.118L65.52,87C64.639,87.471 63.758,87.943 62.877,88.416Z" style="fill:#ffffff00;"/>
    <path d="M70.817,84.187L70.35,83.302C71.235,82.835 72.12,82.369 73.006,81.905L73.471,82.79C72.585,83.255 71.701,83.72 70.817,84.187Z" style="fill:#ffffff00;"/>
    <path d="M78.789,80.019L78.329,79.131C79.218,78.671 80.107,78.212 80.997,77.755L81.454,78.644C80.565,79.101 79.677,79.559 78.789,80.019Z" style="fill:#ffffff00;"/>
    <path d="M86.795,75.917L86.342,75.025C87.235,74.572 88.128,74.121 89.021,73.671L89.471,74.564C88.578,75.014 87.686,75.465 86.795,75.917Z" style="fill:#ffffff00;"/>
    <path d="M94.835,71.882L94.391,70.987C95.287,70.542 96.184,70.098 97.081,69.656L97.523,70.553C96.627,70.995 95.731,71.438 94.835,71.882Z" style="fill:#ffffff00;"/>
    <path d="M102.911,67.92L102.474,67.02C103.375,66.583 104.275,66.148 105.177,65.714L105.61,66.615C104.71,67.049 103.81,67.483 102.911,67.92Z" style="fill:#ffffff00;"/>
    <path d="M111.022,64.031L110.594,63.128C111.499,62.699 112.404,62.273 113.309,61.847L113.734,62.753C112.83,63.177 111.926,63.604 111.022,64.031Z" style="fill:#ffffff00;"/>
    <path d="M119.17,60.221L118.751,59.313C119.66,58.894 120.569,58.476 121.479,58.06L121.895,58.969C120.986,59.385 120.078,59.802 119.17,60.221Z" style="fill:#ffffff00;"/>
    <path d="M127.356,56.492L126.946,55.58C127.859,55.17 128.772,54.761 129.686,54.354L130.093,55.268C129.18,55.674 128.268,56.083 127.356,56.492Z" style="fill:#ffffff00;"/>
    <path d="M135.579,52.848L135.179,51.932C136.096,51.531 137.014,51.132 137.932,50.735L138.329,51.653C137.412,52.05 136.495,52.448 135.579,52.848Z" style="fill:#ffffff00;"/>
    <path d="M143.841,49.292L143.451,48.371C144.372,47.981 145.294,47.592 146.216,47.205L146.603,48.127C145.682,48.514 144.761,48.902 143.841,49.292Z" style="fill:#ffffff00;"/>
    <path d="M152.141,45.828L151.761,44.903C152.687,44.523 153.614,44.145 154.54,43.768L154.917,44.695C153.991,45.071 153.066,45.448 152.141,45.828Z" style="fill:#ffffff00;"/>
    <path d="M160.481,42.46L160.112,41.531C161.042,41.161 161.973,40.794 162.904,40.428L163.269,41.359C162.339,41.724 161.41,42.091 160.481,42.46Z" style="fill:#ffffff00;"/>
    <path d="M168.86,39.191L168.502,38.257C169.436,37.899 170.372,37.543 171.307,37.189L171.661,38.124C170.727,38.478 169.793,38.834 168.86,39.191Z" style="fill:#ffffff00;"/>
    <path d="M177.278,36.026L176.932,35.087C177.871,34.741 178.81,34.397 179.751,34.054L180.093,34.994C179.154,35.336 178.216,35.68 177.278,36.026Z" style="fill:#ffffff00;"/>
    <path d="M185.735,32.968L185.401,32.025C186.345,31.691 187.289,31.359 188.234,31.029L188.563,31.973C187.62,32.302 186.677,32.634 185.735,32.968Z" style="fill:#ffffff00;"/>
    <path d="M194.232,30.021L193.911,29.074C194.859,28.752 195.807,28.433 196.756,28.116L197.073,29.064C196.126,29.381 195.179,29.7 194.232,30.021Z" style="fill:#ffffff00;"/>
    <path d="M202.768,27.19L202.46,26.239C203.412,25.93 204.365,25.624 205.318,25.32L205.622,26.273C204.67,26.576 203.719,26.882 202.768,27.19Z" style="fill:#ffffff00;"/>
    <path d="M211.343,24.479L211.048,23.523C212.004,23.228 212.961,22.936 213.919,22.645L214.209,23.602C213.253,23.892 212.298,24.184 211.343,24.479Z" style="fill:#ffffff00;"/>
    <path d="M219.955,21.891L219.674,20.932C220.635,20.651 221.596,20.372 222.558,20.096L222.834,21.057C221.874,21.333 220.914,21.611 219.955,21.891Z" style="fill:#ffffff00;"/>
    <path d="M228.605,19.433L228.338,18.469C229.303,18.202 230.269,17.938 231.235,17.677L231.496,18.642C230.532,18.903 229.568,19.167 228.605,19.433Z" style="fill:#ffffff00;"/>
    <path d="M237.291,17.106L237.039,16.138C238.008,15.887 238.978,15.638 239.948,15.392L240.194,16.361C239.226,16.607 238.258,16.855 237.291,17.106Z" style="fill:#ffffff00;"/>
    <path d="M246.012,14.917L245.776,13.945C246.749,13.71 247.723,13.476 248.696,13.246L248.927,14.219C247.955,14.449 246.983,14.682 246.012,14.917Z" style="fill:#ffffff00;"/>
    <path d="M254.767,12.87L254.548,11.894C255.524,11.674 256.501,11.457 257.479,11.242L257.693,12.219C256.717,12.433 255.742,12.65 254.767,12.87Z" style="fill:#ffffff00;"/>
    <path d="M263.556,10.967L263.352,9.988C264.332,9.785 265.313,9.584 266.294,9.386L266.492,10.367C265.513,10.564 264.534,10.764 263.556,10.967Z" style="fill:#ffffff00;"/>
    <path d="M272.374,9.216L272.188,8.233C273.172,8.047 274.156,7.863 275.14,7.682L275.321,8.666C274.338,8.846 273.356,9.029 272.374,9.216Z" style="fill:#ffffff00;"/>
    <path d="M281.222,7.618L281.053,6.632C282.04,6.463 283.027,6.297 284.015,6.134L284.178,7.12C283.192,7.283 282.207,7.449 281.222,7.618Z" style="fill:#ffffff00;"/>
    <path d="M290.097,6.179L289.946,5.19C290.936,5.039 291.926,4.891 292.916,4.746L293.061,5.735C292.073,5.88 291.085,6.028 290.097,6.179Z" style="fill:#ffffff00;"/>
    <path d="M298.997,4.902L298.864,3.911C299.856,3.778 300.849,3.649 301.842,3.522L301.968,4.514C300.977,4.64 299.987,4.77 298.997,4.902Z" style="fill:#ffffff00;"/>
    <path d="M307.918,3.793L307.804,2.799C308.799,2.685 309.794,2.574 310.789,2.466L310.897,3.46C309.904,3.568 308.911,3.679 307.918,3.793Z" style="fill:#ffffff00;"/>
    <path d="M316.86,2.853L316.765,1.858C317.761,1.763 318.758,1.671 319.755,1.582L319.844,2.578C318.848,2.667 317.854,2.758 316.86,2.853Z" style="fill:#ffffff00;"/>
    <path d="M325.817,2.088L325.742,1.091C326.74,1.015 327.738,0.943 328.737,0.874L328.806,1.872C327.809,1.94 326.813,2.012 325.817,2.088Z" style="fill:#ffffff00;"/>
    <path d="M334.788,1.5L334.732,0.501C335.731,0.446 336.731,0.394 337.731,0.345L337.78,1.344C336.782,1.392 335.785,1.444 334.788,1.5Z" style="fill:#ffffff00;"/>
    <path d="M343.768,1.092L343.733,0.093C344.733,0.058 345.734,0.026 346.735,-0.003L346.763,0.997C345.764,1.025 344.766,1.057 343.768,1.092Z" style="fill:#ffffff00;"/>
    <path d="M352.755,0.868L352.74,-0.132C353.741,-0.146 354.742,-0.157 355.743,-0.165L355.751,0.835C354.752,0.842 353.753,0.854 352.755,0.868Z" style="fill:#ffffff00;"/>
    <path d="M361.748,0.802L361.746,-0.198C362.731,-0.199 363.733,-0.198 364.751,-0.191L364.744,0.809C363.73,0.802 362.73,0.801 361.748,0.802Z" style="fill:#ffffff00;"/>
    <path d="M370.729,0.925L370.763,-0.075C371.759,-0.041 372.762,0.002 373.769,0.055L373.717,1.054C372.715,1.001 371.718,0.958 370.729,0.925Z" style="fill:#ffffff00;"/>
    <path d="M379.675,1.506L379.776,0.511C380.776,0.613 381.775,0.728 382.77,0.859L382.64,1.85C381.654,1.721 380.665,1.606 379.675,1.506Z" style="fill:#ffffff00;"/>
    <path d="M388.519,2.836L388.723,1.857C389.714,2.063 390.697,2.289 391.668,2.538L391.42,3.507C390.464,3.262 389.496,3.039 388.519,2.836Z" style="fill:#ffffff00;"/>
    <path d="M397.088,5.286L397.443,4.351C398.395,4.713 399.329,5.104 400.241,5.525L399.821,6.433C398.931,6.021 398.018,5.64 397.088,5.286Z" style="fill:#ffffff00;"/>
    <path d="M404.969,9.335L405.534,8.51C406.375,9.087 407.185,9.701 407.961,10.355L407.317,11.119C406.566,10.487 405.782,9.893 404.969,9.335Z" style="fill:#ffffff00;"/>
    <path d="M411.384,15.369L412.175,14.757C412.82,15.59 413.397,16.429 413.91,17.271L413.056,17.791C412.561,16.98 412.005,16.172 411.384,15.369Z" style="fill:#ffffff00;"/>
    <path d="M415.441,23.134L416.401,22.854C416.693,23.856 416.906,24.858 417.044,25.856L416.054,25.994C415.922,25.043 415.719,24.089 415.441,23.134Z" style="fill:#ffffff00;"/>
    <path d="M416.01,31.83L416.999,31.978C416.847,32.987 416.627,33.985 416.343,34.971L415.382,34.694C415.654,33.751 415.865,32.795 416.01,31.83Z" style="fill:#ffffff00;"/>
    <path d="M413.114,40.114L413.989,40.597C413.501,41.48 412.966,42.345 412.388,43.189L411.563,42.625C412.123,41.806 412.641,40.969 413.114,40.114Z" style="fill:#ffffff00;"/>
    <path d="M407.819,47.198L408.539,47.892C407.839,48.618 407.108,49.321 406.35,49.997L405.685,49.251C406.423,48.591 407.136,47.906 407.819,47.198Z" style="fill:#ffffff00;"/>
    <path d="M400.99,52.875L401.554,53.7C400.733,54.262 399.911,54.827 399.096,55.405L398.518,54.588C399.337,54.008 400.164,53.439 400.99,52.875Z" style="fill:#ffffff00;"/>
    <path d="M393.734,58.288L394.391,59.043C393.645,59.691 392.925,60.365 392.24,61.072L391.522,60.376C392.227,59.649 392.967,58.956 393.734,58.288Z" style="fill:#ffffff00;"/>
    <path d="M387.801,65.221L388.669,65.717C388.186,66.562 387.763,67.446 387.414,68.355L386.48,67.996C386.848,67.039 387.293,66.109 387.801,65.221Z" style="fill:#ffffff00;"/>
    <path d="M385.288,74.026L386.288,74.032C386.282,74.998 386.379,75.958 386.59,76.896L385.615,77.116C385.386,76.104 385.282,75.068 385.288,74.026Z" style="fill:#ffffff00;"/>
    <path d="M388.421,82.627L389.174,81.969C389.802,82.689 390.517,83.333 391.306,83.91L390.716,84.718C389.866,84.096 389.097,83.402 388.421,82.627Z" style="fill:#ffffff00;"/>
    <path d="M396.202,87.453L396.519,86.505C397.426,86.808 398.376,87.069 399.361,87.293L399.139,88.268C398.121,88.037 397.14,87.766 396.202,87.453Z" style="fill:#ffffff00;"/>
    <path d="M405.133,89.178L405.222,88.182C406.196,88.27 407.187,88.334 408.193,88.377L408.149,89.376C407.128,89.332 406.121,89.267 405.133,89.178Z" style="fill:#ffffff00;"/>
    <path d="M414.182,89.421L414.158,88.421C415.15,88.398 416.147,88.361 417.144,88.313L417.192,89.311C416.187,89.36 415.182,89.397 414.182,89.421Z" style="fill:#ffffff00;"/>
    <path d="M423.195,88.909L423.112,87.912C424.116,87.829 425.111,87.739 426.095,87.646L426.189,88.641C425.202,88.735 424.203,88.825 423.195,88.909Z" style="fill:#ffffff00;"/>
    <path d="M432.164,88.033L432.059,87.039C433.081,86.931 434.078,86.825 435.044,86.726L435.146,87.72C434.181,87.82 433.185,87.925 432.164,88.033Z" style="fill:#ffffff00;"/>
    <path d="M441.104,87.183L441.037,86.185C442.134,86.111 443.147,86.064 444.061,86.053L444.073,87.053C443.176,87.064 442.181,87.11 441.104,87.183Z" style="fill:#ffffff00;"/>
    <path d="M450.081,86.946L450.051,85.946C451.031,85.917 452.03,85.883 453.047,85.848L453.082,86.848C452.063,86.883 451.062,86.916 450.081,86.946Z" style="fill:#ffffff00;"/>
    <path d="M459.076,86.642L459.045,85.643C460.037,85.612 461.039,85.583 462.048,85.559L462.071,86.559C461.065,86.583 460.066,86.611 459.076,86.642Z" style="fill:#ffffff00;"/>
    <path d="M468.059,86.484L468.059,85.484C469.06,85.485 470.064,85.493 471.068,85.511L471.05,86.511C470.052,86.493 469.054,86.485 468.059,86.484Z" style="fill:#ffffff00;"/>
    <path d="M477.022,86.747L477.085,85.749C478.092,85.813 479.094,85.89 480.091,85.982L479.998,86.978C479.011,86.887 478.019,86.81 477.022,86.747Z" style="fill:#ffffff00;"/>
    <path d="M485.912,87.736L486.077,86.75C487.079,86.918 488.07,87.106 489.046,87.317L488.835,88.294C487.874,88.087 486.898,87.901 485.912,87.736Z" style="fill:#ffffff00;"/>
    <path d="M494.561,89.868L494.885,88.922C495.852,89.253 496.798,89.614 497.72,90.007L497.328,90.927C496.428,90.543 495.505,90.191 494.561,89.868Z" style="fill:#ffffff00;"/>
    <path d="M502.535,93.704L503.087,92.87C503.939,93.433 504.757,94.038 505.54,94.686L504.902,95.456C504.147,94.831 503.357,94.248 502.535,93.704Z" style="fill:#ffffff00;"/>
    <path d="M508.978,99.696L509.765,99.079C510.393,99.881 510.983,100.707 511.534,101.555L510.695,102.1C510.161,101.276 509.588,100.474 508.978,99.696Z" style="fill:#ffffff00;"/>
    <path d="M513.457,107.317L514.379,106.93C514.772,107.867 515.123,108.819 515.431,109.786L514.479,110.09C514.179,109.151 513.838,108.226 513.457,107.317Z" style="fill:#ffffff00;"/>
    <path d="M515.766,115.851L516.758,115.72C516.89,116.725 516.978,117.736 517.02,118.752L516.021,118.794C515.98,117.808 515.895,116.826 515.766,115.851Z" style="fill:#ffffff00;"/>
    <path d="M515.741,124.691L516.732,124.827C516.677,125.225 516.615,125.623 516.546,126.021C516.452,126.631 516.328,127.235 516.174,127.831L515.206,127.582C515.352,127.016 515.469,126.443 515.56,125.859L515.56,125.854C515.628,125.467 515.688,125.079 515.741,124.691Z" style="fill:#ffffff00;"/>
    <path d="M512.825,132.841L513.629,133.435C513.019,134.261 512.345,135.038 511.614,135.758L510.912,135.045C511.606,134.362 512.245,133.625 512.825,132.841Z" style="fill:#ffffff00;"/>
    <path d="M506.272,138.693L506.834,139.52C506,140.087 505.15,140.629 504.288,141.154L503.768,140.299C504.616,139.784 505.452,139.25 506.272,138.693Z" style="fill:#ffffff00;"/>
    <path d="M498.568,143.236L499.04,144.117C498.159,144.59 497.274,145.058 496.39,145.527L495.921,144.643C496.804,144.175 497.688,143.708 498.568,143.236Z" style="fill:#ffffff00;"/>
    <path d="M490.643,147.536L491.144,148.401C490.63,148.699 490.119,149.002 489.612,149.311C489.273,149.518 488.935,149.729 488.598,149.945L488.059,149.102C488.402,148.883 488.746,148.668 489.092,148.457C489.605,148.144 490.123,147.837 490.643,147.536Z" style="fill:#ffffff00;"/>
    <path d="M483.166,152.679L483.81,153.444C483.053,154.082 482.323,154.746 481.627,155.439L480.921,154.73C481.637,154.018 482.388,153.335 483.166,152.679Z" style="fill:#ffffff00;"/>
    <path d="M477.06,159.447L477.901,159.989C477.37,160.812 476.894,161.667 476.481,162.552L475.575,162.129C476.007,161.203 476.505,160.309 477.06,159.447Z" style="fill:#ffffff00;"/>
    <path d="M473.863,168.015L474.855,168.142C474.731,169.111 474.68,170.087 474.691,171.065L473.691,171.077C473.679,170.052 473.733,169.03 473.863,168.015Z" style="fill:#ffffff00;"/>
    <path d="M474.449,177.124L475.424,176.902C475.643,177.865 475.903,178.82 476.196,179.76L475.241,180.057C474.941,179.092 474.673,178.113 474.449,177.124Z" style="fill:#ffffff00;"/>
    <path d="M477.417,185.715L478.324,185.295C478.74,186.192 479.185,187.075 479.662,187.94L478.786,188.423C478.298,187.537 477.842,186.633 477.417,185.715Z" style="fill:#ffffff00;"/>
    <path d="M482.109,193.504L482.9,192.893C483.504,193.674 484.139,194.428 484.805,195.153L484.07,195.83C483.384,195.085 482.73,194.308 482.109,193.504Z" style="fill:#ffffff00;"/>
    <path d="M488.593,199.903L489.186,199.098C489.631,199.426 490.087,199.742 490.552,200.045C490.91,200.278 491.274,200.504 491.645,200.723L491.137,201.584C490.753,201.358 490.376,201.124 490.006,200.883C489.525,200.569 489.054,200.242 488.593,199.903Z" style="fill:#ffffff00;"/>
    <path d="M496.621,204.201L496.979,203.268C497.892,203.617 498.828,203.939 499.783,204.234L499.488,205.19C498.511,204.888 497.554,204.559 496.621,204.201Z" style="fill:#ffffff00;"/>
    <path d="M505.356,206.66L505.551,205.679C506.517,205.871 507.496,206.044 508.484,206.2L508.329,207.187C507.327,207.03 506.335,206.855 505.356,206.66Z" style="fill:#ffffff00;"/>
    <path d="M514.315,207.923L514.407,206.927C515.396,207.018 516.389,207.096 517.385,207.162L517.318,208.16C516.315,208.093 515.313,208.014 514.315,207.923Z" style="fill:#ffffff00;"/>
    <path d="M523.331,208.435L523.359,207.436C524.36,207.463 525.358,207.482 526.351,207.495L526.338,208.495C525.34,208.482 524.337,208.463 523.331,208.435Z" style="fill:#ffffff00;"/>
    <path d="M532.348,208.505L532.341,207.505C533.352,207.497 534.352,207.487 535.338,207.475L535.35,208.475C534.362,208.487 533.361,208.497 532.348,208.505Z" style="fill:#ffffff00;"/>
    <path d="M541.349,208.398L541.339,207.398C542.283,207.388 543.207,207.382 544.107,207.38C544.185,207.38 544.264,207.38 544.342,207.379L544.345,208.379C544.266,208.38 544.188,208.38 544.109,208.38C543.212,208.382 542.291,208.388 541.349,208.398Z" style="fill:#ffffff00;"/>
    <path d="M550.36,208.261L550.324,207.261C551.321,207.226 552.318,207.183 553.315,207.134L553.364,208.132C552.363,208.182 551.361,208.225 550.36,208.261Z" style="fill:#ffffff00;"/>
    <path d="M559.365,207.755L559.29,206.758C560.285,206.684 561.28,206.603 562.275,206.518L562.361,207.514C561.362,207.6 560.363,207.681 559.365,207.755Z" style="fill:#ffffff00;"/>
    <path d="M568.342,206.944L568.239,205.949C569.232,205.846 570.225,205.738 571.218,205.627L571.329,206.621C570.333,206.732 569.338,206.84 568.342,206.944Z" style="fill:#ffffff00;"/>
    <path d="M577.293,205.92L577.171,204.927C578.163,204.805 579.155,204.681 580.146,204.555L580.272,205.547C579.279,205.673 578.286,205.797 577.293,205.92Z" style="fill:#ffffff00;"/>
    <path d="M586.225,204.774L586.094,203.782C587.085,203.652 588.077,203.52 589.068,203.389L589.199,204.38C588.208,204.512 587.216,204.643 586.225,204.774Z" style="fill:#ffffff00;"/>
    <path d="M595.147,203.595L595.017,202.603C596.009,202.474 597.002,202.345 597.993,202.218L598.12,203.21C597.129,203.337 596.138,203.465 595.147,203.595Z" style="fill:#ffffff00;"/>
    <path d="M604.07,202.471L603.952,201.478C604.947,201.36 605.941,201.244 606.935,201.131L607.047,202.124C606.055,202.237 605.063,202.353 604.07,202.471Z" style="fill:#ffffff00;"/>
    <path d="M613.006,201.493L612.909,200.498C613.907,200.4 614.904,200.307 615.901,200.219L615.989,201.215C614.995,201.303 614.001,201.396 613.006,201.493Z" style="fill:#ffffff00;"/>
    <path d="M621.959,200.754L621.894,199.756C622.895,199.69 623.896,199.631 624.895,199.579L624.947,200.578C623.952,200.63 622.956,200.689 621.959,200.754Z" style="fill:#ffffff00;"/>
    <path d="M630.928,200.352L630.906,199.353C631.909,199.33 632.912,199.316 633.914,199.311L633.919,200.311C632.923,200.316 631.926,200.33 630.928,200.352Z" style="fill:#ffffff00;"/>
    <path d="M639.899,200.391L639.932,199.392C640.936,199.425 641.938,199.468 642.94,199.521L642.886,200.52C641.892,200.467 640.896,200.424 639.899,200.391Z" style="fill:#ffffff00;"/>
    <path d="M648.846,200.974L648.945,199.979C649.944,200.078 650.941,200.189 651.938,200.313L651.815,201.306C650.826,201.183 649.836,201.072 648.846,200.974Z" style="fill:#ffffff00;"/>
    <path d="M657.721,202.197L657.896,201.213C658.884,201.389 659.871,201.579 660.856,201.783L660.653,202.762C659.677,202.56 658.699,202.372 657.721,202.197Z" style="fill:#ffffff00;"/>
    <path d="M666.461,204.142L666.721,203.176C667.183,203.301 667.646,203.429 668.11,203.561L668.112,203.561C668.616,203.71 669.119,203.862 669.62,204.018L669.323,204.973C668.828,204.818 668.331,204.668 667.832,204.521C667.375,204.391 666.918,204.265 666.461,204.142Z" style="fill:#ffffff00;"/>
    <path d="M674.965,206.92L675.32,205.985C676.261,206.342 677.195,206.713 678.122,207.098L677.739,208.022C676.821,207.641 675.897,207.273 674.965,206.92Z" style="fill:#ffffff00;"/>
    <path d="M683.179,210.477L683.618,209.578C684.522,210.02 685.418,210.475 686.307,210.943L685.84,211.828C684.961,211.364 684.074,210.914 683.179,210.477Z" style="fill:#ffffff00;"/>
    <path d="M691.033,214.77L691.553,213.916C692.412,214.438 693.263,214.973 694.105,215.521L693.56,216.359C692.726,215.817 691.884,215.287 691.033,214.77Z" style="fill:#ffffff00;"/>
    <path d="M698.462,219.764L699.057,218.96C699.865,219.558 700.664,220.169 701.453,220.791L700.833,221.576C700.052,220.96 699.262,220.356 698.462,219.764Z" style="fill:#ffffff00;"/>
    <path d="M705.405,225.414L706.071,224.668C706.821,225.337 707.56,226.018 708.289,226.71L707.601,227.435C706.879,226.75 706.147,226.077 705.405,225.414Z" style="fill:#ffffff00;"/>
    <path d="M711.803,231.674L712.534,230.991C713.22,231.726 713.894,232.471 714.558,233.227L713.806,233.887C713.149,233.139 712.482,232.401 711.803,231.674Z" style="fill:#ffffff00;"/>
    <path d="M717.604,238.491L718.395,237.878C719.01,238.672 719.614,239.476 720.205,240.289L719.397,240.877C718.811,240.072 718.214,239.277 717.604,238.491Z" style="fill:#ffffff00;"/>
    <path d="M722.759,245.809L723.602,245.271C724.142,246.117 724.67,246.973 725.185,247.837L724.326,248.349C723.816,247.494 723.293,246.647 722.759,245.809Z" style="fill:#ffffff00;"/>
    <path d="M727.223,253.567L728.111,253.109C728.572,254.001 729.019,254.901 729.453,255.809L728.55,256.24C728.121,255.341 727.678,254.45 727.223,253.567Z" style="fill:#ffffff00;"/>
    <path d="M730.958,261.702L731.885,261.327C732.261,262.257 732.624,263.194 732.973,264.138L732.035,264.485C731.69,263.55 731.331,262.622 730.958,261.702Z" style="fill:#ffffff00;"/>
    <path d="M733.85,270.158L734.814,269.892C735.082,270.862 735.331,271.839 735.556,272.821L734.582,273.045C734.359,272.077 734.115,271.114 733.85,270.158Z" style="fill:#ffffff00;"/>
    <path d="M735.63,278.899L736.623,278.774C736.749,279.778 736.847,280.784 736.914,281.788L735.917,281.855C735.851,280.87 735.754,279.884 735.63,278.899Z" style="fill:#ffffff00;"/>
    <path d="M735.924,287.783L736.921,287.852C736.852,288.864 736.744,289.871 736.597,290.872L735.608,290.726C735.751,289.751 735.856,288.769 735.924,287.783Z" style="fill:#ffffff00;"/>
    <path d="M734.253,296.475L735.202,296.789C734.996,297.412 734.77,298.03 734.525,298.643C734.392,298.976 734.254,299.306 734.111,299.632L733.195,299.231C733.333,298.915 733.467,298.595 733.597,298.271C733.834,297.677 734.053,297.078 734.253,296.475Z" style="fill:#ffffff00;"/>
    <path d="M730.346,304.399L731.174,304.959C730.605,305.802 729.999,306.616 729.361,307.402L728.585,306.772C729.205,306.008 729.792,305.218 730.346,304.399Z" style="fill:#ffffff00;"/>
    <path d="M724.497,311.047L725.164,311.792C724.413,312.464 723.635,313.111 722.832,313.733L722.219,312.943C723.003,312.335 723.764,311.703 724.497,311.047Z" style="fill:#ffffff00;"/>
    <path d="M717.307,316.273L717.818,317.133C716.955,317.646 716.074,318.137 715.176,318.608L714.711,317.723C715.593,317.26 716.459,316.777 717.307,316.273Z" style="fill:#ffffff00;"/>
    <path d="M709.316,320.236L709.697,321.16C708.77,321.543 707.831,321.908 706.884,322.256L706.539,321.317C707.474,320.974 708.4,320.614 709.316,320.236Z" style="fill:#ffffff00;"/>
    <path d="M700.87,323.171L701.149,324.131C700.183,324.411 699.213,324.676 698.24,324.926L697.991,323.957C698.954,323.71 699.915,323.448 700.87,323.171Z" style="fill:#ffffff00;"/>
    <path d="M692.168,325.282L692.364,326.263C691.374,326.46 690.387,326.644 689.403,326.815L689.231,325.83C690.207,325.66 691.187,325.478 692.168,325.282Z" style="fill:#ffffff00;"/>
    <path d="M683.318,326.738L683.455,327.729C682.461,327.867 681.468,327.997 680.474,328.122L680.35,327.13C681.339,327.006 682.329,326.875 683.318,326.738Z" style="fill:#ffffff00;"/>
    <path d="M674.4,327.798L674.499,328.793C673.502,328.893 672.504,328.986 671.506,329.072L671.419,328.076C672.413,327.99 673.407,327.897 674.4,327.798Z" style="fill:#ffffff00;"/>
    <path d="M665.449,328.523L665.511,329.521C664.511,329.584 663.51,329.64 662.51,329.691L662.459,328.693C663.455,328.642 664.452,328.585 665.449,328.523Z" style="fill:#ffffff00;"/>
    <path d="M656.475,328.928L656.503,329.928C655.502,329.956 654.5,329.978 653.498,329.995L653.482,328.995C654.479,328.978 655.477,328.956 656.475,328.928Z" style="fill:#ffffff00;"/>
    <path d="M647.492,329.031L647.488,330.031C646.486,330.026 645.484,330.017 644.483,330.002L644.498,329.002C645.496,329.017 646.494,329.027 647.492,329.031Z" style="fill:#ffffff00;"/>
    <path d="M638.509,328.852L638.475,329.851C637.474,329.816 636.473,329.776 635.472,329.732L635.516,328.733C636.514,328.777 637.512,328.817 638.509,328.852Z" style="fill:#ffffff00;"/>
    <path d="M629.534,328.411L629.471,329.409C628.472,329.346 627.473,329.278 626.474,329.206L626.545,328.209C627.542,328.281 628.538,328.348 629.534,328.411Z" style="fill:#ffffff00;"/>
    <path d="M620.573,327.729L620.485,328.725C619.488,328.637 618.491,328.544 617.494,328.447L617.59,327.452C618.584,327.548 619.579,327.641 620.573,327.729Z" style="fill:#ffffff00;"/>
    <path d="M611.63,326.829L611.518,327.822C610.524,327.711 609.529,327.596 608.535,327.477L608.653,326.484C609.646,326.602 610.638,326.717 611.63,326.829Z" style="fill:#ffffff00;"/>
    <path d="M602.708,325.732L602.575,326.723C601.584,326.59 600.592,326.455 599.6,326.316L599.738,325.326C600.728,325.464 601.718,325.6 602.708,325.732Z" style="fill:#ffffff00;"/>
    <path d="M593.808,324.459L593.657,325.448C592.668,325.297 591.679,325.144 590.69,324.988L590.846,324C591.833,324.156 592.82,324.309 593.808,324.459Z" style="fill:#ffffff00;"/>
    <path d="M584.929,323.033L584.763,324.019C583.777,323.853 582.79,323.684 581.804,323.512L581.975,322.527C582.96,322.698 583.945,322.867 584.929,323.033Z" style="fill:#ffffff00;"/>
    <path d="M576.073,321.474L575.893,322.458C574.909,322.278 573.925,322.095 572.941,321.911L573.125,320.928C574.107,321.112 575.09,321.294 576.073,321.474Z" style="fill:#ffffff00;"/>
    <path d="M567.235,319.802L567.044,320.784C566.062,320.592 565.08,320.399 564.099,320.204L564.293,319.223C565.274,319.418 566.255,319.611 567.235,319.802Z" style="fill:#ffffff00;"/>
    <path d="M558.415,318.038L558.214,319.017C557.234,318.817 556.254,318.615 555.275,318.412L555.478,317.432C556.457,317.635 557.436,317.837 558.415,318.038Z" style="fill:#ffffff00;"/>
    <path d="M549.608,316.2L549.4,317.178C548.422,316.971 547.444,316.762 546.465,316.552L546.675,315.574C547.653,315.784 548.63,315.992 549.608,316.2Z" style="fill:#ffffff00;"/>
    <path d="M540.812,314.308L540.599,315.285C539.622,315.073 538.645,314.859 537.667,314.645L537.881,313.669C538.858,313.882 539.835,314.095 540.812,314.308Z" style="fill:#ffffff00;"/>
    <path d="M532.022,312.38L531.806,313.357C530.83,313.141 529.854,312.926 528.877,312.71L529.093,311.733C530.069,311.949 531.046,312.165 532.022,312.38Z" style="fill:#ffffff00;"/>
    <path d="M523.235,310.436L523.019,311.412C522.042,311.196 521.066,310.98 520.09,310.763L520.306,309.787C521.282,310.003 522.259,310.22 523.235,310.436Z" style="fill:#ffffff00;"/>
    <path d="M514.447,308.493L514.231,309.469C513.255,309.254 512.279,309.039 511.302,308.825L511.516,307.848C512.493,308.063 513.47,308.277 514.447,308.493Z" style="fill:#ffffff00;"/>
    <path d="M505.653,306.569L505.441,307.546C504.464,307.334 503.487,307.123 502.509,306.913L502.72,305.935C503.698,306.146 504.675,306.357 505.653,306.569Z" style="fill:#ffffff00;"/>
    <path d="M496.85,304.683L496.643,305.661C495.665,305.455 494.687,305.249 493.708,305.045L493.913,304.066C494.892,304.271 495.871,304.476 496.85,304.683Z" style="fill:#ffffff00;"/>
    <path d="M488.034,302.854L487.835,303.834C486.855,303.634 485.875,303.437 484.895,303.24L485.092,302.26C486.073,302.456 487.053,302.654 488.034,302.854Z" style="fill:#ffffff00;"/>
    <path d="M479.202,301.099L479.012,302.081C478.03,301.891 477.049,301.703 476.067,301.517L476.253,300.535C477.236,300.721 478.219,300.909 479.202,301.099Z" style="fill:#ffffff00;"/>
    <path d="M470.35,299.439L470.172,300.423C469.188,300.245 468.205,300.069 467.221,299.895L467.395,298.91C468.38,299.084 469.365,299.261 470.35,299.439Z" style="fill:#ffffff00;"/>
    <path d="M461.477,297.892L461.312,298.879C460.327,298.714 459.341,298.552 458.355,298.393L458.514,297.405C459.502,297.565 460.49,297.727 461.477,297.892Z" style="fill:#ffffff00;"/>
    <path d="M452.581,296.479L452.432,297.467C451.444,297.319 450.456,297.173 449.467,297.03L449.61,296.04C450.6,296.184 451.591,296.33 452.581,296.479Z" style="fill:#ffffff00;"/>
    <path d="M443.66,295.218L443.53,296.209C442.539,296.079 441.548,295.951 440.557,295.827L440.682,294.835C441.675,294.959 442.668,295.087 443.66,295.218Z" style="fill:#ffffff00;"/>
    <path d="M434.716,294.131L434.606,295.125C433.613,295.014 432.62,294.908 431.627,294.805L431.73,293.81C432.725,293.913 433.721,294.02 434.716,294.131Z" style="fill:#ffffff00;"/>
    <path d="M425.749,293.237L425.662,294.233C424.667,294.146 423.672,294.062 422.676,293.983L422.756,292.986C423.754,293.066 424.752,293.149 425.749,293.237Z" style="fill:#ffffff00;"/>
    <path d="M416.763,292.558L416.7,293.556C415.703,293.494 414.707,293.435 413.71,293.382L413.763,292.383C414.763,292.437 415.763,292.495 416.763,292.558Z" style="fill:#ffffff00;"/>
    <path d="M407.757,292.12L407.727,293.12C406.735,293.09 405.738,293.069 404.737,293.057L404.749,292.057C405.756,292.069 406.759,292.09 407.757,292.12Z" style="fill:#ffffff00;"/>
    <path d="M398.732,292.089L398.755,293.089C397.761,293.112 396.764,293.144 395.766,293.185L395.724,292.186C396.729,292.144 397.732,292.112 398.732,292.089Z" style="fill:#ffffff00;"/>
    <path d="M389.717,292.546L389.796,293.543C388.803,293.622 387.81,293.71 386.817,293.808L386.719,292.812C387.718,292.714 388.717,292.625 389.717,292.546Z" style="fill:#ffffff00;"/>
    <path d="M380.741,293.525L380.88,294.515C379.893,294.654 378.907,294.803 377.925,294.962L377.764,293.975C378.754,293.814 379.747,293.664 380.741,293.525Z" style="fill:#ffffff00;"/>
    <path d="M371.843,295.075L372.049,296.054C371.072,296.259 370.1,296.476 369.133,296.704L368.903,295.731C369.878,295.501 370.858,295.282 371.843,295.075Z" style="fill:#ffffff00;"/>
    <path d="M363.076,297.267L363.357,298.227C362.399,298.507 361.448,298.8 360.504,299.106L360.196,298.155C361.149,297.846 362.109,297.55 363.076,297.267Z" style="fill:#ffffff00;"/>
    <path d="M354.519,300.189L354.886,301.119C353.957,301.485 353.038,301.865 352.13,302.26L351.731,301.342C352.65,300.944 353.58,300.559 354.519,300.189Z" style="fill:#ffffff00;"/>
    <path d="M346.286,303.945L346.75,304.83C345.868,305.294 344.997,305.773 344.14,306.268L343.64,305.402C344.509,304.9 345.391,304.415 346.286,303.945Z" style="fill:#ffffff00;"/>
    <path d="M338.543,308.646L339.118,309.465C338.303,310.036 337.504,310.625 336.722,311.231L336.11,310.44C336.904,309.825 337.716,309.227 338.543,308.646Z" style="fill:#ffffff00;"/>
    <path d="M331.521,314.381L332.211,315.105C331.493,315.789 330.795,316.492 330.116,317.213L329.388,316.528C330.079,315.793 330.79,315.078 331.521,314.381Z" style="fill:#ffffff00;"/>
    <path d="M325.496,321.165L326.298,321.763C325.707,322.554 325.139,323.365 324.593,324.195L323.757,323.645C324.314,322.799 324.894,321.972 325.496,321.165Z" style="fill:#ffffff00;"/>
    <path d="M320.734,328.892L321.628,329.339C321.189,330.219 320.772,331.117 320.379,332.034L319.459,331.64C319.861,330.704 320.286,329.789 320.734,328.892Z" style="fill:#ffffff00;"/>
    <path d="M317.376,337.321L318.332,337.614C318.033,338.591 317.774,339.545 317.552,340.477L316.58,340.246C316.806,339.294 317.071,338.319 317.376,337.321Z" style="fill:#ffffff00;"/>
    <path d="M315.637,346.247L316.635,346.317C316.563,347.33 316.544,348.312 316.575,349.264L315.575,349.297C315.544,348.312 315.563,347.296 315.637,346.247Z" style="fill:#ffffff00;"/>
    <path d="M316.494,355.335L317.456,355.06C317.729,356.016 318.061,356.934 318.45,357.815L317.535,358.219C317.128,357.296 316.78,356.335 316.494,355.335Z" style="fill:#ffffff00;"/>
    <path d="M320.74,363.427L321.515,362.796C322.13,363.551 322.795,364.271 323.506,364.958L322.811,365.677C322.071,364.962 321.38,364.213 320.74,363.427Z" style="fill:#ffffff00;"/>
    <path d="M327.596,369.44L328.139,368.601C328.956,369.129 329.806,369.632 330.686,370.109L330.209,370.988C329.306,370.498 328.434,369.983 327.596,369.44Z" style="fill:#ffffff00;"/>
    <path d="M335.708,373.53L336.074,372.599C336.986,372.958 337.919,373.298 338.869,373.62L338.548,374.567C337.582,374.24 336.635,373.895 335.708,373.53Z" style="fill:#ffffff00;"/>
    <path d="M344.342,376.266L344.587,375.296C345.545,375.538 346.514,375.765 347.492,375.978L347.279,376.955C346.29,376.74 345.31,376.51 344.342,376.266Z" style="fill:#ffffff00;"/>
    <path d="M353.201,378.072L353.36,377.085C354.341,377.243 355.327,377.39 356.316,377.526L356.179,378.517C355.183,378.38 354.19,378.232 353.201,378.072Z" style="fill:#ffffff00;"/>
    <path d="M362.158,379.215L362.255,378.22L362.272,378.221C363.256,378.317 364.244,378.407 365.237,378.492L365.151,379.488C364.155,379.403 363.163,379.313 362.176,379.217L362.158,379.215Z" style="fill:#ffffff00;"/>
    <path d="M371.141,379.952L371.212,378.955C372.206,379.025 373.203,379.093 374.203,379.16L374.136,380.158C373.135,380.091 372.137,380.023 371.141,379.952Z" style="fill:#ffffff00;"/>
    <path d="M380.124,380.551L380.189,379.553C381.187,379.618 382.185,379.685 383.184,379.753L383.116,380.751C382.118,380.682 381.12,380.616 380.124,380.551Z" style="fill:#ffffff00;"/>
    <path d="M389.093,381.191L389.173,380.194C390.172,380.274 391.171,380.358 392.167,380.448L392.078,381.444C391.084,381.355 390.089,381.271 389.093,381.191Z" style="fill:#ffffff00;"/>
    <path d="M398.035,382.048L398.149,381.054C399.147,381.169 400.142,381.291 401.135,381.421L401.005,382.412C400.018,382.283 399.028,382.162 398.035,382.048Z" style="fill:#ffffff00;"/>
    <path d="M406.918,383.303L407.087,382.317C408.079,382.488 409.067,382.669 410.049,382.863L409.856,383.844C408.882,383.652 407.902,383.472 406.918,383.303Z" style="fill:#ffffff00;"/>
    <path d="M415.681,385.157L415.929,384.188C416.906,384.438 417.876,384.704 418.839,384.985L418.558,385.945C417.606,385.667 416.647,385.404 415.681,385.157Z" style="fill:#ffffff00;"/>
    <path d="M424.215,387.825L424.567,386.889C425.511,387.244 426.446,387.618 427.371,388.012L426.98,388.932C426.067,388.543 425.146,388.175 424.215,387.825Z" style="fill:#ffffff00;"/>
    <path d="M432.34,391.515L432.817,390.636C433.703,391.116 434.577,391.619 435.439,392.146L434.917,392.999C434.07,392.481 433.211,391.987 432.34,391.515Z" style="fill:#ffffff00;"/>
    <path d="M439.813,396.367L440.424,395.576C441.219,396.189 442,396.827 442.768,397.492L442.114,398.248C441.36,397.596 440.593,396.969 439.813,396.367Z" style="fill:#ffffff00;"/>
    <path d="M446.38,402.382L447.115,401.704C447.792,402.438 448.456,403.198 449.105,403.985L448.334,404.622C447.696,403.849 447.045,403.103 446.38,402.382Z" style="fill:#ffffff00;"/>
    <path d="M451.872,409.4L452.705,408.847C453.255,409.675 453.791,410.529 454.314,411.407L453.455,411.919C452.94,411.054 452.412,410.215 451.872,409.4Z" style="fill:#ffffff00;"/>
    <path d="M456.25,417.171L457.154,416.744C457.579,417.642 457.989,418.563 458.385,419.503L457.464,419.891C457.073,418.964 456.668,418.057 456.25,417.171Z" style="fill:#ffffff00;"/>
    <path d="M459.559,425.471L460.508,425.155C460.823,426.101 461.125,427.061 461.411,428.034L460.452,428.316C460.169,427.355 459.871,426.406 459.559,425.471Z" style="fill:#ffffff00;"/>
    <path d="M461.943,434.092L462.919,433.875C463.137,434.852 463.34,435.837 463.527,436.829L462.544,437.015C462.359,436.034 462.158,435.059 461.943,434.092Z" style="fill:#ffffff00;"/>
    <path d="M463.46,442.91L464.452,442.789C464.574,443.787 464.679,444.787 464.768,445.789L463.772,445.877C463.684,444.886 463.58,443.897 463.46,442.91Z" style="fill:#ffffff00;"/>
    <path d="M464.092,451.833L465.091,451.814C465.11,452.822 465.111,453.829 465.092,454.832L464.092,454.814C464.111,453.823 464.11,452.829 464.092,451.833Z" style="fill:#ffffff00;"/>
    <path d="M463.751,460.763L464.746,460.861C464.647,461.868 464.527,462.869 464.386,463.861L463.396,463.72C463.535,462.742 463.653,461.756 463.751,460.763Z" style="fill:#ffffff00;"/>
    <path d="M462.277,469.562L463.248,469.799C463.007,470.786 462.742,471.76 462.452,472.72L461.495,472.43C461.78,471.488 462.04,470.531 462.277,469.562Z" style="fill:#ffffff00;"/>
    <path d="M459.433,477.994L460.346,478.401C459.932,479.331 459.488,480.241 459.015,481.128L458.132,480.657C458.595,479.791 459.028,478.902 459.433,477.994Z" style="fill:#ffffff00;"/>
    <path d="M454.948,485.646L455.75,486.244C455.146,487.052 454.529,487.847 453.9,488.629L453.121,488.001C453.743,487.229 454.352,486.444 454.948,485.646Z" style="fill:#ffffff00;"/>
    <path d="M449.216,492.508L449.948,493.189C449.263,493.926 448.566,494.651 447.858,495.364L447.148,494.659C447.849,493.954 448.538,493.237 449.216,492.508Z" style="fill:#ffffff00;"/>
    <path d="M442.81,498.757L443.475,499.505C442.724,500.172 441.963,500.828 441.193,501.475L440.55,500.709C441.313,500.068 442.067,499.418 442.81,498.757Z" style="fill:#ffffff00;"/>
    <path d="M435.874,504.425L436.476,505.224C435.676,505.828 434.867,506.422 434.051,507.009L433.468,506.197C434.278,505.615 435.08,505.025 435.874,504.425Z" style="fill:#ffffff00;"/>
    <path d="M428.539,509.582L429.088,510.417C428.252,510.968 427.408,511.511 426.559,512.047L426.025,511.202C426.869,510.669 427.707,510.129 428.539,509.582Z" style="fill:#ffffff00;"/>
    <path d="M420.915,514.317L421.423,515.178C420.56,515.686 419.693,516.189 418.822,516.687L418.326,515.818C419.193,515.323 420.057,514.822 420.915,514.317Z" style="fill:#ffffff00;"/>
    <path d="M413.092,518.73L413.569,519.609C412.69,520.086 411.807,520.56 410.922,521.03L410.453,520.147C411.335,519.678 412.215,519.206 413.092,518.73Z" style="fill:#ffffff00;"/>
    <path d="M405.141,522.923L405.599,523.812C404.709,524.27 403.818,524.726 402.927,525.18L402.473,524.289C403.363,523.835 404.253,523.38 405.141,522.923Z" style="fill:#ffffff00;"/>
    <path d="M397.121,526.997L397.571,527.89C396.677,528.34 395.784,528.79 394.891,529.239L394.442,528.346C395.334,527.896 396.227,527.447 397.121,526.997Z" style="fill:#ffffff00;"/>
    <path d="M389.085,531.054L389.539,531.945C388.647,532.399 387.757,532.853 386.869,533.31L386.412,532.42C387.301,531.963 388.192,531.508 389.085,531.054Z" style="fill:#ffffff00;"/>
    <path d="M381.087,535.199L381.556,536.082C380.674,536.55 379.794,537.022 378.915,537.497L378.439,536.618C379.32,536.141 380.203,535.668 381.087,535.199Z" style="fill:#ffffff00;"/>
    <path d="M373.179,539.52L373.669,540.392C372.799,540.881 371.93,541.374 371.064,541.871L370.566,541.004C371.435,540.506 372.306,540.011 373.179,539.52Z" style="fill:#ffffff00;"/>
    <path d="M365.382,544.041L365.895,544.899C365.038,545.412 364.183,545.928 363.331,546.449L362.81,545.595C363.665,545.073 364.522,544.555 365.382,544.041Z" style="fill:#ffffff00;"/>
    <path d="M357.712,548.778L358.25,549.621C357.408,550.158 356.57,550.699 355.734,551.245L355.187,550.407C356.026,549.86 356.868,549.317 357.712,548.778Z" style="fill:#ffffff00;"/>
    <path d="M350.189,553.745L350.753,554.571C349.929,555.134 349.108,555.702 348.29,556.274L347.717,555.455C348.537,554.88 349.361,554.311 350.189,553.745Z" style="fill:#ffffff00;"/>
    <path d="M342.831,558.958L343.424,559.763C342.619,560.355 341.818,560.95 341.022,561.551L340.42,560.752C341.22,560.149 342.024,559.551 342.831,558.958Z" style="fill:#ffffff00;"/>
    <path d="M335.663,564.429L336.285,565.213C335.503,565.833 334.725,566.458 333.951,567.088L333.32,566.313C334.097,565.68 334.878,565.052 335.663,564.429Z" style="fill:#ffffff00;"/>
    <path d="M328.709,570.172L329.361,570.93C328.604,571.581 327.852,572.237 327.105,572.898L326.443,572.149C327.193,571.485 327.949,570.826 328.709,570.172Z" style="fill:#ffffff00;"/>
    <path d="M321.996,576.198L322.679,576.927C321.952,577.61 321.229,578.297 320.511,578.99L319.817,578.271C320.538,577.574 321.264,576.883 321.996,576.198Z" style="fill:#ffffff00;"/>
    <path d="M315.553,582.514L316.27,583.212C315.574,583.926 314.883,584.646 314.198,585.371L313.471,584.685C314.16,583.955 314.854,583.232 315.553,582.514Z" style="fill:#ffffff00;"/>
    <path d="M309.413,589.125L310.162,589.788C309.501,590.534 308.847,591.287 308.198,592.045L307.438,591.395C308.09,590.633 308.748,589.876 309.413,589.125Z" style="fill:#ffffff00;"/>
    <path d="M303.61,596.039L304.394,596.659C303.772,597.447 303.163,598.236 302.568,599.025L301.77,598.423C302.369,597.628 302.982,596.833 303.61,596.039Z" style="fill:#ffffff00;"/>
    <path d="M298.256,603.315L299.082,603.879C298.516,604.707 297.964,605.536 297.425,606.365L296.586,605.821C297.129,604.984 297.686,604.149 298.256,603.315Z" style="fill:#ffffff00;"/>
    <path d="M293.426,610.949L294.29,611.453C293.785,612.318 293.293,613.184 292.814,614.051L291.939,613.568C292.422,612.693 292.918,611.82 293.426,610.949Z" style="fill:#ffffff00;"/>
    <path d="M289.15,618.906L290.047,619.348C289.605,620.245 289.174,621.143 288.755,622.043L287.849,621.621C288.271,620.714 288.705,619.809 289.15,618.906Z" style="fill:#ffffff00;"/>
    <path d="M285.426,627.133L286.35,627.516C285.968,628.438 285.596,629.362 285.233,630.29L284.302,629.925C284.667,628.992 285.041,628.061 285.426,627.133Z" style="fill:#ffffff00;"/>
    <path d="M282.217,635.571L283.161,635.9C282.833,636.842 282.513,637.786 282.2,638.733L281.25,638.42C281.565,637.467 281.887,636.518 282.217,635.571Z" style="fill:#ffffff00;"/>
    <path d="M279.454,644.16L280.413,644.445C280.129,645.4 279.852,646.358 279.58,647.32L278.618,647.048C278.891,646.082 279.169,645.119 279.454,644.16Z" style="fill:#ffffff00;"/>
    <path d="M277.048,652.85L278.016,653.101C277.767,654.065 277.521,655.033 277.279,656.004L276.308,655.763C276.551,654.788 276.798,653.817 277.048,652.85Z" style="fill:#ffffff00;"/>
    <path d="M274.899,661.602L275.873,661.83C275.646,662.799 275.421,663.773 275.198,664.75L274.223,664.527C274.447,663.548 274.672,662.573 274.899,661.602Z" style="fill:#ffffff00;"/>
    <path d="M272.908,670.385L273.884,670.601C273.669,671.573 273.455,672.549 273.24,673.53L272.263,673.316C272.478,672.335 272.693,671.358 272.908,670.385Z" style="fill:#ffffff00;"/>
    <path d="M270.982,679.178L271.959,679.391C271.746,680.364 271.532,681.341 271.316,682.323L270.34,682.108C270.555,681.127 270.769,680.15 270.982,679.178Z" style="fill:#ffffff00;"/>
    <path d="M269.054,687.97L270.031,688.182C269.82,689.154 269.609,690.131 269.397,691.114L268.42,690.903C268.631,689.92 268.843,688.942 269.054,687.97Z" style="fill:#ffffff00;"/>
    <path d="M267.152,696.766L268.129,696.979C267.917,697.953 267.702,698.931 267.486,699.911L266.509,699.695C266.726,698.716 266.94,697.74 267.152,696.766Z" style="fill:#ffffff00;"/>
    <path d="M265.188,705.542L266.162,705.768C265.937,706.742 265.708,707.717 265.474,708.692L264.502,708.459C264.735,707.486 264.963,706.514 265.188,705.542Z" style="fill:#ffffff00;"/>
    <path d="M263.058,714.274L264.026,714.524C263.776,715.493 263.52,716.462 263.259,717.43L262.293,717.169C262.554,716.205 262.809,715.239 263.058,714.274Z" style="fill:#ffffff00;"/>
    <path d="M260.66,722.928L261.618,723.214C261.332,724.175 261.038,725.134 260.737,726.09L259.783,725.79C260.083,724.839 260.375,723.885 260.66,722.928Z" style="fill:#ffffff00;"/>
    <path d="M257.891,731.465L258.834,731.798C258.499,732.745 258.155,733.688 257.803,734.626L256.867,734.274C257.217,733.342 257.558,732.406 257.891,731.465Z" style="fill:#ffffff00;"/>
    <path d="M254.643,739.822L255.563,740.215C255.167,741.14 254.761,742.059 254.344,742.97L253.435,742.554C253.848,741.65 254.251,740.739 254.643,739.822Z" style="fill:#ffffff00;"/>
    <path d="M250.806,747.916L251.691,748.381C251.222,749.272 250.741,750.155 250.247,751.028L249.377,750.536C249.866,749.671 250.342,748.798 250.806,747.916Z" style="fill:#ffffff00;"/>
    <path d="M246.271,755.63L247.107,756.179C246.554,757.02 245.986,757.851 245.404,758.671L244.589,758.091C245.164,757.282 245.725,756.461 246.271,755.63Z" style="fill:#ffffff00;"/>
    <path d="M240.953,762.813L241.72,763.454C241.076,764.226 240.415,764.986 239.737,765.733L238.997,765.06C239.665,764.324 240.317,763.575 240.953,762.813Z" style="fill:#ffffff00;"/>
    <path d="M234.81,769.297L235.491,770.029C234.754,770.715 234.003,771.385 233.239,772.041L232.588,771.282C233.341,770.635 234.083,769.974 234.81,769.297Z" style="fill:#ffffff00;"/>
    <path d="M227.925,774.999L228.521,775.802C227.715,776.401 226.898,776.987 226.072,777.561L225.501,776.74C226.319,776.172 227.127,775.592 227.925,774.999Z" style="fill:#ffffff00;"/>
    <path d="M220.505,780.012L221.031,780.863C220.178,781.391 219.318,781.908 218.452,782.417L217.945,781.555C218.804,781.05 219.658,780.536 220.505,780.012Z" style="fill:#ffffff00;"/>
    <path d="M212.731,784.486L213.206,785.366C212.323,785.842 211.437,786.311 210.548,786.774L210.087,785.887C210.971,785.426 211.853,784.96 212.731,784.486Z" style="fill:#ffffff00;"/>
    <path d="M204.743,788.591L205.185,789.488C204.287,789.931 203.387,790.371 202.486,790.806L202.051,789.906C202.95,789.471 203.847,789.033 204.743,788.591Z" style="fill:#ffffff00;"/>
    <path d="M196.635,792.469L197.056,793.377C196.147,793.798 195.237,794.215 194.325,794.629L193.912,793.718C194.821,793.306 195.729,792.89 196.635,792.469Z" style="fill:#ffffff00;"/>
    <path d="M188.435,796.15L188.834,797.067C187.915,797.466 186.995,797.861 186.074,798.253L185.683,797.332C186.602,796.942 187.519,796.548 188.435,796.15Z" style="fill:#ffffff00;"/>
    <path d="M180.149,799.63L180.525,800.557C179.597,800.933 178.668,801.306 177.737,801.675L177.368,800.745C178.297,800.377 179.223,800.005 180.149,799.63Z" style="fill:#ffffff00;"/>
    <path d="M171.78,802.908L172.134,803.843C171.197,804.197 170.259,804.547 169.319,804.894L168.973,803.955C169.91,803.61 170.846,803.261 171.78,802.908Z" style="fill:#ffffff00;"/>
    <path d="M163.335,805.982L163.665,806.926C162.72,807.257 161.774,807.584 160.826,807.907L160.503,806.961C161.448,806.639 162.392,806.312 163.335,805.982Z" style="fill:#ffffff00;"/>
    <path d="M154.817,808.85L155.124,809.802C154.172,810.11 153.218,810.414 152.262,810.714L151.962,809.76C152.915,809.461 153.867,809.157 154.817,808.85Z" style="fill:#ffffff00;"/>
    <path d="M146.232,811.511L146.516,812.469C145.556,812.754 144.595,813.035 143.633,813.312L143.356,812.351C144.316,812.075 145.275,811.795 146.232,811.511Z" style="fill:#ffffff00;"/>
    <path d="M137.585,813.962L137.846,814.927C136.88,815.189 135.912,815.446 134.943,815.7L134.69,814.732C135.656,814.48 136.621,814.223 137.585,813.962Z" style="fill:#ffffff00;"/>
    <path d="M128.881,816.203L129.119,817.174C128.146,817.412 127.172,817.646 126.198,817.876L125.968,816.903C126.94,816.673 127.911,816.44 128.881,816.203Z" style="fill:#ffffff00;"/>
    <path d="M120.126,818.232L120.339,819.209C119.361,819.423 118.382,819.633 117.402,819.84L117.196,818.861C118.174,818.655 119.15,818.446 120.126,818.232Z" style="fill:#ffffff00;"/>
    <path d="M111.323,820.048L111.513,821.03C110.53,821.22 109.547,821.406 108.562,821.589L108.38,820.606C109.362,820.424 110.343,820.238 111.323,820.048Z" style="fill:#ffffff00;"/>
    <path d="M102.479,821.65L102.646,822.636C101.658,822.802 100.67,822.965 99.682,823.123L99.523,822.136C100.509,821.978 101.495,821.816 102.479,821.65Z" style="fill:#ffffff00;"/>
    <path d="M93.599,823.036L93.742,824.026C92.751,824.168 91.759,824.307 90.767,824.441L90.632,823.45C91.622,823.316 92.611,823.178 93.599,823.036Z" style="fill:#ffffff00;"/>
    <path d="M84.688,824.207L84.807,825.2C83.812,825.318 82.818,825.433 81.822,825.543L81.712,824.549C82.705,824.439 83.697,824.325 84.688,824.207Z" style="fill:#ffffff00;"/>
    <path d="M75.751,825.161L75.846,826.157C74.849,826.251 73.852,826.341 72.854,826.427L72.768,825.431C73.763,825.345 74.757,825.255 75.751,825.161Z" style="fill:#ffffff00;"/>
    <path d="M66.794,825.898L66.864,826.895C65.865,826.965 64.866,827.031 63.866,827.093L63.805,826.095C64.802,826.033 65.798,825.968 66.794,825.898Z" style="fill:#ffffff00;"/>
    <path d="M57.824,826.417L57.865,827.416C56.883,827.455 55.859,827.454 54.821,827.403L54.87,826.404C55.877,826.453 56.872,826.455 57.824,826.417Z" style="fill:#ffffff00;"/>
    <path d="M49.059,825.52L48.792,826.484C47.772,826.201 46.796,825.85 45.898,825.422L46.327,824.519C47.175,824.923 48.096,825.254 49.059,825.52Z" style="fill:#ffffff00;"/>
    <path d="M42.187,820.801L41.293,821.249C40.866,820.397 40.594,819.444 40.512,818.379L41.51,818.303C41.58,819.229 41.815,820.06 42.187,820.801Z" style="fill:#ffffff00;"/>
</svg>

The next step was to use jQuery to target all of those paths and change their fill. I also created a variable to track which path is being manipulated which would also be used to clear the interval later. The interval is set using some quick math to make the animation last my preferred amount of time. Not shown in the example below, but I also wrapped this in another function to prevent the animation from starting until the element is in the viewport.

var paths = $(".animated-dash path");
var totalPaths = paths.length;
var currentPath = 0;
var animationTime = 3000;
var intervalTime = Math.floor(animationTime / totalPaths);
var drawInterval = setInterval(function() {
    paths.eq(currentPath).css("fill", "#fff");
    currentPath++;
    if (currentPath == totalPaths) {
        clearInterval(drawInterval);
    }
}, intervalTime);