SVG

SVG (Scalable Vector Graphics) SVG is an XML-based vector image format designed for creating scalable, interactive, and high-quality graphics for the web. Unlike raster images (e.g., JPEG or PNG), which rely on pixels and lose quality when resized, SVG uses mathematical equations to define shapes, lines, and colors, ensuring crisp rendering at any resolution. Key Features of SVG 1. Scalability: SVG graphics can be scaled infinitely without loss of quality, making them ideal for responsive web design, icons, logos, and illustrations. 2. Lightweight: Since SVG files are text-based (XML), they are often smaller in size compared to bitmap images, improving website performance. 3. Interactivity & Animation: SVG supports JavaScript and CSS, allowing dynamic effects, hover states, and complex animations. SMIL (Synchronized Multimedia Integration Language) can also be used for animations. 4. Accessibility: SVG elements can include text descriptions (``, `<desc>`), making them accessible to screen readers and improving SEO. 5. Editability: Being code-based, SVG files can be modified with text editors or graphic software like Adobe Illustrator or Inkscape. Common Use Cases - Web Icons & UI Elements: SVG is widely used for buttons, icons, and logos due to its scalability. - Data Visualization: Charts, graphs, and maps benefit from SVG’s interactivity and dynamic updates. - Illustrations & Art: Designers use SVG for complex vector artwork that must adapt to different screen sizes. - Print Media: SVG ensures high-resolution output for business cards, posters, and other print materials. Advantages Over Raster Images - Resolution Independence: No pixelation at any zoom level. - Smaller File Size: Especially for simple graphics. - DOM Integration: SVG can be manipulated via JavaScript, enabling real-time updates. Limitations - Complexity: Highly detailed SVG files may become large and slow to render. - Browser Support: While modern browsers fully support SVG, older versions may have limited compatibility. Conclusion SVG is a powerful, flexible format for modern web and graphic design, offering scalability, performance, and interactivity. Its text-based structure makes it developer-friendly, while its visual precision ensures professional-quality results across devices.</div> <h2 class="tag-item">Продукташ</h2> <div class="tag-category mt-20"> <span>категори:</span> <a href="https://ce.gaoyun-elec.com/product/svg" title="SVG" alt="SVG"> SVG </a> </div> <div class="no-information">Цхьа а лехна жамӀ дац! </div> <h2 class="tag-item">Керла</h2> <div class="tag-category mt-20"> <span>категори:</span> </div> <div class="no-information">Цхьа а лехна жамӀ дац! </div> <h2 class="tag-item">Кейс</h2> <div class="tag-category mt-20"> <span>категори:</span> </div> <div class="no-information">Цхьа а лехна жамӀ дац! </div> <h2 class="tag-item">Видеош</h2> <div class="tag-category mt-20"> <span>категори:</span> </div> <div class="no-information">Цхьа а лехна жамӀ дац! </div> <h2 class="tag-item">Схьаэцар</h2> <div class="tag-category mt-20"> <span>категори:</span> </div> <div class="no-information">Цхьа а лехна жамӀ дац! </div> <h2 class="tag-item">Балха эцар</h2> <div class="tag-category mt-20"> <span>категори:</span> </div> <div class="no-information">Цхьа а лехна жамӀ дац! </div> <h2 class="tag-item mb-20">Рекомендаци еш йолу сурсаташ</h2> <div class="no-information">Цхьа а лехна жамӀ дац! </div> </div> </div> </div>  <div class="foot"> <div class="ft1"> <div class="wh flex2"> <div class="tlogo" ><img src="//wm.cdn.cn86.cn/nbgaoyun/2025/12/96f34809d2dsvyno.png?x-oss-process=image/format,webp" alt=""></div> <div class="dtel2" > <span>Contact us</span> <div class="dtel"><p>+86 13805885488</p></div> </div> </div> </div> <div class="ft2"> <div class="wh flex2"> <ul class="dao flex2"> <li> <h3>About</h3> <a href="https://ce.gaoyun-elec.com/page/about-us.html">Introduction</a> <a href="https://ce.gaoyun-elec.com/page/partner.html">Partner</a> <a href="https://ce.gaoyun-elec.com/page/honor.html">Honor</a> </li> <li> <h3>Product</h3> <a href="https://ce.gaoyun-elec.com/product/veneer-dryer">Capacitor</a> <a href="https://ce.gaoyun-elec.com/product/biomass-roller-veneer-dryer">Reactors</a> <a href="https://ce.gaoyun-elec.com/product/porduct1">Combination Switch</a> <a href="https://ce.gaoyun-elec.com/product/power-capacitor">Power Capacitor</a> <a href="https://ce.gaoyun-elec.com/product/svg">SVG</a> <a href="https://ce.gaoyun-elec.com/product/apf">APF</a> <a href="https://ce.gaoyun-elec.com/product/controller">Controller</a> <a href="https://ce.gaoyun-elec.com/product/thyristor">Thyristor</a> </li> <li> <h3>News</h3> <a href="https://ce.gaoyun-elec.com/news/exhibition-information">Exhibition Information</a> <a href="https://ce.gaoyun-elec.com/news/capacitor-faq">Capacitor FAQ</a> <a href="https://ce.gaoyun-elec.com/news/company-news-1">Company News</a> <a href="https://ce.gaoyun-elec.com/news/industry-news">Industry News</a> </li> <li> <h3>Contact</h3> <a href="https://ce.gaoyun-elec.com/page/contact-us.html">contact us</a> </li> </ul> <div class="tewm" ><p><img src="//wm.cdn.cn86.cn/nbgaoyun/2025/12/9bc678d696llci4k.png" alt="ScreenShot_2025-12-22_142225_571.png" title="ScreenShot_2025-12-22_142225_571.png"/></p><p>Follow us</p></div> </div> </div> <div class="ft3"> <div class="wh flex2"> <div class="ban2" ><p>All rights reserved © Ningbo Gaoyun Inc. </p></div> <div class="bei" ><p> <a href="{{ url('sitemap.xml') }}" target="_blank">Sitemap</a> | Technical support：WKL</p></div> </div> </div> </div> <div class="scroll_to_top2 hidden-xs hidden-sm"> <i class="fa fa-angle-double-up" aria-hidden="true"></i> </div> <script src="https://ce.gaoyun-elec.com/themes/default/js/app.js"></script> <script src="https://ce.gaoyun-elec.com/themes/default/js/bootstrap.bundle.min.js"></script> <script src="https://ce.gaoyun-elec.com/themes/default/js/swiper-bundle.min.js"></script> <script src="https://ce.gaoyun-elec.com/themes/default/js/jquery.fancybox.min.js"></script> <script src="https://ce.gaoyun-elec.com/themes/default/js/wow.min.js"></script> <script src="https://ce.gaoyun-elec.com/themes/default/js/jquery.lazyload.min.js"></script> <script src="https://ce.gaoyun-elec.com/themes/default/js/jquery.fullpage.min.js"></script> <script src="https://ce.gaoyun-elec.com/themes/default/js/main.js"></script> <script type="text/javascript"> var tags = new Vue({ el: '#page-wrap', data: { isActive1: true, isActive2: false, }, methods: { change: function(message) { if (message == "active1") { this.isActive1 = true; this.isActive2 = false; } else { this.isActive1 = false; this.isActive2 = true; } } } }); </script> <div class="service-view hidden-xs" id="service-view"> <div class="service-close text-center" onclick="$('#service-view').remove();">×</div> <ul class="service-list" > <li class="email"> <a href="mailto:sales@gaoyun.com.cn" target="_blank"><img src="https://ce.gaoyun-elec.com/themes/default/images/kf/email.png" alt='sales@gaoyun.com.cn' /></a> </li> <li class="message"> <a href="https://ce.gaoyun-elec.com/message" target="_blank"><img src="https://ce.gaoyun-elec.com/themes/default/images/kf/message.png" /></a> </li> <li class="chat"> <a href="javascript:;;"><img src="https://ce.gaoyun-elec.com/themes/default/images/kf/chat.png" /></a> </li> </ul> <div class="chat-box"> <div class="title"> <div class="img"><img class="avatar" alt="chat" src="//wm-hk.cdn.cn86.cn/test/2024/10/47b8c96f548v72pt.jpg"></div> <h3></h3> <div class="close">×</div> </div> <div class="body"> <ul> <li> <h3> <span>21:59</span></h3> <dd></dd> </li> <li> <h3> <span>21:59</span></h3> <dd></dd> </li> </ul> </div> <form class="content"> <textarea class="form-control len-full" id="chat-content" rows="4" placeholder="Чулацам" name="content" cols="50"></textarea> <div class="btn"> <button type="button" id="subBtn" class="submit">ДӀакхачо</button> </div> </form> </div> </div> <script> window.onload = function() { $('.service-view').distance(); } $('.service-list li.chat a').click(function (event){ event.preventDefault() $('.service-view .chat-box').show() }) $('.service-view .chat-box .close').click(function (){ $('.service-view .chat-box').hide() }) const textarea = document.getElementById('chat-content'); textarea.addEventListener('keydown', function(event) { if (event.key === 'Enter' && !event.shiftKey) { let val = $(event.target).val() if (val) { sendData(val) } event.preventDefault(); } }); $(".chat-box #subBtn").click(function () { let val = $(".chat-box #chat-content").val() if (val) { sendData(val) } }) function sendData(value) { var title = "" var date = "21:59" var text1 = "" var text2 = "" $.ajax({ type: 'POST', url: HOME_URL + '/service', headers: { 'X-CSRF-TOKEN' : $('meta[name="csrf-token"]').attr('content') }, data: {'content': value}, dataType: 'json', success: function (json) { if (json.status == 'success') { $(".chat-box .body ul").append("<li><h3>" + title + " <span>" + date + "</span></h3><dd>" + text1 + "</dd></li><li><h3>" + title + " <span>" + date + "</span></h3><dd>" + text2 + "</dd></li>") $('.chat-box .body').animate({ scrollTop: $('.chat-box .body').scrollTop() + $('.chat-box .body ul li:last-child').outerHeight(true) * 2 }, 100) } $("#chat-content").val('') } }) } </script> <div class="mobile-service visible-xs"> <ul class="service-item"> <li class="whatsapp"> <a href="whatsapp://send?phone=" target="_blank"><img src="https://ce.gaoyun-elec.com/themes/default/images/kf/whatsapp.png" alt='' />Ватсап</a> </li> <li class="skype"> <a href="tel:13805885488"><img src="https://ce.gaoyun-elec.com/themes/default/images/kf/phone.png" alt='13805885488' />Телефон</a> </li> <li class="email"> <a href="mailto:sales@gaoyun.com.cn"><img src="https://ce.gaoyun-elec.com/themes/default/images/kf/email.png" alt='sales@gaoyun.com.cn' />Электронни почта</a> </li> <li class="message"> <a href="https://ce.gaoyun-elec.com/message" target="_blank"><img src="https://ce.gaoyun-elec.com/themes/default/images/kf/message.png" />Хаам</a> </li> </ul> </div> <script> $('.service-item li.top').click(function (event){ event.preventDefault(); $('html, body').animate({scrollTop:0}, 'slow'); }) </script> <div class="privacyPopup"> <p>Кукин протокол</p> <div class="buttons"> <a class="agreeButton btn" onclick="agreePrivacyPolicy()">ТӀеэца</a> <a class="disagreeButton btn" onclick="disagreePrivacyPolicy()">отказаться</a> </div> </div> <script> $(document).ready(function () { if (getCookie('privacy_cookie')) { document.querySelector('.privacyPopup').style.display = 'none'; } else { document.querySelector('.privacyPopup').style.display = 'flex'; } }) function agreePrivacyPolicy() { setCookie("privacy_cookie", "1", 1) document.querySelector('.privacyPopup').style.display = 'none'; } function disagreePrivacyPolicy() { setCookie("privacy_cookie", "2", 1) document.querySelector('.privacyPopup').style.display = 'none'; } </script> <script> $(document).ready(function() { $(function() { $(window).scroll(function() { if ($(window).scrollTop() > 0) { //计算 //当滚动条的位置处于距顶部200像素以下时，跳转链接出现，否则消失 $("header").addClass('header_bg'); } else { $("header").removeClass('header_bg'); } }); }); }); </script> </body> </html>