#angular #svg
#angular #svg
Вопрос:
Я работаю над приложением Angular, которое использует ряд SVG-изображений на разных страницах. У меня возникла проблема, когда эти изображения не всегда отображаются в правильных цветах при их просмотре в Safari. Изображения выглядят нормально, если я загружаю страницу, на которой изначально были изображения, но при переходе с одной страницы на другую некоторые изображения отображаются неправильными цветами. Смотрите пример ниже:
Кажется, это происходит только в Safari. Я использую версию Safari 12.0.3. iMac, который я использую, довольно старый и в основном используется только для тестирования нашего программного обеспечения в IOS, поэтому не уверен, что это может повлиять на то, что я вижу.
Вот как SVG отображается в моем коде. Я добавляю его в качестве значка-мата через Angular framework:
<mat-icon _ngcontent-lvp-c20="" class="vectorImage fade-in mat-icon notranslate mat-icon-no-color" id="vector4" role="img" svgicon="vector4" aria-hidden="true" ng-reflect-ng-style.gt-sm="[object Object]" ng-reflect-svg-icon="vector4" style="bottom: 100px;"><svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1730.4 595.28" fit="" height="100%" width="100%" preserveAspectRatio="xMidYMid meet" focusable="false"><defs><style>.cls-1{fill:#0d113a;}.cls-2{fill:#f7f7f7;}.cls-3{fill:#a3b2c9;}.cls-4{fill:#ebcfb1;}.cls-5{fill:#3b4559;}.cls-6{fill:#eac4b0;}.cls-7{fill:#ea1e30;}.cls-8{fill:#d6e8f4;}.cls-9{fill:#616c78;}.cls-10{fill:#deedf1;}.cls-11{fill:#e6e6e5;}.cls-12{fill:#363d52;}.cls-13{fill:#363940;}.cls-14{fill:#dedede;}.cls-15{fill:#5d7abc;}.cls-16{fill:#c48270;}.cls-17{clip-path:url(#clip-path);}.cls-18{fill:#fff;}.cls-19{fill:#bdbfbf;}.cls-20{fill:#e1e1e0;}.cls-21{fill:#333d4f;}.cls-22{fill:#575759;}.cls-23{fill:url(#linear-gradient);}.cls-24{fill:url(#linear-gradient-2);}.cls-25{fill:#ac202d;} </style><clipPath id="clip-path"><path class="cls-1" d="M1296.09,226.2s-31.79,40.57-47.69,50.44h0a4,4,0,0,0-2.44,1.68,9.1,9.1,0,0,0-1.29,3.53,36,36,0,0,0-.7,6.54,11.8,11.8,0,0,0,.88,5.34,5.11,5.11,0,0,0,4.2,3.06c2.45.06,3.52-2.28,4-5.25,8.47-5.79,31.43-21.68,33.22-25,2.19-4.13,13.7-40.31,13.7-40.31Z"></path></clipPath><linearGradient id="linear-gradient" x1="1114.69" y1="270.62" x2="1237.38" y2="270.62" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1d3557"></stop><stop offset="0.01" stop-color="#1d3557"></stop><stop offset="0.39" stop-color="#14253c"></stop><stop offset="0.75" stop-color="#0d1929"></stop><stop offset="1" stop-color="#0b1522"></stop></linearGradient><linearGradient id="linear-gradient-2" x1="494.25" y1="267.88" x2="557.74" y2="267.88" xlink:href="#linear-gradient"></linearGradient></defs><path class="cls-2" d="M1462.42,440.45H1232l17.92,36.34-17.19,5.1-35.48-41.44H1148.3l-4.8,40.18h-17.31l-9.11-40.18H452.91c-34.31,0-62.38,7.62-62.38,16.94,0,6.46,13.46,12.1,33.14,15H355.2c-34.32,0-62.39,7.63-62.39,16.95s28.07,16.94,62.39,16.94h6.22c-9.29,3-14.93,6.79-14.93,11V524c0,9.32,28.07,16.94,62.39,16.94h993.35c34.32,0,62.39-7.62,62.39-16.94v-6.78c0-8.62-24-15.79-54.75-16.82a60.56,60.56,0,0,0,15.55-3.32c10.57-4.18,11-10.55,5.87-15.82-3.35-3.41-8.72-6.12-22-7.14l53.15.23c34.31,0,62.39-7.62,62.39-16.95s-28.08-16.94-62.39-16.94"></path><polygon class="cls-3" points="548.01 310.47 558.42 334.47 559.4 402 580.8 474.63 570.85 479.04 527.18 394.71 522.21 368 520.24 311.74 548.01 310.47"></polygon><polygon class="cls-3" points="497.62 315.85 496.8 386.62 510.14 477.86 520.39 477.86 526.87 393.67 540.9 309.48 497.62 315.85"></polygon><polygon class="cls-1" points="494.48 243.25 473.68 222.93 465.75 232.32 487.01 264.61 494.92 267.17 528.63 240.29 519.61 221.88 494.48 243.25"></polygon><path class="cls-1" d="M569.77,270.47C561.35,233.32,545.05,219,545.05,219l-27.24,1-16.4,56.79-18.28,74.69c12,1.51,85,11.25,85,11.25S578.34,308.3,569.77,270.47Z"></path><path class="cls-2" d="M525.33,223.4,496.69,337.93l-2.34,15,35.67,4.7s-1.41-54.85-.94-62.16,5.76-23.13,6.57-40.17c.47-9.86,3.61-27.57,1.41-33.33Z"></path><polygon class="cls-4" points="1406.21 156.3 1404.72 145.28 1409.4 144.45 1412.09 151.77 1414.12 150.34 1414.24 159.92 1409.49 161.45 1406.21 156.3"></polygon><polygon class="cls-3" points="1476.09 214.37 1434.17 202.87 1415.29 156.67 1406.02 160.18 1416.22 219.67 1464.35 245.27 1476.09 214.37"></polygon><rect class="cls-1" x="1468.1" y="326.48" height="14.78"></rect><polygon class="cls-1" points="1431.16 320.3 1422.06 369.06 1421.31 392.98 1441.01 474.24 1453.32 471.78 1448.4 405.29 1468.1 341.26 1468.1 326.49 1431.16 320.3"></polygon><polygon class="cls-1" points="1499.26 331.67 1452.47 343.98 1472.27 479.42 1481.26 479.42 1486.94 405.54 1499.26 331.67"></polygon><polygon class="cls-5" points="1443.05 475.93 1433.65 485.88 1436.36 490.92 1455.76 481.61 1452.18 474.24 1443.05 475.93"></polygon><polygon class="cls-5" points="1472.43 482.58 1460.85 489.86 1462.21 495.42 1483.32 491.25 1481.7 483.23 1472.43 482.58"></polygon><path class="cls-6" d="M1441,178.41c8,.59,15.44-6,23.29-4.34,5.11,1.06,9.14,5.59,10.7,10.69a12.69,12.69,0,0,1,.27,7.34,12.19,12.19,0,0,1-2.31,4.15,17.3,17.3,0,0,1-4.8,4.06,31.46,31.46,0,0,0,3.42,4.53l-11,4.23-2.44-6.34a16.67,16.67,0,0,1-3.29-.5,19.08,19.08,0,0,1-13.41-14.17,37.09,37.09,0,0,1-.39-9.65"></path><polygon points="1442.96 180.82 1467.64 177.89 1472.43 196.74 1479.4 191.21 1475.81 160.36 1440.98 159.61 1425.9 168.46 1426.54 177.32 1440.02 186.4 1442.96 180.82"></polygon><path class="cls-3" d="M1452.54,212l29.31-11.63s13.69,28.93,25.53,70.38-3.82,99-3.82,99-81.73-16.69-95.14-19.32l26.45-82.89Z"></path><path class="cls-7" d="M1456.69,123.5l-9-10.93-.3,0c-.44-1.26-.87-2.53-1.31-3.79l-6.87-20c-2-5.87-3.28-15.65-10.76-16.59l-71.14-8.9a20.55,20.55,0,0,0-20,10l-15.07,24.68-1.19-.14-24.77,4.53a24.57,24.57,0,0,0-16.41,20.19l-1.75,14,180.63,22.6,2.49-19.91a20.63,20.63,0,0,0-4.53-15.64"></path><path class="cls-8" d="M1388.68,103.14l47.46,5.94-7.46-27.9a3.43,3.43,0,0,0-2.86-2.57l-33.55-4.2Z"></path><path class="cls-8" d="M1384.15,73.4,1357,70a15,15,0,0,0-14.6,7.28L1331,95.93l49.58,6.2Z"></path><path class="cls-9" d="M1427.75,79.56a3.55,3.55,0,0,1,.93,1.62l2.06,7.69.21.15-2-7.63a3.59,3.59,0,0,0-1.16-1.83"></path><path class="cls-10" d="M1414.42,77.36c4.9,3.5,9.85,6.93,14.76,10.41l1.56,1.1-2.06-7.69a3.55,3.55,0,0,0-.93-1.62,3.31,3.31,0,0,0-1.71-.74Z"></path><path class="cls-9" d="M1432.85,96.77l3.23,12.08.08.05-3.23-12.07-.08-.06"></path><path class="cls-10" d="M1393.76,74.78c6.67,7.34,15.4,14.22,23.1,20.39,4.63,3.71,9.38,7.26,14.29,10.59,1.58,1.08,3.25,2.08,4.93,3.1l-3.23-12.09q-1.77-1.29-3.54-2.55c-8.12-5.8-16.62-12.3-24.63-18.25Z"></path><polygon class="cls-9" points="1371.29 100.97 1371.3 100.97 1380.56 102.13 1371.29 100.97"></polygon><path class="cls-10" d="M1348.08,71.76a15.65,15.65,0,0,0-5.72,5.52l-.11.18c3.75,3.38,7.52,6.73,11.23,10.13,5.5,5,11.74,9.09,17.81,13.38l9.27,1.16.65-5.21c-2.59-2.47-5-5.1-7.77-7.4-3.36-2.83-6.88-5.49-10.44-8.07s-7.26-5.25-11.09-7.52c-1.27-.75-2.55-1.45-3.83-2.17"></path><path class="cls-11" d="M1346.48,145h0Z"></path><path class="cls-12" d="M1329.09,125A16.07,16.07,0,0,1,1341,144.28l5.44.72h.07a12.55,12.55,0,0,0,.55-2.46c1-8.36-6.1-16.13-16-17.37-.66-.08-1.33-.13-2-.15"></path><path class="cls-12" d="M1423,136.77A16.09,16.09,0,0,1,1434.8,156l5.21.69a13.6,13.6,0,0,0,.55-2.47c1-8.36-5.91-16.11-15.54-17.32-.68-.08-1.36-.13-2-.15"></path><path class="cls-13" d="M1341.27,142.58a16,16,0,1,1-13.89-17.87,16,16,0,0,1,13.89,17.87"></path><path class="cls-2" d="M1321.08,148.59a9.09,9.09,0,1,1,12.31-3.69,9.09,9.09,0,0,1-12.31,3.69"></path><path class="cls-14" d="M1320.23,145.19a5.31,5.31,0,0,0,3.5,3.13,8.89,8.89,0,0,0,1.78.26l.76,0a5.86,5.86,0,0,0,.94-.06,5.24,5.24,0,0,0,3.9-2.85,7.22,7.22,0,0,1-4.47,1.39h-.45a14.35,14.35,0,0,1-3.61-.71c-.43-.13-2.16-.68-2.35-1.17"></path><path class="cls-13" d="M1435.1,154.31a16,16,0,1,1-13.89-17.86,16,16,0,0,1,13.89,17.86"></path><path class="cls-2" d="M1414.92,160.32a9.08,9.08,0,1,1,12.3-3.68,9.07,9.07,0,0,1-12.3,3.68"></path><path class="cls-14" d="M1414.06,156.93a5.33,5.33,0,0,0,3.5,3.13,8.21,8.21,0,0,0,1.78.25c.25,0,.51,0,.76,0a7.57,7.57,0,0,0,1-.06,5.26,5.26,0,0,0,3.89-2.85,7.21,7.21,0,0,1-4.46,1.39l-.46,0a14.79,14.79,0,0,1-3.61-.7c-.43-.14-2.16-.68-2.35-1.17"></path><path class="cls-12" d="M1368.28,108.85a1.64,1.64,0,0,0-1.63,1.44l-.06.45a1.66,1.66,0,0,0,1.43,1.84l5.36.67h.21a1.64,1.64,0,0,0,1.63-1.44l.06-.45a1.66,1.66,0,0,0-1.43-1.84l-5.37-.67h-.2"></path><polygon class="cls-4" points="1397.57 161.91 1396.83 150.81 1401.56 150.29 1403.75 157.78 1405.87 156.49 1405.35 166.06 1400.5 167.27 1397.57 161.91"></polygon><polygon class="cls-3" points="1463.39 224.55 1422.33 210.25 1406.61 162.88 1397.13 165.76 1403.3 225.81 1449.59 254.59 1463.39 224.55"></polygon><path class="cls-15" d="M1361.5,274.9a5.12,5.12,0,0,1,4.47,2.64,11.81,11.81,0,0,1,1.38,5.24,36.16,36.16,0,0,1-.07,6.58,9.22,9.22,0,0,1-1,3.63,3.75,3.75,0,0,1-3,2,5.8,5.8,0,0,1-2.47-.71,3.22,3.22,0,0,1-1.46-1.07,3.27,3.27,0,0,1-.35-1.49c-.22-3.52-3.29-16.46,2.46-16.85"></path><path class="cls-6" d="M1365.28,279a3.67,3.67,0,0,0-.36-.6,5.14,5.14,0,0,0-1.92-1.7s-2.4-.53-1.79.1l1.27,1.32-5.39-.09-3.42,2.73.31,5.81,4,4.54c3.23-.52,6.84-.34,7.87-4.16a12.49,12.49,0,0,0,.25-3.51,10.36,10.36,0,0,0-.77-4.44"></path><path class="cls-16" d="M1321.23,213.5l10.41-.45a51.13,51.13,0,0,0-.1-8.3c0,.33,5.59-2.59,6.08-3.26,1.41-1.91,1.58-5.12,2.16-7.4,1.26-4.84,2.44-10.3-.12-14.6-2.66-4.46-8.39-6-13.58-6.12-6.5-.17-13.77,1.73-17.11,7.31-3,5,.79,12.48,1.88,17.82.53,2.63,1.35,5.63,3.79,6.74,1.3.59,2.87.52,4,1.35,2,1.47,1.58,4.6,2.56,6.91"></path><path d="M1298.71,171q-.57-5.39-1.16-10.79a9.4,9.4,0,0,1,.15-4c.72-2.12,2.87-3.44,5-4s4.42-.61,6.61-1.09,4.59-1.55,7-1.44c4.53.2,8,4.4,12.48,5.11,6.2,1,11.89-1.84,15.63,5.45.69,1.34.88,2.89,1.49,4.27.78,1.78,2.21,3.18,3.32,4.78,4.91,7,3.32,17.66-2.62,23.61-2.88,2.88-4.06,5.49-8,6.41,1.82-3.69-.58-18.41-5.56-20.07-1.32-.43-5.28,1.18-6.74,1.39a38.76,38.76,0,0,0-9.42,2.26,47.36,47.36,0,0,1-14.3,3.56,2.41,2.41,0,0,1-1.8-.35,2.47,2.47,0,0,1-.6-1.62q-.72-6.73-1.45-13.47"></path><path class="cls-1" d="M1296.09,226.2s-31.79,40.57-47.69,50.44h0a4,4,0,0,0-2.44,1.68,9.1,9.1,0,0,0-1.29,3.53,36,36,0,0,0-.7,6.54,11.8,11.8,0,0,0,.88,5.34,5.11,5.11,0,0,0,4.2,3.06c2.45.06,3.52-2.28,4-5.25,8.47-5.79,31.43-21.68,33.22-25,2.19-4.13,13.7-40.31,13.7-40.31Z"></path><g class="cls-17"><rect class="cls-1" x="1243.94" y="226.2" width="55.99" height="70.66"></rect></g><polygon class="cls-5" points="1376.38 478.83 1377.78 484.69 1367.45 493.34 1360.19 488.88 1364.65 481.62 1374.98 472.96 1376.38 478.83"></polygon><polygon class="cls-5" points="1352.67 297.45 1356.91 315.26 1351.54 398.07 1376.55 476.79 1365.47 481.89 1315.36 391.01 1309.41 361.98 1306.38 300.6 1352.67 297.45"></polygon><polygon class="cls-5" points="1283.26 304.52 1282.37 381.44 1296.86 480.63 1308.01 480.63 1315.05 389.11 1330.31 297.59 1283.26 304.52"></polygon><polygon class="cls-5" points="1307.95 479.3 1307.95 485.33 1295.89 491.36 1289.87 485.33 1295.89 479.3 1307.95 479.3"></polygon><path class="cls-1" d="M1314.86,210a17.46,17.46,0,0,0-6.07.9c-5.64,2.26-10.32,9.77-13,14.91-3.35,6.56-5.61,13.61-8.08,20.53-3.57,10-7.78,19.69-11.47,29.65a157.44,157.44,0,0,1-9.23,21.4c-1.67,3.3-3.32,7-5.64,9.88-2.08,2.6-2.9,5.7-4,8.83a1,1,0,0,0-.08.66.94.94,0,0,0,.44.42,35,35,0,0,0,15.9,5.05c5.46.38,10.45-1.21,15.81-1.66a191,191,0,0,1,19.42-1,152.2,152.2,0,0,1,24.58,2.53c5.4,1,10.91,2.33,15.73,4.91,4.6,2.46,7.89,6,12.56,8.59a2.39,2.39,0,0,0,1.43.42c2.69-.34,2.91-9.8,2.76-16.82-.07-3.34-.23-6.12-.25-7.11-.15-8.95-.85-17.88-1.89-26.77-.92-8-2.11-15.9-3.39-23.83A149.33,149.33,0,0,0,1346.68,218c-1.54-3-3.3-6.31-6.4-7.71a12.14,12.14,0,0,0-5-.85c-.56,0-1.11,0-1.66,0Z"></path><path class="cls-1" d="M1257.3,316.76a.94.94,0,0,0,.44.42,35,35,0,0,0,15.9,5.05c5.46.38,10.45-1.21,15.81-1.66a191,191,0,0,1,19.42-1,152.2,152.2,0,0,1,24.58,2.53c5.4,1,10.91,2.33,15.73,4.91,4.6,2.46,7.89,6,12.56,8.59a2.39,2.39,0,0,0,1.43.42c2.69-.34,2.91-9.8,2.76-16.82-.07-3.34-.23-6.12-.25-7.11-.15-8.95-.85-17.88-1.89-26.77-.92-8-2.11-15.9-3.39-23.83A149.33,149.33,0,0,0,1346.68,218c-1.54-3-3.3-6.31-6.4-7.71a12.14,12.14,0,0,0-5-.85c-.56,0-1.11,0-1.66,0l-18.71.53a17.46,17.46,0,0,0-6.07.9c-5.64,2.26-10.32,9.77-13,14.91-3.35,6.56-5.61,13.61-8.08,20.53-3.57,10-7.78,19.69-11.47,29.65a157.44,157.44,0,0,1-9.23,21.4c-1.67,3.3-3.32,7-5.64,9.88-2.08,2.6-2.9,5.7-4,8.83A1,1,0,0,0,1257.3,316.76Z"></path><path class="cls-18" d="M1324.32,244a51.41,51.41,0,0,0,.77,10.57q4.59,32,9.19,64.08l-50.24-.44q.92-12,1.82-24a112.49,112.49,0,0,1,1.87-15.31c1.74-8.12,5.25-15.76,8.73-23.34l19.29-42a5.49,5.49,0,0,1,1.34-2.06,5.64,5.64,0,0,1,2.78-1c4.79-.83,10.2-1.53,15-.83,1.2,4.38-3.24,12-4.88,16.07-2.39,5.93-5.25,11.81-5.68,18.27"></path><path class="cls-19" d="M1353.53,349.82H1262a10.89,10.89,0,0,1-10.88-10.89v-61.7A10.88,10.88,0,0,1,1262,266.34h91.56a10.89,10.89,0,0,1,10.89,10.89v61.7a10.9,10.9,0,0,1-10.89,10.89"></path><path class="cls-19" d="M1332.57,261.8v-16a2.93,2.93,0,0,0-3.06-2.67h-44.13a2.93,2.93,0,0,0-3.06,2.67v16a4.58,4.58,0,0,0-4.45,4.58h15a4.59,4.59,0,0,0-4.41-4.58V248.47h38v13.29h-.31a4.58,4.58,0,0,0-4.58,4.58h15a4.59,4.59,0,0,0-4-4.54"></path><path class="cls-20" d="M1364.42,335h0v3.92a10.89,10.89,0,0,1-9.75,10.83v.07a10.78,10.78,0,0,0,9.75-10.73Zm-113.55,6.31c0,4.13,3.56,8.56,7.7,8.56h24.16v-.06H1262a10.89,10.89,0,0,1-10.31-7.4l-.57,0Z"></path><path class="cls-21" d="M1354.67,349.76a10.74,10.74,0,0,1-1.14.06H1321.6v.06h32a8.94,8.94,0,0,0,1-.05Z"></path><polygon class="cls-21" points="1282.73 349.82 1282.73 349.88 1321.59 349.88 1321.6 349.82 1282.73 349.82"></polygon><path class="cls-22" d="M1364.42,323.14a46.14,46.14,0,0,1-9.65,10.18,36.81,36.81,0,0,1-12.89,6.15,136.08,136.08,0,0,1-19.74,3.54,214,214,0,0,1-23.18,1.14c-15.76,0-31.54-1.25-47.3-1.73a10.89,10.89,0,0,0,10.31,7.4h91.56a10.74,10.74,0,0,0,1.14-.06,10.89,10.89,0,0,0,9.75-10.83V323.14Z"></path><path class="cls-18" d="M1334,299.69h-20.14V279.55a1.4,1.4,0,0,0-1.38-1.38h-11.44a1.4,1.4,0,0,0-1.38,1.38v20.14h-20.13a1.4,1.4,0,0,0-1.39,1.38v11.44a1.3,1.3,0,0,0,.4,1,1.27,1.27,0,0,0,1,.41h20.13V334a1.4,1.4,0,0,0,1.38,1.38h11.44a1.38,1.38,0,0,0,1.38-1.38V313.89H1334a1.4,1.4,0,0,0,1.38-1.38V301.07a1.4,1.4,0,0,0-1.38-1.38"></path><path class="cls-16" d="M1245.67,292.07a5.38,5.38,0,0,0,.31.64,4.92,4.92,0,0,0,1.75,1.87s2.34.76,1.79.07l-1.13-1.44,5.35.61,3.66-2.4.24-5.81-3.5-4.89c-3.27.21-6.84-.32-8.22,3.39a12.62,12.62,0,0,0-.59,3.47,10.39,10.39,0,0,0,.34,4.49"></path><polygon class="cls-16" points="1271 232.53 1279.4 226.79 1277.11 223.09 1270.48 225.75 1270.2 223.49 1263.61 229.28 1265.48 233.45 1271 232.53"></polygon><path class="cls-1" d="M1214.07,243c-3.24-1.11-4.76-13.8-7.48-15.72-.8-.56-1.8,1.39-2.83,3.34s-2,3.65-2.83,3.41a11.81,11.81,0,0,0-5.42,0,20.55,20.55,0,0,0-12.52,8c-1.46,2-3.61,6.34-1.92,8.8,1.34,1.93,2.9,6.81,5.1,7.75,5.46,2.35,21.82,6.8,30.5,6.69,0,0,11.32-6.7,17.57-9.55,2.83-1.29,34.68-19.26,34.23-20.65l-3.29-8.47c0-.09-.19-.14-.44-.14-2.33,0-13.3,4.16-24.46,8.31C1228.3,239.2,1216.09,243.66,1214.07,243Z"></path><path class="cls-1" d="M1181.07,250.8c1.34,1.93,2.9,6.81,5.1,7.75,5.46,2.35,21.82,6.8,30.5,6.69,0,0,11.32-6.7,17.57-9.55,2.83-1.29,34.68-19.26,34.23-20.65l-3.29-8.47c0-.09-.19-.14-.44-.14-2.33,0-13.3,4.16-24.46,8.31-12,4.46-24.19,8.92-26.21,8.24-3.24-1.11-4.76-13.8-7.48-15.72-.8-.56-1.8,1.39-2.83,3.34s-2,3.65-2.83,3.41a11.81,11.81,0,0,0-5.42,0,20.55,20.55,0,0,0-12.52,8C1181.53,244,1179.38,248.34,1181.07,250.8Z"></path><path class="cls-23" d="M1199.68,187.78l-.56,0c-8.94.43-19.75,12.16-26,19.08-16.18,17.87-27.48,38.35-35.94,61.24-4.55,12.33-8.57,24.86-12.34,37.46-1,3.48-8.35,35.31-10.13,35.54,18.19-2.33,36.5-4.14,54.61-2.89s36.13,5.7,51.66,15.26c8-40.86,13.82-83.16,15.75-124.56.23-5,1-10.06.52-15-.54-5.66-3.33-8.22-6.5-12.52a28.89,28.89,0,0,0-3.51-4.18c-6.71-6.15-17.25-9.49-26.36-9.49C1200.46,187.76,1200.07,187.76,1199.68,187.78Z"></path><path class="cls-1" d="M1114.69,341.12c18.19-2.33,36.5-4.14,54.61-2.89s36.13,5.7,51.66,15.26c8-40.86,13.82-83.16,15.75-124.56.23-5,1-10.06.52-15-.54-5.66-3.33-8.22-6.5-12.52a28.89,28.89,0,0,0-3.51-4.18c-6.71-6.15-17.25-9.49-26.36-9.49-.4,0-.79,0-1.18,0l-.56,0c-8.94.43-19.75,12.16-26,19.08-16.18,17.87-27.48,38.35-35.94,61.24-4.55,12.33-8.57,24.86-12.34,37.46C1123.78,309.06,1116.47,340.89,1114.69,341.12Z"></path><polygon class="cls-16" points="1136.23 326.56 1155.16 403.37 1155.58 459.98 1164.77 461.97 1168.36 409.31 1177.38 312.89 1136.23 326.56"></polygon><polygon class="cls-5" points="1164.89 463.56 1166.37 469.3 1165.07 480.56 1157.62 480.58 1154.83 464.29 1155.7 461.57 1164.89 463.56"></polygon><polygon class="cls-16" points="1208.49 318.07 1210.16 384.44 1201.3 478.18 1192.23 478.85 1188.97 392.91 1170.5 315 1208.49 318.07"></polygon><polygon class="cls-5" points="1201.02 476.62 1213.23 483.1 1212.27 488.81 1190.68 486.17 1191.72 477.95 1201.02 476.62"></polygon><polygon class="cls-7" points="1211.15 326.64 1217.3 403.32 1211.04 455.91 1186.47 454.51 1182.09 394.73 1171.47 329.54 1173.12 319.39 1208.53 319.91 1211.15 326.64"></polygon><polygon class="cls-7" points="1173.9 397.74 1171.01 452.74 1149.65 451.64 1150.09 399.48 1136.62 333.98 1139.69 315.67 1175.61 317.9 1173.9 397.74"></polygon><path class="cls-18" d="M1215.61,333c-21.92-3.78-57.43-12.93-79.34-16.71,11.47-38.08,29.72-80.38,51-113.82,3.86-6.07,8.69-12.4,15.59-13.84,7.4-1.54,20.38,3.34,21.82,11.61,2.1,12.12-2.27,28.82-3.61,41.06-3,27.71-.17,64.33-5.46,91.7"></path><path class="cls-16" d="M1211.8,161.87c8.24-14.34,26.5-5,27.69,9.32.77,9.45-8.41,19.85-17.91,20.59q-.28,3.41-.86,6.78l-7.21-2c-.74-.2-1.59-.5-1.83-1.23a2.31,2.31,0,0,1,.11-1.37c.43-1.52.87-3,1.3-4.54l-.48-.35c-3.95-3-5.75-8.27-5.52-13.23s2.23-9.69,4.71-14"></path><path d="M1212.33,166.72c-4,3.82-4.35,9.94-4.61,15.19-.24,4.66-.93,7.44-5.87,6.13-2.79-.74-7.76-2-8.94-5.06-.89-2.31,2.39-6.27,4.12-7.62,1.32-1,3.31-.86,4.61-1.92a5.41,5.41,0,0,0,1.22-1.65,28,28,0,0,0,2.88-7.93,28.57,28.57,0,0,1,1.3-5.59c1.08-2.56,4.32-4.5,6.41-6.27,3.9-3.3,12.75-5.81,16,.07a8.1,8.1,0,0,1,.61,4.48,6.64,6.64,0,0,1-.57,2.65c-1.65,3.23-4.87,2.23-7.71,2.69a18.32,18.32,0,0,0-9.41,4.83"></path><path d="M1235.27,179.77c-1,2.37-3.54,4.27-3.29,6.84a11.3,11.3,0,0,0,1.22,3.21,9.1,9.1,0,0,1-1.09,8.92l14,6.68a4.65,4.65,0,0,0,2.21.63c1.66-.1,2.66-1.83,3.35-3.34,1.36-3,2.76-6.2,2.15-9.41-.28-1.49-1-2.88-1.26-4.37-1.33-7.18,7.27-14,4.64-20.82-1.18-3-4.26-4.84-6.34-7.34-3.63-4.37-4.15-10.78-8-14.91-7.38-7.78-21.85-1.41-20.74,9.4.91,8.81,17.33,15,13.24,24.51"></path><path class="cls-1" d="M1169,304.74c-8.37-23.31,29.53-114.71,29.53-114.71-38.26,16-75.3,149.48-75.3,149.48l58-2.42S1177.33,328.06,1169,304.74Z"></path><path class="cls-1" d="M1123.19,339.51l58-2.42s-3.9-9-12.27-32.35S1198.49,190,1198.49,190C1160.23,206,1123.19,339.51,1123.19,339.51Z"></path><path class="cls-1" d="M467.52,68.77s0-.19-.11-.19a.05.05,0,0,0-.05,0c-.11-.11-.16.17-.16.17-2.7,2.85-22.76,22.24-63.53,14.56,0,0-4.25,73.09,20.18,102.2,26.1,31.08,47.66,40.11,47.76,40,.11.08,21.34-9.93,45.52-42.56,22.63-30.53,14.62-103.14,14.62-103.14C491.46,89.74,470.37,71.47,467.52,68.77Z"></path><path class="cls-1" d="M423.85,185.54c26.1,31.08,47.66,40.11,47.76,40,.11.08,21.34-9.93,45.52-42.56,22.63-30.53,14.62-103.14,14.62-103.14-40.29,9.87-61.38-8.4-64.23-11.1,0,0,0-.19-.11-.19a.05.05,0,0,0-.05,0c-.11-.11-.16.17-.16.17-2.7,2.85-22.76,22.24-63.53,14.56C403.67,83.34,399.42,156.43,423.85,185.54Z"></path><path class="cls-3" d="M526,87.53c-36.56,8.81-55.69-7.45-58.27-9.85,0,0-.06-.25-.15-.15-.1-.09-.15.15-.15.15-2.45,2.55-20.66,19.82-57.65,13,0,0-3.89,65.07,18.27,91,23.66,27.67,43.25,37.43,43.34,37.36s19.34-10.59,41.3-39.65C533.25,152.17,526,87.53,526,87.53"></path><path class="cls-3" d="M467.54,74.14a0,0,0,0,0,0,0,.06.06,0,0,0-.05,0c-.07,0-.1.17-.1.17-2.05,2.13-15.15,14.58-41.06,14.58a91.44,91.44,0,0,1-16.59-1.58s-.25,4.15-.26,10.77l.12,0c.07-4.64.24-7.42.24-7.42a91.34,91.34,0,0,0,16.58,1.58c25.92,0,39-12.45,41.07-14.58,0,0,0-.17.1-.17l.05,0a0,0,0,0,1,0,0c.07,0,.11.17.11.17,2,1.9,14.41,12.45,37.55,12.45A88.32,88.32,0,0,0,526,87.53s.31,2.77.62,7.4l.1,0c-.35-6.61-.82-10.74-.82-10.74a88.27,88.27,0,0,1-20.72,2.59c-23.14,0-35.51-10.54-37.55-12.45,0,0,0-.16-.11-.16"></path><path class="cls-1" d="M505.3,90.13c-23.15,0-35.51-10.55-37.55-12.45,0,0,0-.17-.11-.17a0,0,0,0,0,0,0l-.05,0c-.07,0-.1.17-.1.17-2.05,2.13-15.15,14.58-41.07,14.58a91.34,91.34,0,0,1-16.58-1.58s-.17,2.78-.24,7.42a94.69,94.69,0,0,0,15,1.25c27.14,0,40.86-13,43-15.27,0,0,0-.18.11-.18l0,0,.05,0c.07,0,.11.17.11.17,2.14,2,15.1,13,39.33,13a91,91,0,0,0,19.39-2.18c-.31-4.63-.62-7.4-.62-7.4A88.32,88.32,0,0,1,505.3,90.13Z"></path><path class="cls-1" d="M409.8,90.68s-.17,2.78-.24,7.42a94.69,94.69,0,0,0,15,1.25c27.14,0,40.86-13,43-15.27,0,0,0-.18.11-.18l0,0,.05,0c.07,0,.11.17.11.17,2.14,2,15.1,13,39.33,13a91,91,0,0,0,19.39-2.18c-.31-4.63-.62-7.4-.62-7.4a88.32,88.32,0,0,1-20.72,2.6c-23.15,0-35.51-10.55-37.55-12.45,0,0,0-.17-.11-.17a0,0,0,0,0,0,0l-.05,0c-.07,0-.1.17-.1.17-2.05,2.13-15.15,14.58-41.07,14.58A91.34,91.34,0,0,1,409.8,90.68Z"></path><path class="cls-19" d="M515.61,105.87c-27.62,6.77-45.41-6.34-47.36-8.19,0,0,0-.19-.12-.11-.07-.08-.1.11-.1.11-1.86,2-18.73,16-46.68,10.71,0,0,.21,49.39,17,69.34,17.89,21.32,32.67,27.51,32.74,27.45s14.63-6.81,31.21-29.18c15.51-20.93,13.35-70.13,13.35-70.13"></path><polygon class="cls-16" points="474.1 227.94 469.69 223.78 469.62 218.44 468.48 217.88 467.74 219.26 466.41 214.84 463.29 212.77 458.64 214.54 455.96 218.94 458.21 223.37 463.17 226.6 468.95 232.56 474.1 227.94"></polygon><polygon class="cls-5" points="580.63 476.49 581.81 481.89 572.48 489.58 566.05 485.32 570.13 478.78 579.46 471.09 580.63 476.49"></polygon><polygon class="cls-5" points="520.33 476.64 520.33 482.18 509.25 487.73 503.7 482.18 509.25 476.64 520.33 476.64"></polygon><path class="cls-16" d="M527.58,222.81l9.54-.93a48.54,48.54,0,0,0-.51-7.62c2.65-.93,5.72-2.32,6.18-5.1a7.78,7.78,0,0,0-.15-2.63l-1.85-10.82a9.71,9.71,0,0,0-1.12-3.6c-1.19-1.88-3.5-2.7-5.68-3.08-5.59-1-11.67.22-16,3.87a8.6,8.6,0,0,0-2.71,3.56c-.79,2.19-.2,4.6.38,6.85.54,2.08,1.09,4.16,1.63,6.23.62,2.39,1.52,5.11,3.82,6,1.22.47,2.67.34,3.77,1,2,1.24,1.68,4.14,2.7,6.22"></path><path d="M496.5,186.77a31.06,31.06,0,0,1,.78-7.23c.85-3.87,5.42-5.61,9.37-5.89,8.55-.59,16.79-4.46,25.14-1.47,4.77,1.7,11.17,2.11,15.49,4.52a12.78,12.78,0,0,1,4.36,4.32,19.18,19.18,0,0,1,0,20.3,27,27,0,0,1-3,3.76c-2.25,2.44-4.95,5.45-8,6.35-.07-2.77,2.47-11.5.34-13.77-3.37-3.61-11-2.37-15.19-1.48-4.57,1-8.65,4.19-13.18,4.87-3.26.5-7.42-1.11-10.19-2.8-4.34-2.64-5.79-7-5.9-11.48"></path><polygon class="cls-16" points="499.68 284.54 493.3 286.56 488.1 283.75 486.95 284.55 487.87 286.01 482.9 284.92 479.22 286.81 478.42 292.26 481.24 297.2 486.73 297.42 492.51 294.37 501.37 291.99 499.68 284.54"></polygon><path class="cls-24" d="M552,293c7.24-1.57,5.62-22.94,5.58-27.87,0-6-.3-11.9-.73-17.83-.37-5,.2-9.49-6.33-9.58h-.33c-3.87,0-7.55.88-11.36,1.26-1.63,10.63.39,21.81-1.2,32.6-.55,3.72-1.62,4.05-5.52,5-2.67.65-5.43.78-8.1,1.41l-29.74,7s.26,12.61.27,13C494.5,297,546.79,294.17,552,293Z"></path><path class="cls-1" d="M524,278l-29.74,7s.26,12.61.27,13c0-1.07,52.27-3.85,57.46-5,7.24-1.57,5.62-22.94,5.58-27.87,0-6-.3-11.9-.73-17.83-.37-5,.2-9.49-6.33-9.58h-.33c-3.87,0-7.55.88-11.36,1.26-1.63,10.63.39,21.81-1.2,32.6-.55,3.72-1.62,4.05-5.52,5C529.42,277.25,526.66,277.38,524,278Z"></path><polygon class="cls-6" points="419.08 234.12 422.75 230.66 422.81 226.22 423.76 225.75 424.38 226.9 425.48 223.22 428.08 221.5 431.95 222.97 434.17 226.63 432.3 230.32 428.18 233.01 423.36 237.96 419.08 234.12"></polygon><polygon class="cls-1" points="399.7 253.04 372.88 227.06 368.71 258.12 401.36 274.3 427.05 235.79 420.24 228.69 399.7 253.04"></polygon><polygon class="cls-5" points="330.63 472.4 330.19 476.79 338.16 482.26 342.82 478.41 339.05 473.48 331.07 468.01 330.63 472.4"></polygon><polygon class="cls-6" points="330.83 338.17 329.48 351.51 341.44 397.32 330.33 470.93 338.51 473.74 360.06 401.88 363.49 380.97 363.36 336.71 330.83 338.17"></polygon><polygon class="cls-6" points="393.71 353.03 376.51 476.38 368.69 476.38 367.29 397.32 353.06 341.82 393.71 353.03"></polygon><polygon class="cls-5" points="368.74 475.4 368.74 479.84 377.19 484.27 381.42 479.84 377.19 475.4 368.74 475.4"></polygon><path class="cls-1" d="M377.35,238.45c-1-4-.86-8.78-2.85-12a7,7,0,0,0-2.58-2.51c-2.81-1.59-6.29-2.1-10-2.1-6.51,0-13.7,1.58-19.07,1.58-2.49,26.21-9.38,51.2-13.82,76.94q-7.08,41-16,81.69c-.25,1.13,12.71,1,20.38.88,2.69-.05,4.73-.09,5.32-.08,22.88.38,52.83.3,74.91-6.61-14.09-37.83-19.23-78.54-30.33-117.35C381.42,252,379.11,245.32,377.35,238.45Z"></path><path class="cls-1" d="M313.09,382c-.25,1.13,12.71,1,20.38.88,2.69-.05,4.73-.09,5.32-.08,22.88.38,52.83.3,74.91-6.61-14.09-37.83-19.23-78.54-30.33-117.35-1.95-6.81-4.26-13.53-6-20.4-1-4-.86-8.78-2.85-12a7,7,0,0,0-2.58-2.51c-2.81-1.59-6.29-2.1-10-2.1-6.51,0-13.7,1.58-19.07,1.58-2.49,26.21-9.38,51.2-13.82,76.94Q322,341.33,313.09,382Z"></path><path class="cls-5" d="M364.12,187.73a15.43,15.43,0,0,1,11,12.91,13.58,13.58,0,0,0-3-22,15.73,15.73,0,0,0-7.57,9.17Z"></path><path class="cls-6" d="M375.9,195.49c-3-15.8-22.73-13.07-28.4-.28-3.22,7.28.16,17.58,6.6,22.64.14,1.4.32,5.26,1.39,6.2s4.81,0,6.24-.29a2.13,2.13,0,0,0,1.09-.49,4.15,4.15,0,0,0,.43-2.4,13,13,0,0,0,3.22-.63c4.59-1.51,7.92-5.76,9.29-10.39s1-9.62.14-14.36"></path><path class="cls-7" d="M347.08,274.31a10.53,10.53,0,0,1-1.25-3.46,10.15,10.15,0,0,1,.76-5.93,1.67,1.67,0,0,1,2.11-.92,1.63,1.63,0,0,1,.91,2.1,7.09,7.09,0,0,0-.12,5.76,7.11,7.11,0,0,1,1.23-.55c1.56-.53,3.9-1.12,5.07.43,1.32,1.75.13,3.86-1.59,4.71a5.66,5.66,0,0,1-4.42.42c0,2,.57,3,2.46,3.56,1.16.34,4,.64,4.93-.45.59-.71.54-2.84.76-3.79a37.45,37.45,0,0,1,2.59-7.6,42.41,42.41,0,0,1,9.6-13c9-8.39,20.8-13.28,32.77-15.44q1-.18,2-.33a64,64,0,0,1,23.81.65,22.68,22.68,0,0,1,6.39-6.77c5.77-4,13.77-4.8,19.9-1.42-4.81,5.62-8.75,13.68-9.39,15a51.12,51.12,0,0,1,17.76,18.46l.26.47,9,1.42s3.35,17.58,1.36,22.89c0,0-7,2.87-11.2,4a48.64,48.64,0,0,1-15.5,19c-.46.35-.93.69-1.41,1l2.18,14S437.24,334,431.48,333l-4.81-9.37a69.77,69.77,0,0,1-8.51,1.88,80.15,80.15,0,0,1-10.22.92l-1.76,10.5c-5.19,2.68-17.08.77-17.08.77l-2.18-14c-15.45-4.84-26.83-15.93-29.42-32.64a41.2,41.2,0,0,1-.44-4.21,11.35,11.35,0,0,1-7-2.31,8.88,8.88,0,0,1-3.07-4.76c-.46-1.72-.76-3.76.07-5.41"></path><path class="cls-25" d="M425,242.22l-1.1,5.33s-16.5-2-32.57,5l-4.12-3s14.06-13.39,37.79-7.36"></path><path class="cls-2" d="M462.63,298.88c-.49.35-1,.69-1.51,1L459,301.27a51.66,51.66,0,0,1-11.74,12.2c-.46.35-.93.69-1.41,1l.1.63c1.47-.92,2.88-1.88,4.23-2.9a51.07,51.07,0,0,0,12.48-13.35"></path><path class="cls-25" d="M360.45,290c3.67,22.93,23.95,35.21,48.54,35.21a78.58,78.58,0,0,0,12.09-.95,66,66,0,0,0,24.84-9.1l-.1-.63c.48-.34.95-.68,1.41-1A51.66,51.66,0,0,0,459,301.27c-11.05,6.9-23,12.48-36.16,13.78-2.33.23-4.68.34-7,.34a86.73,86.73,0,0,1-22-3c-12.55-3.32-24.69-9.91-32.2-20.8-.38-.54-.76-1.08-1.11-1.64"></path><path class="cls-2" d="M466.65,265.56s.17.41.43,1.15l.36.06c-.25-.42-.51-.82-.79-1.21m3.21,26.51-1.89.7,1.87-.6a.65.65,0,0,0,0-.1"></path><path class="cls-25" d="M467.08,266.71c1.42,4,5.44,17.64-1.49,26.82l2.38-.76,1.89-.7c.32-1.35,3.49-15.5-2.42-25.3Z"></path><polygon class="cls-6" points="355.41 282.62 360.66 284.34 364.97 282.07 365.92 282.74 365.14 283.94 369.26 283.07 372.28 284.67 372.89 289.17 370.53 293.23 365.99 293.36 361.25 290.8 353.96 288.76 355.41 282.62"></polygon><path class="cls-1" d="M337.61,270.2c-.18-2.89.5-5.75,1-8.6a70.59,70.59,0,0,0-.62-27.36c-.53-2.42-1.69-3.36-3.12-3.36-3.83,0-9.61,6.75-10.55,9.68-1.43,4.46-1,9.32-1.38,13.93q-.7,9.28-.66,18.61c0,3.93-1,13.21,3.18,15.46a11.46,11.46,0,0,0,3.66,1c2,.32,25.54,3.29,25.91,2.13l3.26-10.27c-4.91-1-12.25-1.45-16.75-4.49A8.41,8.41,0,0,1,337.61,270.2Z"></path><path class="cls-1" d="M325.46,288.56a11.46,11.46,0,0,0,3.66,1c2,.32,25.54,3.29,25.91,2.13l3.26-10.27c-4.91-1-12.25-1.45-16.75-4.49a8.41,8.41,0,0,1-3.93-6.75c-.18-2.89.5-5.75,1-8.6a70.59,70.59,0,0,0-.62-27.36c-.53-2.42-1.69-3.36-3.12-3.36-3.83,0-9.61,6.75-10.55,9.68-1.43,4.46-1,9.32-1.38,13.93q-.7,9.28-.66,18.61C322.29,277,321.32,286.31,325.46,288.56Z"></path><path d="M346.71,258.21a3.58,3.58,0,0,0,.45,0c3.49-.59,9.07-1.72,10.69-5.39s-1.28-10.58-1.77-14.48c-.74-5.94-1-11.93-1.27-17.9-.26-5.39,1.67-10.7,4.48-15.29s6.51-8.59,10.13-12.58c1.51-1.66,3.08-3.43,3.54-5.62A8.34,8.34,0,0,0,370.9,180a11.69,11.69,0,0,0-9.11-4.45c-13.06-.31-22.87,7.41-26.58,20.16-5.31,18.28,1.32,35.71.34,53.89a17.42,17.42,0,0,1-2.94,8.74c.46-.69,11.29,0,14.1-.14"></path><path class="cls-1" d="M419.58,186.2a20.76,20.76,0,0,0-3.22.26,20,20,0,1,0,3.22-.26Z"></path><path class="cls-1" d="M422.21,222.68a16.24,16.24,0,0,1-2.68.22,16.73,16.73,0,1,1,2.68-.22Z"></path><path class="cls-8" d="M414.88,213.34c-.22-.11-.3-.4-.39-.66a1.05,1.05,0,0,1,.77-1.42c1-.28,2.14.33,3.12.62A5.8,5.8,0,0,0,421,212a3.65,3.65,0,0,0,2.22-1.07,2.31,2.31,0,0,0,.59-2,1.89,1.89,0,0,0-1-1.55,4.41,4.41,0,0,0-2.5-.12l-.76.12a6.79,6.79,0,0,1-4.45-.51,4.1,4.1,0,0,1-2-3.17,4.17,4.17,0,0,1,.91-3.6,6.11,6.11,0,0,1,3.84-1.82,6.84,6.84,0,0,1,2.21,0c1.6.25,4.31,1.09,4,2.69-.34,1.82-3.39-.27-4.39-.53a4.86,4.86,0,0,0-2-.05,3.1,3.1,0,0,0-2,1,2.23,2.23,0,0,0-.52,1.86,1.58,1.58,0,0,0,1,1.35,8.94,8.94,0,0,0,3.57,0,6.85,6.85,0,0,1,4.36.55,4.31,4.31,0,0,1,1.85,3.23,4.67,4.67,0,0,1-.9,3.79,5.71,5.71,0,0,1-3.72,1.94,10.77,10.77,0,0,1-1.77.1,12,12,0,0,1-4.74-.9"></path><path class="cls-8" d="M421.32,217.57h0a1.14,1.14,0,0,1-1.21-1l-3.15-20.29a1.15,1.15,0,0,1,.84-1.36h0a1.13,1.13,0,0,1,1.22,1l3.15,20.3a1.14,1.14,0,0,1-.85,1.35"></path></svg></mat-icon>
Кто-нибудь когда-нибудь сталкивался с подобной проблемой? У кого-нибудь есть какие-либо советы о том, почему это может происходить? Любые советы будут высоко оценены.
Комментарии:
1. похоже на ошибку в средстве визуализации SVG.
2. @Henry Мы добавляем его в качестве мат-значка. Я добавил фрагмент, чтобы показать, как он выглядит в коде. Обратите внимание, что это создается с использованием строки утилит и сервисов, которые я могу попробовать и расширить, это может помочь нам найти решение.
3. Вы пытались зарегистрировать значок мата material.angular.io/components/icon/examples или напрямую поместить svg-код непосредственно в файл .html?
4. @Eliseo это хорошие предложения. На данный момент мы используем несколько вариантов, чтобы выбрать, какой значок использовать на какой странице, поэтому он генерируется программно, но затем он выбирает один из нескольких файлов SVG, поэтому я, возможно, не смогу поместить его непосредственно в HTML. Я изучу material.angular.io подходите, хотя спасибо!