У меня есть проблема с анимацией. При отведении курсора, анимация прекращается и обрывается. Нужно чтобы анимация доигрывала после отведения курсор
Вот мой код
.billbord-3dIcon {
position: absolute;
top: 70px;
right: 200px;
z-index: 5;
}
.billbord-3dIcon:hover svg path {
transform-origin: center;
animation: 3s rotateIcon linear;
}
@keyframes rotateIcon {
0% {
transform: rotate(0)
}
50% {
transform: rotate(180deg)
}
100% {
transform: rotate(0)
}
}
<div class='billbord-3dIcon'>
<svg width="200" height="200" viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M74.3847 120.418C71.3274 120.418 68.3924 120.01 65.5796 119.195C62.7669 118.339 60.5249 117.218 58.8535 115.832L62.2777 107.455C65.8242 109.941 69.7172 111.185 73.9567 111.185C78.3592 111.185 80.5605 109.676 80.5605 106.66C80.5605 103.888 78.6038 102.502 74.6905 102.502H67.1694V93.5745H73.5898C75.3427 93.5745 76.7083 93.2077 77.6866 92.4739C78.7057 91.7402 79.2153 90.6803 79.2153 89.2943C79.2153 86.5631 77.3198 85.1975 73.5287 85.1975C69.6561 85.1975 66.1503 86.4408 63.0115 88.9274L59.5261 80.7338C61.3605 79.2255 63.6026 78.0637 66.2522 77.2484C68.9427 76.3924 71.735 75.9644 74.6293 75.9644C79.4395 75.9644 83.1898 77.0242 85.8803 79.144C88.5707 81.223 89.9159 84.1172 89.9159 87.8268C89.9159 90.028 89.3656 91.9644 88.265 93.6357C87.1643 95.307 85.6357 96.53 83.679 97.3045C86.0841 97.9975 87.9389 99.2612 89.2433 101.096C90.5885 102.93 91.2612 105.152 91.2612 107.761C91.2612 111.674 89.7529 114.772 86.7363 117.055C83.7605 119.297 79.6433 120.418 74.3847 120.418Z" fill="white"/>
<path d="M97.9022 119.745V76.637H115.757C123.217 76.637 129.005 78.5121 133.123 82.2624C137.24 86.0128 139.298 91.3121 139.298 98.1605C139.298 105.009 137.24 110.329 133.123 114.12C129.005 117.87 123.217 119.745 115.757 119.745H97.9022ZM109.153 110.634H115.023C119.304 110.634 122.463 109.615 124.501 107.577C126.58 105.498 127.619 102.359 127.619 98.1605C127.619 93.9618 126.58 90.8433 124.501 88.8051C122.422 86.7669 119.263 85.7478 115.023 85.7478H109.153V110.634Z" fill="white"/>
<path d="M200 100C200 155.228 155.228 200 100 200C44.7715 200 0 155.228 0 100C0 44.7715 44.7715 0 100 0C155.228 0 200 44.7715 200 100ZM38.9917 100C38.9917 133.694 66.3061 161.008 100 161.008C133.694 161.008 161.008 133.694 161.008 100C161.008 66.3061 133.694 38.9917 100 38.9917C66.3061 38.9917 38.9917 66.3061 38.9917 100Z" fill="white"/>
<path d="M97.1107 171.483L95.8302 184.894L89.9715 184.334C88.5639 184.2 87.5029 183.785 86.7887 183.09C86.0733 182.407 85.7677 181.521 85.8718 180.43C85.9408 179.707 86.184 179.103 86.6014 178.619C87.0188 178.134 87.5624 177.802 88.2322 177.623C87.4919 177.334 86.9385 176.898 86.5721 176.312C86.1918 175.739 86.041 175.04 86.1197 174.215C86.2335 173.023 86.7277 172.136 87.6023 171.554C88.463 170.984 89.6098 170.767 91.0428 170.904L97.1107 171.483ZM94.0336 178.983L90.933 178.687C89.2718 178.528 88.38 179.089 88.2577 180.37C88.1354 181.651 88.9049 182.37 90.5661 182.529L93.6667 182.825L94.0336 178.983ZM94.5948 173.105L91.1709 172.778C89.497 172.618 88.5959 173.21 88.4675 174.555C88.3392 175.899 89.1119 176.651 90.7859 176.811L94.2098 177.138L94.5948 173.105Z" fill="black"/>
<path d="M84.3584 170.032L80.563 182.958L78.3813 182.317L81.0514 173.223L71.4326 180.277L69.6725 179.76L73.4678 166.834L75.6496 167.475L72.9686 176.605L82.6166 169.521L84.3584 170.032Z" fill="black"/>
<path d="M66.4577 163.267C67.4541 163.781 68.2731 164.361 68.9146 165.007C69.5503 165.664 70.0345 166.365 70.3671 167.11L68.8384 168.407C68.5504 167.743 68.1504 167.142 67.6386 166.606C67.1209 166.081 66.4658 165.614 65.6732 165.206C64.7334 164.721 63.9639 164.518 63.3647 164.596C62.7542 164.668 62.2884 165.016 61.9674 165.639C61.3895 166.76 61.8478 167.705 63.3424 168.476L66.2467 169.973L65.3624 171.688L62.7468 170.34C61.2635 169.575 60.2388 169.742 59.6726 170.841C59.3982 171.373 59.3804 171.894 59.6191 172.404C59.8406 172.919 60.3703 173.393 61.2082 173.825C61.8649 174.164 62.5572 174.391 63.285 174.509C64.0015 174.62 64.7053 174.603 65.3965 174.458L65.2353 176.439C64.4697 176.617 63.6349 176.624 62.731 176.459C61.81 176.299 60.9079 175.992 60.0248 175.537C58.5755 174.79 57.6461 173.923 57.2366 172.938C56.8214 171.965 56.8647 170.991 57.3667 170.017C57.6995 169.372 58.1553 168.905 58.7343 168.615C59.302 168.321 59.9244 168.211 60.6014 168.288C60.0326 167.751 59.6869 167.143 59.5642 166.464C59.4244 165.79 59.5442 165.085 59.9237 164.349C60.4724 163.284 61.2981 162.628 62.4007 162.379C63.4976 162.142 64.8499 162.438 66.4577 163.267Z" fill="black"/>
<path d="M56.8263 157.653L52.6731 159.565L51.4278 170.546L49.37 168.928L50.3781 160.629L43.0916 163.99L41.1089 162.431L54.8286 156.082L56.8263 157.653Z" fill="black"/>
<path d="M49.282 151.765L35.1093 155.98L33.7954 154.464L39.9846 141.035L41.6113 142.913L40.1334 145.963L44.4379 150.931L47.6552 149.888L49.282 151.765ZM36.4784 153.504L42.4144 151.572L39.211 147.875L36.4534 153.476L36.4784 153.504Z" fill="black"/>
<path d="M39.6106 139.661L38.6404 141.612C38.1319 141.317 37.6166 141.099 37.0946 140.96C36.5551 140.815 35.9679 140.779 35.3331 140.851C34.6808 140.919 33.9422 141.117 33.1173 141.447C32.286 141.765 31.3298 142.236 30.2486 142.86L26.7073 144.905L21.9494 136.664L33.6159 129.928L34.8388 132.046L24.943 137.759L27.3506 141.93L29.6674 140.592C31.1567 139.732 32.5027 139.146 33.7053 138.834C34.8905 138.518 35.9647 138.442 36.9277 138.607C37.8907 138.772 38.785 139.123 39.6106 139.661Z" fill="black"/>
<path d="M32.8113 128.069L20.0809 132.475L19.3371 130.326L28.2936 127.226L16.9685 123.482L16.3685 121.749L29.099 117.343L29.8427 119.492L20.8501 122.604L32.2176 126.354L32.8113 128.069Z" fill="black"/>
<path d="M27.9385 109.564C28.0981 110.673 28.1008 111.677 27.9466 112.574C27.7799 113.473 27.4897 114.274 27.076 114.977L25.1325 114.485C25.5067 113.865 25.7637 113.19 25.9036 112.463C26.0308 111.736 26.031 110.932 25.9041 110.049C25.7536 109.003 25.4728 108.258 25.0617 107.815C24.6487 107.36 24.0955 107.182 23.402 107.282C22.1537 107.461 21.6492 108.383 21.8885 110.048L22.3535 113.282L20.4432 113.557L20.0244 110.644C19.7869 108.992 19.0566 108.254 17.8335 108.43C17.2409 108.515 16.8061 108.803 16.5291 109.293C16.2377 109.773 16.159 110.479 16.2932 111.412C16.3983 112.143 16.6143 112.839 16.9409 113.5C17.2658 114.148 17.6879 114.712 18.2071 115.191L16.5002 116.208C15.9106 115.688 15.4209 115.012 15.031 114.18C14.6267 113.337 14.3538 112.424 14.2124 111.441C13.9804 109.827 14.1468 108.567 14.7116 107.663C15.2639 106.759 16.0822 106.23 17.1666 106.074C17.8853 105.971 18.5304 106.071 19.1018 106.375C19.6713 106.666 20.1212 107.11 20.4514 107.706C20.5588 106.931 20.8537 106.297 21.3361 105.803C21.804 105.298 22.4478 104.987 23.2674 104.869C24.4526 104.698 25.4663 104.99 26.3083 105.744C27.1377 106.5 27.6811 107.773 27.9385 109.564Z" fill="black"/>
<path d="M26.7227 102.699L13.5566 95.9691L13.6521 93.965L27.3982 88.5174L27.28 90.9987L24.1053 92.1865L23.7925 98.7523L26.8409 100.217L26.7227 102.699ZM16.2561 95.1221L21.8857 97.8198L22.1184 92.9336L16.2579 95.0839L16.2561 95.1221Z" fill="black"/>
<path d="M33.2978 77.7351L30.2338 76.9918L27.5353 88.115L14.4437 84.939L15.0203 82.5621L26.125 85.2561L27.7333 78.6267L16.6286 75.9327L17.2052 73.5558L28.3099 76.2498L28.7604 74.3928L33.8113 75.6182L33.2978 77.7351Z" fill="black"/>
<path d="M31.1544 74.1827L18.9005 68.5865L19.8451 66.5181L28.4663 70.4553L22.8535 59.9305L23.6156 58.2619L35.8695 63.8581L34.9249 65.9265L26.2689 61.9734L31.9085 72.5314L31.1544 74.1827Z" fill="black"/>
<path d="M37.12 61.7011L35.0502 57.4593C34.6744 56.6912 34.5757 55.9954 34.754 55.3717C33.9938 56.0658 33.1851 56.4439 32.3277 56.5058C31.4704 56.5678 30.6267 56.3032 29.7965 55.7121C28.7589 54.9731 28.1874 54.0736 28.0822 53.0134C27.9667 51.9459 28.3374 50.8103 29.1946 49.6066L32.5974 44.8281L43.5708 52.6422L42.152 54.6346L37.7627 51.5089L36.8095 52.8475C36.5361 53.2314 36.3692 53.5975 36.309 53.9456C36.2562 54.2833 36.3345 54.6674 36.5439 55.0981L38.6828 59.5065L37.12 61.7011ZM34.5438 52.8997L36.284 50.4559L32.7507 47.9399L31.0105 50.3836C29.976 51.8364 30.0451 52.9802 31.2176 53.8152C32.4006 54.6576 33.5093 54.3524 34.5438 52.8997Z" fill="black"/>
<path d="M61.6745 37.5046C60.4957 38.2621 59.3315 38.6772 58.1818 38.7498C57.036 38.8047 55.9591 38.5428 54.9512 37.964C53.9363 37.3745 53.0467 36.485 52.2822 35.2954C51.5177 34.1059 51.0816 32.9325 50.9738 31.7752C50.8661 30.6179 51.0786 29.5348 51.6115 28.5261C52.1482 27.4998 53.0059 26.6078 54.1848 25.8502C54.9456 25.3613 55.7394 25.0177 56.5661 24.8196C57.4035 24.6146 58.183 24.5906 58.9048 24.7476L59.2834 26.8211C58.5394 26.7238 57.857 26.7459 57.2363 26.8874C56.6086 27.0182 56.0055 27.2696 55.4268 27.6415C54.2801 28.3784 53.6305 29.288 53.4781 30.3702C53.3187 31.4418 53.6488 32.6152 54.4684 33.8905C55.2879 35.1657 56.2216 35.9588 57.2694 36.2697C58.3172 36.5806 59.4145 36.3676 60.5611 35.6307C61.1398 35.2588 61.6225 34.8199 62.0091 34.314C62.3888 33.7974 62.6889 33.1805 62.9094 32.4634L64.6383 33.6691C64.4744 34.3802 64.1288 35.0793 63.6013 35.7666C63.0777 36.4362 62.4354 37.0156 61.6745 37.5046Z" fill="black"/>
<path d="M67.99 33.7001L62.9832 21.1938L68.4115 19.0206C69.7834 18.4714 70.9791 18.3906 71.9988 18.7783C73.0184 19.1659 73.7745 19.9747 74.2669 21.2046C74.7593 22.4346 74.7726 23.5476 74.3069 24.5436C73.8364 25.5278 72.9153 26.2945 71.5434 26.8437L68.3858 28.1078L70.2607 32.7911L67.99 33.7001ZM67.6685 26.3162L70.4713 25.1941C72.1034 24.5407 72.6353 23.5044 72.0672 22.0853C71.5038 20.6779 70.406 20.301 68.774 20.9543L65.9712 22.0764L67.6685 26.3162Z" fill="black"/>
<path d="M78.6371 29.3999L82.073 15.0184L84.0431 14.6387L92.5779 26.713L90.1388 27.1832L88.2359 24.3779L81.7814 25.6219L81.0762 28.9298L78.6371 29.3999ZM83.5326 17.4421L82.2382 23.549L87.0415 22.6232L83.5701 17.4348L83.5326 17.4421Z" fill="black"/>
<path d="M98.834 26.9426C97.7129 26.9426 96.7193 26.8025 95.8531 26.5222C94.9868 26.2292 94.2352 25.828 93.5983 25.3184L94.3626 23.4649C94.9231 23.9235 95.5537 24.2738 96.2543 24.5159C96.955 24.7452 97.7512 24.8598 98.6429 24.8598C99.7002 24.8598 100.477 24.6878 100.974 24.3439C101.484 23.9999 101.738 23.4776 101.738 22.777C101.738 21.5159 100.898 20.8853 99.2161 20.8853H95.9486V18.9554H98.8913C100.56 18.9554 101.394 18.3375 101.394 17.1019C101.394 16.5031 101.172 16.0318 100.726 15.6878C100.293 15.3311 99.6047 15.1528 98.662 15.1528C97.9231 15.1528 97.2034 15.2675 96.5027 15.4968C95.8148 15.7261 95.197 16.0636 94.6492 16.5095L93.8849 14.6751C94.4836 14.1655 95.2225 13.777 96.1015 13.5095C96.9932 13.2292 97.9359 13.0891 98.9295 13.0891C100.56 13.0891 101.783 13.4331 102.598 14.121C103.414 14.7961 103.821 15.6815 103.821 16.777C103.821 17.5031 103.63 18.1273 103.248 18.6496C102.879 19.1719 102.375 19.5541 101.738 19.7961C102.49 20.0127 103.076 20.3948 103.496 20.9426C103.929 21.4776 104.146 22.1592 104.146 22.9872C104.146 24.1847 103.713 25.1464 102.847 25.8726C101.98 26.5859 100.643 26.9426 98.834 26.9426Z" fill="black"/>
<path d="M110.17 27.519L112.985 23.9167L109.061 13.5859L111.631 14.0814L114.538 21.9196L119.474 15.593L121.951 16.0703L112.665 28L110.17 27.519Z" fill="black"/>
<path d="M133.774 35.2732L141.058 23.9404L150.911 30.2731L143.628 41.6059L141.571 40.2836L147.748 30.6708L142.01 26.9827L135.832 36.5955L133.774 35.2732Z" fill="black"/>
<path d="M149.332 47.1363C148.391 46.2396 147.764 45.2454 147.45 44.1536C147.145 43.0707 147.155 41.9712 147.479 40.8552C147.813 39.7299 148.463 38.6603 149.43 37.6461C150.406 36.6227 151.444 35.9223 152.543 35.5447C153.642 35.1671 154.736 35.1096 155.823 35.372C156.919 35.6252 157.942 36.2046 158.892 37.11C159.841 38.0155 160.469 39.0097 160.774 40.0927C161.088 41.1664 161.082 42.2613 160.758 43.3773C160.433 44.4933 159.787 45.5584 158.82 46.5725C157.844 47.5959 156.802 48.301 155.694 48.6878C154.595 49.0654 153.497 49.1275 152.401 48.8743C151.304 48.6211 150.281 48.0417 149.332 47.1363ZM150.782 45.6151C151.677 46.4678 152.667 46.8226 153.754 46.6796C154.841 46.5366 155.907 45.9165 156.953 44.8194C158.008 43.7131 158.577 42.6183 158.659 41.5351C158.751 40.4607 158.345 39.4928 157.441 38.6313C156.547 37.7786 155.561 37.4191 154.483 37.5529C153.405 37.6867 152.338 38.3067 151.283 39.4131C150.237 40.5102 149.669 41.605 149.578 42.6974C149.486 43.7898 149.888 44.7624 150.782 45.6151Z" fill="black"/>
<path d="M158.977 58.5616C158.164 57.4202 157.694 56.277 157.567 55.1321C157.457 53.9902 157.668 52.9021 158.198 51.8677C158.738 50.826 159.584 49.895 160.736 49.0748C161.888 48.2546 163.039 47.7632 164.19 47.6004C165.341 47.4377 166.433 47.5985 167.466 48.0828C168.517 48.57 169.448 49.3844 170.261 50.5258C170.786 51.2626 171.167 52.0391 171.404 52.8554C171.649 53.6821 171.71 54.4596 171.587 55.188L169.534 55.6648C169.596 54.9171 169.541 54.2366 169.37 53.6232C169.21 53.0025 168.93 52.412 168.531 51.8516C167.741 50.7413 166.801 50.1358 165.713 50.035C164.635 49.9268 163.479 50.3124 162.244 51.1917C161.009 52.071 160.261 53.0414 160 54.1028C159.74 55.1642 160.005 56.25 160.795 57.3603C161.194 57.9207 161.656 58.3819 162.179 58.744C162.713 59.0987 163.344 59.3691 164.071 59.5553L162.949 61.3396C162.231 61.2097 161.516 60.8977 160.804 60.4035C160.11 59.9123 159.501 59.2984 158.977 58.5616Z" fill="black"/>
<path d="M162.545 64.3083L163.697 62.4592C164.175 62.801 164.667 63.0663 165.173 63.2552C165.697 63.4503 166.278 63.5421 166.917 63.5304C167.572 63.525 168.326 63.3977 169.179 63.1485C170.037 62.9108 171.033 62.5326 172.169 62.014L175.889 60.3153L179.842 68.9713L167.588 74.5675L166.572 72.3427L176.966 67.5958L174.965 63.2157L172.532 64.327C170.968 65.0414 169.572 65.4967 168.345 65.6928C167.135 65.8953 166.059 65.8687 165.116 65.6132C164.173 65.3576 163.316 64.9226 162.545 64.3083Z" fill="black"/>
<path d="M168.644 78.2741L181.736 75.0981L183.848 83.8073L181.954 84.2668L180.396 77.8417L176.793 78.7156L178.253 84.7322L176.359 85.1917L174.899 79.1751L171.092 80.0986L172.651 86.5237L170.757 86.9832L168.644 78.2741Z" fill="black"/>
<path d="M170.698 109.076C170.858 107.966 171.138 107.002 171.539 106.185C171.952 105.369 172.456 104.682 173.051 104.124L174.777 105.145C174.243 105.634 173.807 106.209 173.468 106.868C173.141 107.529 172.914 108.3 172.787 109.183C172.637 110.229 172.696 111.023 172.966 111.564C173.234 112.117 173.715 112.444 174.408 112.543C175.657 112.723 176.4 111.98 176.64 110.316L177.105 107.082L179.015 107.356L178.596 110.269C178.359 111.921 178.852 112.835 180.075 113.011C180.667 113.096 181.166 112.942 181.569 112.55C181.984 112.172 182.259 111.516 182.393 110.583C182.498 109.852 182.487 109.123 182.36 108.397C182.231 107.684 181.984 107.024 181.621 106.418L183.545 105.923C183.965 106.588 184.244 107.375 184.384 108.283C184.534 109.205 184.539 110.158 184.397 111.142C184.165 112.756 183.651 113.917 182.854 114.626C182.07 115.337 181.135 115.615 180.051 115.459C179.332 115.356 178.741 115.078 178.279 114.625C177.814 114.185 177.508 113.632 177.359 112.968C177.038 113.681 176.576 114.206 175.974 114.544C175.383 114.897 174.677 115.014 173.858 114.897C172.672 114.726 171.782 114.161 171.187 113.2C170.604 112.241 170.441 110.866 170.698 109.076Z" fill="black"/>
<path d="M169.931 116.005L180.668 126.171L180.011 128.067L165.287 129.421L166.1 127.074L169.481 126.828L171.63 120.617L169.118 118.352L169.931 116.005ZM177.839 126.223L173.197 122.049L171.597 126.671L177.826 126.259L177.839 126.223Z" fill="black"/>
<path d="M165.102 129.667L176.768 136.402L175.746 138.173L165.729 137.906L170.978 146.431L169.975 148.168L158.309 141.432L159.417 139.513L167.277 144.051L163.117 137.192L163.834 135.951L171.821 136.105L163.993 131.586L165.102 129.667Z" fill="black"/>
<path d="M156.446 143.501L166.627 152.323L160.758 159.096L159.285 157.819L163.615 152.823L160.813 150.395L156.759 155.074L155.286 153.798L159.34 149.119L156.38 146.554L152.05 151.55L150.577 150.274L156.446 143.501Z" fill="black"/>
<path d="M147.722 152.949L156.05 163.538L151.454 167.153C150.292 168.066 149.167 168.481 148.08 168.396C146.992 168.311 146.039 167.748 145.22 166.707C144.401 165.666 144.075 164.601 144.241 163.514C144.415 162.438 145.083 161.442 146.244 160.529L148.918 158.426L145.8 154.461L147.722 152.949ZM150.111 159.943L147.738 161.81C146.356 162.896 146.138 164.041 147.083 165.242C148.02 166.434 149.179 166.486 150.561 165.4L152.934 163.533L150.111 159.943Z" fill="black"/>
<path d="M138.718 160.075L139.473 174.842L137.689 175.761L126.098 166.581L128.306 165.442L130.923 167.598L136.765 164.586L136.51 161.213L138.718 160.075ZM137.389 172.928L136.911 166.704L132.563 168.945L137.355 172.945L137.389 172.928Z" fill="black"/>
<circle cx="114.013" cy="176.433" r="4.4586" fill="#8D0300"/>
</svg>
</div>
Ответы (3 шт):
Автор решения: LureRed
→ Ссылка
Пробуйте с помощью jquery Анимацию в отдельный класс Воспроизведение событий по скрипту Как то так попробуйте
$("#idAnimacii").on({
mouseenter() {
$(this).addClass("classAnimacii");
},
animationend() {
$(this).removeClass("classAnimacii");
},
});
.billbord-3dIcon {
position: absolute;
top: 70px;
right: 200px;
z-index: 5;
}
.billbord-3dIcon:hover svg path {
transform-origin: center;
}
.classAnimacii {
animation: 5s rotateIconOut ease;
}
@keyframes rotateIconOut {
0% {
transform: rotate(0deg)
}
50% {
transform: rotate(180deg)
}
100% {
transform: rotate(0deg)
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div class='billbord-3dIcon' id="idAnimacii">
<svg width="200" height="200" viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M74.3847 120.418C71.3274 120.418 68.3924 120.01 65.5796 119.195C62.7669 118.339 60.5249 117.218 58.8535 115.832L62.2777 107.455C65.8242 109.941 69.7172 111.185 73.9567 111.185C78.3592 111.185 80.5605 109.676 80.5605 106.66C80.5605 103.888 78.6038 102.502 74.6905 102.502H67.1694V93.5745H73.5898C75.3427 93.5745 76.7083 93.2077 77.6866 92.4739C78.7057 91.7402 79.2153 90.6803 79.2153 89.2943C79.2153 86.5631 77.3198 85.1975 73.5287 85.1975C69.6561 85.1975 66.1503 86.4408 63.0115 88.9274L59.5261 80.7338C61.3605 79.2255 63.6026 78.0637 66.2522 77.2484C68.9427 76.3924 71.735 75.9644 74.6293 75.9644C79.4395 75.9644 83.1898 77.0242 85.8803 79.144C88.5707 81.223 89.9159 84.1172 89.9159 87.8268C89.9159 90.028 89.3656 91.9644 88.265 93.6357C87.1643 95.307 85.6357 96.53 83.679 97.3045C86.0841 97.9975 87.9389 99.2612 89.2433 101.096C90.5885 102.93 91.2612 105.152 91.2612 107.761C91.2612 111.674 89.7529 114.772 86.7363 117.055C83.7605 119.297 79.6433 120.418 74.3847 120.418Z" fill="white"/>
<path d="M97.9022 119.745V76.637H115.757C123.217 76.637 129.005 78.5121 133.123 82.2624C137.24 86.0128 139.298 91.3121 139.298 98.1605C139.298 105.009 137.24 110.329 133.123 114.12C129.005 117.87 123.217 119.745 115.757 119.745H97.9022ZM109.153 110.634H115.023C119.304 110.634 122.463 109.615 124.501 107.577C126.58 105.498 127.619 102.359 127.619 98.1605C127.619 93.9618 126.58 90.8433 124.501 88.8051C122.422 86.7669 119.263 85.7478 115.023 85.7478H109.153V110.634Z" fill="white"/>
<path d="M200 100C200 155.228 155.228 200 100 200C44.7715 200 0 155.228 0 100C0 44.7715 44.7715 0 100 0C155.228 0 200 44.7715 200 100ZM38.9917 100C38.9917 133.694 66.3061 161.008 100 161.008C133.694 161.008 161.008 133.694 161.008 100C161.008 66.3061 133.694 38.9917 100 38.9917C66.3061 38.9917 38.9917 66.3061 38.9917 100Z" fill="white"/>
<path d="M97.1107 171.483L95.8302 184.894L89.9715 184.334C88.5639 184.2 87.5029 183.785 86.7887 183.09C86.0733 182.407 85.7677 181.521 85.8718 180.43C85.9408 179.707 86.184 179.103 86.6014 178.619C87.0188 178.134 87.5624 177.802 88.2322 177.623C87.4919 177.334 86.9385 176.898 86.5721 176.312C86.1918 175.739 86.041 175.04 86.1197 174.215C86.2335 173.023 86.7277 172.136 87.6023 171.554C88.463 170.984 89.6098 170.767 91.0428 170.904L97.1107 171.483ZM94.0336 178.983L90.933 178.687C89.2718 178.528 88.38 179.089 88.2577 180.37C88.1354 181.651 88.9049 182.37 90.5661 182.529L93.6667 182.825L94.0336 178.983ZM94.5948 173.105L91.1709 172.778C89.497 172.618 88.5959 173.21 88.4675 174.555C88.3392 175.899 89.1119 176.651 90.7859 176.811L94.2098 177.138L94.5948 173.105Z" fill="black"/>
<path d="M84.3584 170.032L80.563 182.958L78.3813 182.317L81.0514 173.223L71.4326 180.277L69.6725 179.76L73.4678 166.834L75.6496 167.475L72.9686 176.605L82.6166 169.521L84.3584 170.032Z" fill="black"/>
<path d="M66.4577 163.267C67.4541 163.781 68.2731 164.361 68.9146 165.007C69.5503 165.664 70.0345 166.365 70.3671 167.11L68.8384 168.407C68.5504 167.743 68.1504 167.142 67.6386 166.606C67.1209 166.081 66.4658 165.614 65.6732 165.206C64.7334 164.721 63.9639 164.518 63.3647 164.596C62.7542 164.668 62.2884 165.016 61.9674 165.639C61.3895 166.76 61.8478 167.705 63.3424 168.476L66.2467 169.973L65.3624 171.688L62.7468 170.34C61.2635 169.575 60.2388 169.742 59.6726 170.841C59.3982 171.373 59.3804 171.894 59.6191 172.404C59.8406 172.919 60.3703 173.393 61.2082 173.825C61.8649 174.164 62.5572 174.391 63.285 174.509C64.0015 174.62 64.7053 174.603 65.3965 174.458L65.2353 176.439C64.4697 176.617 63.6349 176.624 62.731 176.459C61.81 176.299 60.9079 175.992 60.0248 175.537C58.5755 174.79 57.6461 173.923 57.2366 172.938C56.8214 171.965 56.8647 170.991 57.3667 170.017C57.6995 169.372 58.1553 168.905 58.7343 168.615C59.302 168.321 59.9244 168.211 60.6014 168.288C60.0326 167.751 59.6869 167.143 59.5642 166.464C59.4244 165.79 59.5442 165.085 59.9237 164.349C60.4724 163.284 61.2981 162.628 62.4007 162.379C63.4976 162.142 64.8499 162.438 66.4577 163.267Z" fill="black"/>
<path d="M56.8263 157.653L52.6731 159.565L51.4278 170.546L49.37 168.928L50.3781 160.629L43.0916 163.99L41.1089 162.431L54.8286 156.082L56.8263 157.653Z" fill="black"/>
<path d="M49.282 151.765L35.1093 155.98L33.7954 154.464L39.9846 141.035L41.6113 142.913L40.1334 145.963L44.4379 150.931L47.6552 149.888L49.282 151.765ZM36.4784 153.504L42.4144 151.572L39.211 147.875L36.4534 153.476L36.4784 153.504Z" fill="black"/>
<path d="M39.6106 139.661L38.6404 141.612C38.1319 141.317 37.6166 141.099 37.0946 140.96C36.5551 140.815 35.9679 140.779 35.3331 140.851C34.6808 140.919 33.9422 141.117 33.1173 141.447C32.286 141.765 31.3298 142.236 30.2486 142.86L26.7073 144.905L21.9494 136.664L33.6159 129.928L34.8388 132.046L24.943 137.759L27.3506 141.93L29.6674 140.592C31.1567 139.732 32.5027 139.146 33.7053 138.834C34.8905 138.518 35.9647 138.442 36.9277 138.607C37.8907 138.772 38.785 139.123 39.6106 139.661Z" fill="black"/>
<path d="M32.8113 128.069L20.0809 132.475L19.3371 130.326L28.2936 127.226L16.9685 123.482L16.3685 121.749L29.099 117.343L29.8427 119.492L20.8501 122.604L32.2176 126.354L32.8113 128.069Z" fill="black"/>
<path d="M27.9385 109.564C28.0981 110.673 28.1008 111.677 27.9466 112.574C27.7799 113.473 27.4897 114.274 27.076 114.977L25.1325 114.485C25.5067 113.865 25.7637 113.19 25.9036 112.463C26.0308 111.736 26.031 110.932 25.9041 110.049C25.7536 109.003 25.4728 108.258 25.0617 107.815C24.6487 107.36 24.0955 107.182 23.402 107.282C22.1537 107.461 21.6492 108.383 21.8885 110.048L22.3535 113.282L20.4432 113.557L20.0244 110.644C19.7869 108.992 19.0566 108.254 17.8335 108.43C17.2409 108.515 16.8061 108.803 16.5291 109.293C16.2377 109.773 16.159 110.479 16.2932 111.412C16.3983 112.143 16.6143 112.839 16.9409 113.5C17.2658 114.148 17.6879 114.712 18.2071 115.191L16.5002 116.208C15.9106 115.688 15.4209 115.012 15.031 114.18C14.6267 113.337 14.3538 112.424 14.2124 111.441C13.9804 109.827 14.1468 108.567 14.7116 107.663C15.2639 106.759 16.0822 106.23 17.1666 106.074C17.8853 105.971 18.5304 106.071 19.1018 106.375C19.6713 106.666 20.1212 107.11 20.4514 107.706C20.5588 106.931 20.8537 106.297 21.3361 105.803C21.804 105.298 22.4478 104.987 23.2674 104.869C24.4526 104.698 25.4663 104.99 26.3083 105.744C27.1377 106.5 27.6811 107.773 27.9385 109.564Z" fill="black"/>
<path d="M26.7227 102.699L13.5566 95.9691L13.6521 93.965L27.3982 88.5174L27.28 90.9987L24.1053 92.1865L23.7925 98.7523L26.8409 100.217L26.7227 102.699ZM16.2561 95.1221L21.8857 97.8198L22.1184 92.9336L16.2579 95.0839L16.2561 95.1221Z" fill="black"/>
<path d="M33.2978 77.7351L30.2338 76.9918L27.5353 88.115L14.4437 84.939L15.0203 82.5621L26.125 85.2561L27.7333 78.6267L16.6286 75.9327L17.2052 73.5558L28.3099 76.2498L28.7604 74.3928L33.8113 75.6182L33.2978 77.7351Z" fill="black"/>
<path d="M31.1544 74.1827L18.9005 68.5865L19.8451 66.5181L28.4663 70.4553L22.8535 59.9305L23.6156 58.2619L35.8695 63.8581L34.9249 65.9265L26.2689 61.9734L31.9085 72.5314L31.1544 74.1827Z" fill="black"/>
<path d="M37.12 61.7011L35.0502 57.4593C34.6744 56.6912 34.5757 55.9954 34.754 55.3717C33.9938 56.0658 33.1851 56.4439 32.3277 56.5058C31.4704 56.5678 30.6267 56.3032 29.7965 55.7121C28.7589 54.9731 28.1874 54.0736 28.0822 53.0134C27.9667 51.9459 28.3374 50.8103 29.1946 49.6066L32.5974 44.8281L43.5708 52.6422L42.152 54.6346L37.7627 51.5089L36.8095 52.8475C36.5361 53.2314 36.3692 53.5975 36.309 53.9456C36.2562 54.2833 36.3345 54.6674 36.5439 55.0981L38.6828 59.5065L37.12 61.7011ZM34.5438 52.8997L36.284 50.4559L32.7507 47.9399L31.0105 50.3836C29.976 51.8364 30.0451 52.9802 31.2176 53.8152C32.4006 54.6576 33.5093 54.3524 34.5438 52.8997Z" fill="black"/>
<path d="M61.6745 37.5046C60.4957 38.2621 59.3315 38.6772 58.1818 38.7498C57.036 38.8047 55.9591 38.5428 54.9512 37.964C53.9363 37.3745 53.0467 36.485 52.2822 35.2954C51.5177 34.1059 51.0816 32.9325 50.9738 31.7752C50.8661 30.6179 51.0786 29.5348 51.6115 28.5261C52.1482 27.4998 53.0059 26.6078 54.1848 25.8502C54.9456 25.3613 55.7394 25.0177 56.5661 24.8196C57.4035 24.6146 58.183 24.5906 58.9048 24.7476L59.2834 26.8211C58.5394 26.7238 57.857 26.7459 57.2363 26.8874C56.6086 27.0182 56.0055 27.2696 55.4268 27.6415C54.2801 28.3784 53.6305 29.288 53.4781 30.3702C53.3187 31.4418 53.6488 32.6152 54.4684 33.8905C55.2879 35.1657 56.2216 35.9588 57.2694 36.2697C58.3172 36.5806 59.4145 36.3676 60.5611 35.6307C61.1398 35.2588 61.6225 34.8199 62.0091 34.314C62.3888 33.7974 62.6889 33.1805 62.9094 32.4634L64.6383 33.6691C64.4744 34.3802 64.1288 35.0793 63.6013 35.7666C63.0777 36.4362 62.4354 37.0156 61.6745 37.5046Z" fill="black"/>
<path d="M67.99 33.7001L62.9832 21.1938L68.4115 19.0206C69.7834 18.4714 70.9791 18.3906 71.9988 18.7783C73.0184 19.1659 73.7745 19.9747 74.2669 21.2046C74.7593 22.4346 74.7726 23.5476 74.3069 24.5436C73.8364 25.5278 72.9153 26.2945 71.5434 26.8437L68.3858 28.1078L70.2607 32.7911L67.99 33.7001ZM67.6685 26.3162L70.4713 25.1941C72.1034 24.5407 72.6353 23.5044 72.0672 22.0853C71.5038 20.6779 70.406 20.301 68.774 20.9543L65.9712 22.0764L67.6685 26.3162Z" fill="black"/>
<path d="M78.6371 29.3999L82.073 15.0184L84.0431 14.6387L92.5779 26.713L90.1388 27.1832L88.2359 24.3779L81.7814 25.6219L81.0762 28.9298L78.6371 29.3999ZM83.5326 17.4421L82.2382 23.549L87.0415 22.6232L83.5701 17.4348L83.5326 17.4421Z" fill="black"/>
<path d="M98.834 26.9426C97.7129 26.9426 96.7193 26.8025 95.8531 26.5222C94.9868 26.2292 94.2352 25.828 93.5983 25.3184L94.3626 23.4649C94.9231 23.9235 95.5537 24.2738 96.2543 24.5159C96.955 24.7452 97.7512 24.8598 98.6429 24.8598C99.7002 24.8598 100.477 24.6878 100.974 24.3439C101.484 23.9999 101.738 23.4776 101.738 22.777C101.738 21.5159 100.898 20.8853 99.2161 20.8853H95.9486V18.9554H98.8913C100.56 18.9554 101.394 18.3375 101.394 17.1019C101.394 16.5031 101.172 16.0318 100.726 15.6878C100.293 15.3311 99.6047 15.1528 98.662 15.1528C97.9231 15.1528 97.2034 15.2675 96.5027 15.4968C95.8148 15.7261 95.197 16.0636 94.6492 16.5095L93.8849 14.6751C94.4836 14.1655 95.2225 13.777 96.1015 13.5095C96.9932 13.2292 97.9359 13.0891 98.9295 13.0891C100.56 13.0891 101.783 13.4331 102.598 14.121C103.414 14.7961 103.821 15.6815 103.821 16.777C103.821 17.5031 103.63 18.1273 103.248 18.6496C102.879 19.1719 102.375 19.5541 101.738 19.7961C102.49 20.0127 103.076 20.3948 103.496 20.9426C103.929 21.4776 104.146 22.1592 104.146 22.9872C104.146 24.1847 103.713 25.1464 102.847 25.8726C101.98 26.5859 100.643 26.9426 98.834 26.9426Z" fill="black"/>
<path d="M110.17 27.519L112.985 23.9167L109.061 13.5859L111.631 14.0814L114.538 21.9196L119.474 15.593L121.951 16.0703L112.665 28L110.17 27.519Z" fill="black"/>
<path d="M133.774 35.2732L141.058 23.9404L150.911 30.2731L143.628 41.6059L141.571 40.2836L147.748 30.6708L142.01 26.9827L135.832 36.5955L133.774 35.2732Z" fill="black"/>
<path d="M149.332 47.1363C148.391 46.2396 147.764 45.2454 147.45 44.1536C147.145 43.0707 147.155 41.9712 147.479 40.8552C147.813 39.7299 148.463 38.6603 149.43 37.6461C150.406 36.6227 151.444 35.9223 152.543 35.5447C153.642 35.1671 154.736 35.1096 155.823 35.372C156.919 35.6252 157.942 36.2046 158.892 37.11C159.841 38.0155 160.469 39.0097 160.774 40.0927C161.088 41.1664 161.082 42.2613 160.758 43.3773C160.433 44.4933 159.787 45.5584 158.82 46.5725C157.844 47.5959 156.802 48.301 155.694 48.6878C154.595 49.0654 153.497 49.1275 152.401 48.8743C151.304 48.6211 150.281 48.0417 149.332 47.1363ZM150.782 45.6151C151.677 46.4678 152.667 46.8226 153.754 46.6796C154.841 46.5366 155.907 45.9165 156.953 44.8194C158.008 43.7131 158.577 42.6183 158.659 41.5351C158.751 40.4607 158.345 39.4928 157.441 38.6313C156.547 37.7786 155.561 37.4191 154.483 37.5529C153.405 37.6867 152.338 38.3067 151.283 39.4131C150.237 40.5102 149.669 41.605 149.578 42.6974C149.486 43.7898 149.888 44.7624 150.782 45.6151Z" fill="black"/>
<path d="M158.977 58.5616C158.164 57.4202 157.694 56.277 157.567 55.1321C157.457 53.9902 157.668 52.9021 158.198 51.8677C158.738 50.826 159.584 49.895 160.736 49.0748C161.888 48.2546 163.039 47.7632 164.19 47.6004C165.341 47.4377 166.433 47.5985 167.466 48.0828C168.517 48.57 169.448 49.3844 170.261 50.5258C170.786 51.2626 171.167 52.0391 171.404 52.8554C171.649 53.6821 171.71 54.4596 171.587 55.188L169.534 55.6648C169.596 54.9171 169.541 54.2366 169.37 53.6232C169.21 53.0025 168.93 52.412 168.531 51.8516C167.741 50.7413 166.801 50.1358 165.713 50.035C164.635 49.9268 163.479 50.3124 162.244 51.1917C161.009 52.071 160.261 53.0414 160 54.1028C159.74 55.1642 160.005 56.25 160.795 57.3603C161.194 57.9207 161.656 58.3819 162.179 58.744C162.713 59.0987 163.344 59.3691 164.071 59.5553L162.949 61.3396C162.231 61.2097 161.516 60.8977 160.804 60.4035C160.11 59.9123 159.501 59.2984 158.977 58.5616Z" fill="black"/>
<path d="M162.545 64.3083L163.697 62.4592C164.175 62.801 164.667 63.0663 165.173 63.2552C165.697 63.4503 166.278 63.5421 166.917 63.5304C167.572 63.525 168.326 63.3977 169.179 63.1485C170.037 62.9108 171.033 62.5326 172.169 62.014L175.889 60.3153L179.842 68.9713L167.588 74.5675L166.572 72.3427L176.966 67.5958L174.965 63.2157L172.532 64.327C170.968 65.0414 169.572 65.4967 168.345 65.6928C167.135 65.8953 166.059 65.8687 165.116 65.6132C164.173 65.3576 163.316 64.9226 162.545 64.3083Z" fill="black"/>
<path d="M168.644 78.2741L181.736 75.0981L183.848 83.8073L181.954 84.2668L180.396 77.8417L176.793 78.7156L178.253 84.7322L176.359 85.1917L174.899 79.1751L171.092 80.0986L172.651 86.5237L170.757 86.9832L168.644 78.2741Z" fill="black"/>
<path d="M170.698 109.076C170.858 107.966 171.138 107.002 171.539 106.185C171.952 105.369 172.456 104.682 173.051 104.124L174.777 105.145C174.243 105.634 173.807 106.209 173.468 106.868C173.141 107.529 172.914 108.3 172.787 109.183C172.637 110.229 172.696 111.023 172.966 111.564C173.234 112.117 173.715 112.444 174.408 112.543C175.657 112.723 176.4 111.98 176.64 110.316L177.105 107.082L179.015 107.356L178.596 110.269C178.359 111.921 178.852 112.835 180.075 113.011C180.667 113.096 181.166 112.942 181.569 112.55C181.984 112.172 182.259 111.516 182.393 110.583C182.498 109.852 182.487 109.123 182.36 108.397C182.231 107.684 181.984 107.024 181.621 106.418L183.545 105.923C183.965 106.588 184.244 107.375 184.384 108.283C184.534 109.205 184.539 110.158 184.397 111.142C184.165 112.756 183.651 113.917 182.854 114.626C182.07 115.337 181.135 115.615 180.051 115.459C179.332 115.356 178.741 115.078 178.279 114.625C177.814 114.185 177.508 113.632 177.359 112.968C177.038 113.681 176.576 114.206 175.974 114.544C175.383 114.897 174.677 115.014 173.858 114.897C172.672 114.726 171.782 114.161 171.187 113.2C170.604 112.241 170.441 110.866 170.698 109.076Z" fill="black"/>
<path d="M169.931 116.005L180.668 126.171L180.011 128.067L165.287 129.421L166.1 127.074L169.481 126.828L171.63 120.617L169.118 118.352L169.931 116.005ZM177.839 126.223L173.197 122.049L171.597 126.671L177.826 126.259L177.839 126.223Z" fill="black"/>
<path d="M165.102 129.667L176.768 136.402L175.746 138.173L165.729 137.906L170.978 146.431L169.975 148.168L158.309 141.432L159.417 139.513L167.277 144.051L163.117 137.192L163.834 135.951L171.821 136.105L163.993 131.586L165.102 129.667Z" fill="black"/>
<path d="M156.446 143.501L166.627 152.323L160.758 159.096L159.285 157.819L163.615 152.823L160.813 150.395L156.759 155.074L155.286 153.798L159.34 149.119L156.38 146.554L152.05 151.55L150.577 150.274L156.446 143.501Z" fill="black"/>
<path d="M147.722 152.949L156.05 163.538L151.454 167.153C150.292 168.066 149.167 168.481 148.08 168.396C146.992 168.311 146.039 167.748 145.22 166.707C144.401 165.666 144.075 164.601 144.241 163.514C144.415 162.438 145.083 161.442 146.244 160.529L148.918 158.426L145.8 154.461L147.722 152.949ZM150.111 159.943L147.738 161.81C146.356 162.896 146.138 164.041 147.083 165.242C148.02 166.434 149.179 166.486 150.561 165.4L152.934 163.533L150.111 159.943Z" fill="black"/>
<path d="M138.718 160.075L139.473 174.842L137.689 175.761L126.098 166.581L128.306 165.442L130.923 167.598L136.765 164.586L136.51 161.213L138.718 160.075ZM137.389 172.928L136.911 166.704L132.563 168.945L137.355 172.945L137.389 172.928Z" fill="black"/>
<circle cx="114.013" cy="176.433" r="4.4586" fill="#8D0300"/>
</svg>
</div>
Автор решения: LureRed
→ Ссылка
Можно и на js сделать, ни кто не запрещает.
let animation = document.getElementById("idAnimacii");
animation.addEventListener('mouseenter', function() {
document.getElementById("idAnimacii").classList.add("classAnimacii");
})
animation.addEventListener('animationend', function() {
document.getElementById("idAnimacii").classList.remove("classAnimacii");
})
.billbord-3dIcon {
position: absolute;
top: 70px;
right: 200px;
z-index: 5;
}
.billbord-3dIcon:hover svg path {
transform-origin: center;
}
.classAnimacii {
animation: 5s rotateIconOut ease;
}
@keyframes rotateIconOut {
0% {
transform: rotate(0deg)
}
50% {
transform: rotate(180deg)
}
100% {
transform: rotate(0deg)
}
}
<div class='billbord-3dIcon' id="idAnimacii">
<svg width="200" height="200" viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M74.3847 120.418C71.3274 120.418 68.3924 120.01 65.5796 119.195C62.7669 118.339 60.5249 117.218 58.8535 115.832L62.2777 107.455C65.8242 109.941 69.7172 111.185 73.9567 111.185C78.3592 111.185 80.5605 109.676 80.5605 106.66C80.5605 103.888 78.6038 102.502 74.6905 102.502H67.1694V93.5745H73.5898C75.3427 93.5745 76.7083 93.2077 77.6866 92.4739C78.7057 91.7402 79.2153 90.6803 79.2153 89.2943C79.2153 86.5631 77.3198 85.1975 73.5287 85.1975C69.6561 85.1975 66.1503 86.4408 63.0115 88.9274L59.5261 80.7338C61.3605 79.2255 63.6026 78.0637 66.2522 77.2484C68.9427 76.3924 71.735 75.9644 74.6293 75.9644C79.4395 75.9644 83.1898 77.0242 85.8803 79.144C88.5707 81.223 89.9159 84.1172 89.9159 87.8268C89.9159 90.028 89.3656 91.9644 88.265 93.6357C87.1643 95.307 85.6357 96.53 83.679 97.3045C86.0841 97.9975 87.9389 99.2612 89.2433 101.096C90.5885 102.93 91.2612 105.152 91.2612 107.761C91.2612 111.674 89.7529 114.772 86.7363 117.055C83.7605 119.297 79.6433 120.418 74.3847 120.418Z" fill="white"/>
<path d="M97.9022 119.745V76.637H115.757C123.217 76.637 129.005 78.5121 133.123 82.2624C137.24 86.0128 139.298 91.3121 139.298 98.1605C139.298 105.009 137.24 110.329 133.123 114.12C129.005 117.87 123.217 119.745 115.757 119.745H97.9022ZM109.153 110.634H115.023C119.304 110.634 122.463 109.615 124.501 107.577C126.58 105.498 127.619 102.359 127.619 98.1605C127.619 93.9618 126.58 90.8433 124.501 88.8051C122.422 86.7669 119.263 85.7478 115.023 85.7478H109.153V110.634Z" fill="white"/>
<path d="M200 100C200 155.228 155.228 200 100 200C44.7715 200 0 155.228 0 100C0 44.7715 44.7715 0 100 0C155.228 0 200 44.7715 200 100ZM38.9917 100C38.9917 133.694 66.3061 161.008 100 161.008C133.694 161.008 161.008 133.694 161.008 100C161.008 66.3061 133.694 38.9917 100 38.9917C66.3061 38.9917 38.9917 66.3061 38.9917 100Z" fill="white"/>
<path d="M97.1107 171.483L95.8302 184.894L89.9715 184.334C88.5639 184.2 87.5029 183.785 86.7887 183.09C86.0733 182.407 85.7677 181.521 85.8718 180.43C85.9408 179.707 86.184 179.103 86.6014 178.619C87.0188 178.134 87.5624 177.802 88.2322 177.623C87.4919 177.334 86.9385 176.898 86.5721 176.312C86.1918 175.739 86.041 175.04 86.1197 174.215C86.2335 173.023 86.7277 172.136 87.6023 171.554C88.463 170.984 89.6098 170.767 91.0428 170.904L97.1107 171.483ZM94.0336 178.983L90.933 178.687C89.2718 178.528 88.38 179.089 88.2577 180.37C88.1354 181.651 88.9049 182.37 90.5661 182.529L93.6667 182.825L94.0336 178.983ZM94.5948 173.105L91.1709 172.778C89.497 172.618 88.5959 173.21 88.4675 174.555C88.3392 175.899 89.1119 176.651 90.7859 176.811L94.2098 177.138L94.5948 173.105Z" fill="black"/>
<path d="M84.3584 170.032L80.563 182.958L78.3813 182.317L81.0514 173.223L71.4326 180.277L69.6725 179.76L73.4678 166.834L75.6496 167.475L72.9686 176.605L82.6166 169.521L84.3584 170.032Z" fill="black"/>
<path d="M66.4577 163.267C67.4541 163.781 68.2731 164.361 68.9146 165.007C69.5503 165.664 70.0345 166.365 70.3671 167.11L68.8384 168.407C68.5504 167.743 68.1504 167.142 67.6386 166.606C67.1209 166.081 66.4658 165.614 65.6732 165.206C64.7334 164.721 63.9639 164.518 63.3647 164.596C62.7542 164.668 62.2884 165.016 61.9674 165.639C61.3895 166.76 61.8478 167.705 63.3424 168.476L66.2467 169.973L65.3624 171.688L62.7468 170.34C61.2635 169.575 60.2388 169.742 59.6726 170.841C59.3982 171.373 59.3804 171.894 59.6191 172.404C59.8406 172.919 60.3703 173.393 61.2082 173.825C61.8649 174.164 62.5572 174.391 63.285 174.509C64.0015 174.62 64.7053 174.603 65.3965 174.458L65.2353 176.439C64.4697 176.617 63.6349 176.624 62.731 176.459C61.81 176.299 60.9079 175.992 60.0248 175.537C58.5755 174.79 57.6461 173.923 57.2366 172.938C56.8214 171.965 56.8647 170.991 57.3667 170.017C57.6995 169.372 58.1553 168.905 58.7343 168.615C59.302 168.321 59.9244 168.211 60.6014 168.288C60.0326 167.751 59.6869 167.143 59.5642 166.464C59.4244 165.79 59.5442 165.085 59.9237 164.349C60.4724 163.284 61.2981 162.628 62.4007 162.379C63.4976 162.142 64.8499 162.438 66.4577 163.267Z" fill="black"/>
<path d="M56.8263 157.653L52.6731 159.565L51.4278 170.546L49.37 168.928L50.3781 160.629L43.0916 163.99L41.1089 162.431L54.8286 156.082L56.8263 157.653Z" fill="black"/>
<path d="M49.282 151.765L35.1093 155.98L33.7954 154.464L39.9846 141.035L41.6113 142.913L40.1334 145.963L44.4379 150.931L47.6552 149.888L49.282 151.765ZM36.4784 153.504L42.4144 151.572L39.211 147.875L36.4534 153.476L36.4784 153.504Z" fill="black"/>
<path d="M39.6106 139.661L38.6404 141.612C38.1319 141.317 37.6166 141.099 37.0946 140.96C36.5551 140.815 35.9679 140.779 35.3331 140.851C34.6808 140.919 33.9422 141.117 33.1173 141.447C32.286 141.765 31.3298 142.236 30.2486 142.86L26.7073 144.905L21.9494 136.664L33.6159 129.928L34.8388 132.046L24.943 137.759L27.3506 141.93L29.6674 140.592C31.1567 139.732 32.5027 139.146 33.7053 138.834C34.8905 138.518 35.9647 138.442 36.9277 138.607C37.8907 138.772 38.785 139.123 39.6106 139.661Z" fill="black"/>
<path d="M32.8113 128.069L20.0809 132.475L19.3371 130.326L28.2936 127.226L16.9685 123.482L16.3685 121.749L29.099 117.343L29.8427 119.492L20.8501 122.604L32.2176 126.354L32.8113 128.069Z" fill="black"/>
<path d="M27.9385 109.564C28.0981 110.673 28.1008 111.677 27.9466 112.574C27.7799 113.473 27.4897 114.274 27.076 114.977L25.1325 114.485C25.5067 113.865 25.7637 113.19 25.9036 112.463C26.0308 111.736 26.031 110.932 25.9041 110.049C25.7536 109.003 25.4728 108.258 25.0617 107.815C24.6487 107.36 24.0955 107.182 23.402 107.282C22.1537 107.461 21.6492 108.383 21.8885 110.048L22.3535 113.282L20.4432 113.557L20.0244 110.644C19.7869 108.992 19.0566 108.254 17.8335 108.43C17.2409 108.515 16.8061 108.803 16.5291 109.293C16.2377 109.773 16.159 110.479 16.2932 111.412C16.3983 112.143 16.6143 112.839 16.9409 113.5C17.2658 114.148 17.6879 114.712 18.2071 115.191L16.5002 116.208C15.9106 115.688 15.4209 115.012 15.031 114.18C14.6267 113.337 14.3538 112.424 14.2124 111.441C13.9804 109.827 14.1468 108.567 14.7116 107.663C15.2639 106.759 16.0822 106.23 17.1666 106.074C17.8853 105.971 18.5304 106.071 19.1018 106.375C19.6713 106.666 20.1212 107.11 20.4514 107.706C20.5588 106.931 20.8537 106.297 21.3361 105.803C21.804 105.298 22.4478 104.987 23.2674 104.869C24.4526 104.698 25.4663 104.99 26.3083 105.744C27.1377 106.5 27.6811 107.773 27.9385 109.564Z" fill="black"/>
<path d="M26.7227 102.699L13.5566 95.9691L13.6521 93.965L27.3982 88.5174L27.28 90.9987L24.1053 92.1865L23.7925 98.7523L26.8409 100.217L26.7227 102.699ZM16.2561 95.1221L21.8857 97.8198L22.1184 92.9336L16.2579 95.0839L16.2561 95.1221Z" fill="black"/>
<path d="M33.2978 77.7351L30.2338 76.9918L27.5353 88.115L14.4437 84.939L15.0203 82.5621L26.125 85.2561L27.7333 78.6267L16.6286 75.9327L17.2052 73.5558L28.3099 76.2498L28.7604 74.3928L33.8113 75.6182L33.2978 77.7351Z" fill="black"/>
<path d="M31.1544 74.1827L18.9005 68.5865L19.8451 66.5181L28.4663 70.4553L22.8535 59.9305L23.6156 58.2619L35.8695 63.8581L34.9249 65.9265L26.2689 61.9734L31.9085 72.5314L31.1544 74.1827Z" fill="black"/>
<path d="M37.12 61.7011L35.0502 57.4593C34.6744 56.6912 34.5757 55.9954 34.754 55.3717C33.9938 56.0658 33.1851 56.4439 32.3277 56.5058C31.4704 56.5678 30.6267 56.3032 29.7965 55.7121C28.7589 54.9731 28.1874 54.0736 28.0822 53.0134C27.9667 51.9459 28.3374 50.8103 29.1946 49.6066L32.5974 44.8281L43.5708 52.6422L42.152 54.6346L37.7627 51.5089L36.8095 52.8475C36.5361 53.2314 36.3692 53.5975 36.309 53.9456C36.2562 54.2833 36.3345 54.6674 36.5439 55.0981L38.6828 59.5065L37.12 61.7011ZM34.5438 52.8997L36.284 50.4559L32.7507 47.9399L31.0105 50.3836C29.976 51.8364 30.0451 52.9802 31.2176 53.8152C32.4006 54.6576 33.5093 54.3524 34.5438 52.8997Z" fill="black"/>
<path d="M61.6745 37.5046C60.4957 38.2621 59.3315 38.6772 58.1818 38.7498C57.036 38.8047 55.9591 38.5428 54.9512 37.964C53.9363 37.3745 53.0467 36.485 52.2822 35.2954C51.5177 34.1059 51.0816 32.9325 50.9738 31.7752C50.8661 30.6179 51.0786 29.5348 51.6115 28.5261C52.1482 27.4998 53.0059 26.6078 54.1848 25.8502C54.9456 25.3613 55.7394 25.0177 56.5661 24.8196C57.4035 24.6146 58.183 24.5906 58.9048 24.7476L59.2834 26.8211C58.5394 26.7238 57.857 26.7459 57.2363 26.8874C56.6086 27.0182 56.0055 27.2696 55.4268 27.6415C54.2801 28.3784 53.6305 29.288 53.4781 30.3702C53.3187 31.4418 53.6488 32.6152 54.4684 33.8905C55.2879 35.1657 56.2216 35.9588 57.2694 36.2697C58.3172 36.5806 59.4145 36.3676 60.5611 35.6307C61.1398 35.2588 61.6225 34.8199 62.0091 34.314C62.3888 33.7974 62.6889 33.1805 62.9094 32.4634L64.6383 33.6691C64.4744 34.3802 64.1288 35.0793 63.6013 35.7666C63.0777 36.4362 62.4354 37.0156 61.6745 37.5046Z" fill="black"/>
<path d="M67.99 33.7001L62.9832 21.1938L68.4115 19.0206C69.7834 18.4714 70.9791 18.3906 71.9988 18.7783C73.0184 19.1659 73.7745 19.9747 74.2669 21.2046C74.7593 22.4346 74.7726 23.5476 74.3069 24.5436C73.8364 25.5278 72.9153 26.2945 71.5434 26.8437L68.3858 28.1078L70.2607 32.7911L67.99 33.7001ZM67.6685 26.3162L70.4713 25.1941C72.1034 24.5407 72.6353 23.5044 72.0672 22.0853C71.5038 20.6779 70.406 20.301 68.774 20.9543L65.9712 22.0764L67.6685 26.3162Z" fill="black"/>
<path d="M78.6371 29.3999L82.073 15.0184L84.0431 14.6387L92.5779 26.713L90.1388 27.1832L88.2359 24.3779L81.7814 25.6219L81.0762 28.9298L78.6371 29.3999ZM83.5326 17.4421L82.2382 23.549L87.0415 22.6232L83.5701 17.4348L83.5326 17.4421Z" fill="black"/>
<path d="M98.834 26.9426C97.7129 26.9426 96.7193 26.8025 95.8531 26.5222C94.9868 26.2292 94.2352 25.828 93.5983 25.3184L94.3626 23.4649C94.9231 23.9235 95.5537 24.2738 96.2543 24.5159C96.955 24.7452 97.7512 24.8598 98.6429 24.8598C99.7002 24.8598 100.477 24.6878 100.974 24.3439C101.484 23.9999 101.738 23.4776 101.738 22.777C101.738 21.5159 100.898 20.8853 99.2161 20.8853H95.9486V18.9554H98.8913C100.56 18.9554 101.394 18.3375 101.394 17.1019C101.394 16.5031 101.172 16.0318 100.726 15.6878C100.293 15.3311 99.6047 15.1528 98.662 15.1528C97.9231 15.1528 97.2034 15.2675 96.5027 15.4968C95.8148 15.7261 95.197 16.0636 94.6492 16.5095L93.8849 14.6751C94.4836 14.1655 95.2225 13.777 96.1015 13.5095C96.9932 13.2292 97.9359 13.0891 98.9295 13.0891C100.56 13.0891 101.783 13.4331 102.598 14.121C103.414 14.7961 103.821 15.6815 103.821 16.777C103.821 17.5031 103.63 18.1273 103.248 18.6496C102.879 19.1719 102.375 19.5541 101.738 19.7961C102.49 20.0127 103.076 20.3948 103.496 20.9426C103.929 21.4776 104.146 22.1592 104.146 22.9872C104.146 24.1847 103.713 25.1464 102.847 25.8726C101.98 26.5859 100.643 26.9426 98.834 26.9426Z" fill="black"/>
<path d="M110.17 27.519L112.985 23.9167L109.061 13.5859L111.631 14.0814L114.538 21.9196L119.474 15.593L121.951 16.0703L112.665 28L110.17 27.519Z" fill="black"/>
<path d="M133.774 35.2732L141.058 23.9404L150.911 30.2731L143.628 41.6059L141.571 40.2836L147.748 30.6708L142.01 26.9827L135.832 36.5955L133.774 35.2732Z" fill="black"/>
<path d="M149.332 47.1363C148.391 46.2396 147.764 45.2454 147.45 44.1536C147.145 43.0707 147.155 41.9712 147.479 40.8552C147.813 39.7299 148.463 38.6603 149.43 37.6461C150.406 36.6227 151.444 35.9223 152.543 35.5447C153.642 35.1671 154.736 35.1096 155.823 35.372C156.919 35.6252 157.942 36.2046 158.892 37.11C159.841 38.0155 160.469 39.0097 160.774 40.0927C161.088 41.1664 161.082 42.2613 160.758 43.3773C160.433 44.4933 159.787 45.5584 158.82 46.5725C157.844 47.5959 156.802 48.301 155.694 48.6878C154.595 49.0654 153.497 49.1275 152.401 48.8743C151.304 48.6211 150.281 48.0417 149.332 47.1363ZM150.782 45.6151C151.677 46.4678 152.667 46.8226 153.754 46.6796C154.841 46.5366 155.907 45.9165 156.953 44.8194C158.008 43.7131 158.577 42.6183 158.659 41.5351C158.751 40.4607 158.345 39.4928 157.441 38.6313C156.547 37.7786 155.561 37.4191 154.483 37.5529C153.405 37.6867 152.338 38.3067 151.283 39.4131C150.237 40.5102 149.669 41.605 149.578 42.6974C149.486 43.7898 149.888 44.7624 150.782 45.6151Z" fill="black"/>
<path d="M158.977 58.5616C158.164 57.4202 157.694 56.277 157.567 55.1321C157.457 53.9902 157.668 52.9021 158.198 51.8677C158.738 50.826 159.584 49.895 160.736 49.0748C161.888 48.2546 163.039 47.7632 164.19 47.6004C165.341 47.4377 166.433 47.5985 167.466 48.0828C168.517 48.57 169.448 49.3844 170.261 50.5258C170.786 51.2626 171.167 52.0391 171.404 52.8554C171.649 53.6821 171.71 54.4596 171.587 55.188L169.534 55.6648C169.596 54.9171 169.541 54.2366 169.37 53.6232C169.21 53.0025 168.93 52.412 168.531 51.8516C167.741 50.7413 166.801 50.1358 165.713 50.035C164.635 49.9268 163.479 50.3124 162.244 51.1917C161.009 52.071 160.261 53.0414 160 54.1028C159.74 55.1642 160.005 56.25 160.795 57.3603C161.194 57.9207 161.656 58.3819 162.179 58.744C162.713 59.0987 163.344 59.3691 164.071 59.5553L162.949 61.3396C162.231 61.2097 161.516 60.8977 160.804 60.4035C160.11 59.9123 159.501 59.2984 158.977 58.5616Z" fill="black"/>
<path d="M162.545 64.3083L163.697 62.4592C164.175 62.801 164.667 63.0663 165.173 63.2552C165.697 63.4503 166.278 63.5421 166.917 63.5304C167.572 63.525 168.326 63.3977 169.179 63.1485C170.037 62.9108 171.033 62.5326 172.169 62.014L175.889 60.3153L179.842 68.9713L167.588 74.5675L166.572 72.3427L176.966 67.5958L174.965 63.2157L172.532 64.327C170.968 65.0414 169.572 65.4967 168.345 65.6928C167.135 65.8953 166.059 65.8687 165.116 65.6132C164.173 65.3576 163.316 64.9226 162.545 64.3083Z" fill="black"/>
<path d="M168.644 78.2741L181.736 75.0981L183.848 83.8073L181.954 84.2668L180.396 77.8417L176.793 78.7156L178.253 84.7322L176.359 85.1917L174.899 79.1751L171.092 80.0986L172.651 86.5237L170.757 86.9832L168.644 78.2741Z" fill="black"/>
<path d="M170.698 109.076C170.858 107.966 171.138 107.002 171.539 106.185C171.952 105.369 172.456 104.682 173.051 104.124L174.777 105.145C174.243 105.634 173.807 106.209 173.468 106.868C173.141 107.529 172.914 108.3 172.787 109.183C172.637 110.229 172.696 111.023 172.966 111.564C173.234 112.117 173.715 112.444 174.408 112.543C175.657 112.723 176.4 111.98 176.64 110.316L177.105 107.082L179.015 107.356L178.596 110.269C178.359 111.921 178.852 112.835 180.075 113.011C180.667 113.096 181.166 112.942 181.569 112.55C181.984 112.172 182.259 111.516 182.393 110.583C182.498 109.852 182.487 109.123 182.36 108.397C182.231 107.684 181.984 107.024 181.621 106.418L183.545 105.923C183.965 106.588 184.244 107.375 184.384 108.283C184.534 109.205 184.539 110.158 184.397 111.142C184.165 112.756 183.651 113.917 182.854 114.626C182.07 115.337 181.135 115.615 180.051 115.459C179.332 115.356 178.741 115.078 178.279 114.625C177.814 114.185 177.508 113.632 177.359 112.968C177.038 113.681 176.576 114.206 175.974 114.544C175.383 114.897 174.677 115.014 173.858 114.897C172.672 114.726 171.782 114.161 171.187 113.2C170.604 112.241 170.441 110.866 170.698 109.076Z" fill="black"/>
<path d="M169.931 116.005L180.668 126.171L180.011 128.067L165.287 129.421L166.1 127.074L169.481 126.828L171.63 120.617L169.118 118.352L169.931 116.005ZM177.839 126.223L173.197 122.049L171.597 126.671L177.826 126.259L177.839 126.223Z" fill="black"/>
<path d="M165.102 129.667L176.768 136.402L175.746 138.173L165.729 137.906L170.978 146.431L169.975 148.168L158.309 141.432L159.417 139.513L167.277 144.051L163.117 137.192L163.834 135.951L171.821 136.105L163.993 131.586L165.102 129.667Z" fill="black"/>
<path d="M156.446 143.501L166.627 152.323L160.758 159.096L159.285 157.819L163.615 152.823L160.813 150.395L156.759 155.074L155.286 153.798L159.34 149.119L156.38 146.554L152.05 151.55L150.577 150.274L156.446 143.501Z" fill="black"/>
<path d="M147.722 152.949L156.05 163.538L151.454 167.153C150.292 168.066 149.167 168.481 148.08 168.396C146.992 168.311 146.039 167.748 145.22 166.707C144.401 165.666 144.075 164.601 144.241 163.514C144.415 162.438 145.083 161.442 146.244 160.529L148.918 158.426L145.8 154.461L147.722 152.949ZM150.111 159.943L147.738 161.81C146.356 162.896 146.138 164.041 147.083 165.242C148.02 166.434 149.179 166.486 150.561 165.4L152.934 163.533L150.111 159.943Z" fill="black"/>
<path d="M138.718 160.075L139.473 174.842L137.689 175.761L126.098 166.581L128.306 165.442L130.923 167.598L136.765 164.586L136.51 161.213L138.718 160.075ZM137.389 172.928L136.911 166.704L132.563 168.945L137.355 172.945L137.389 172.928Z" fill="black"/>
<circle cx="114.013" cy="176.433" r="4.4586" fill="#8D0300"/>
</svg>
</div>
Автор решения: UModeL
→ Ссылка
В метках вопроса нет упоминания о скриптах... и это правильно! Задачу можно решить используя средства самого же SVG. Например, animateTransform :
body { background-color: #ddd; }
<div class='billbord-3dIcon'>
<svg width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<g>
<path fill="#fff" d="M74.4 120.4 c-3 0-6-.4-8.8-1.2-2.8-.9-5-2-6.7-3.4 l3.4-8.3 a20 20 0 0 0 11.7 3.7 c4.4 0 6.6-1.5 6.6-4.5 0-2.8-2-4.2-6-4.2 h-7.4 v-9 h6.4 c1.7 0 3.1-.3 4-1 1.1-.8 1.6-1.8 1.6-3.2 0-2.7-1.9-4.1-5.7-4.1-3.8 0-7.3 1.2-10.5 3.7 l-3.5-8.2 c1.9-1.5 4.1-2.6 6.8-3.5 2.6-.8 5.4-1.2 8.3-1.2 4.8 0 8.6 1 11.3 3.1 2.7 2.1 4 5 4 8.7 a9.5 9.5 0 0 1-6.2 9.5 c2.4.7 4.2 2 5.5 3.8 1.4 1.8 2 4 2 6.7 0 3.9-1.4 7-4.5 9.3-3 2.2-7 3.3-12.3 3.3 Z M97.9 119.7 v-43 h17.9 c7.4 0 13.2 1.8 17.3 5.6 4.1 3.7 6.2 9 6.2 15.9 0 6.8-2 12.1-6.2 16-4 3.7-9.9 5.5-17.3 5.5 H97.9 Z m11.3-9 h5.8 c4.3 0 7.5-1 9.5-3.1 s3.1-5.2 3.1-9.4-1-7.4-3.1-9.4 c-2-2-5.2-3-9.5-3 h-5.8 v24.8 Z" />
<path id="circlePath" stroke-width="40" stroke="#fff" fill="#fff0" d="M 100 180 A 80 80 0 0 1 100 20 A 80 80 0 0 1 100 180 Z" />
<text fill="#000">
<textPath href="#circlePath" dominant-baseline="middle" text-anchor="middle" startOffset="50%" style="font: bold 20px 'Arial'; text-transform: uppercase; letter-spacing: 1px; word-spacing: .5em;">Визуализация сразу после замера</textPath>
</text>
<circle cx="100" cy="180" r="4.5" fill="#8D0300" />
<animateTransform attributeName="transform" type="rotate" values="0 100 100;180 100 100;0 100 100" dur="5s" calcMode="spline" keySplines="0.4 0 0.4 1; 0.4 0 0.4 1" repeatCount="1" begin="mouseenter" restart="whenNotActive" />
</g>
</svg>
</div>