SVG缩放与jQuery

Question

i am developing a website but i am not that good at the UI part, anyway i have managed to get an SVG file from illustrator then using jquery i am manipulating it, however it doesn't show properly on browsers, the SVG is bigger than the "preview" on adobe illustrator, the preview on adobe use <object> but in JQUERY i am loading the svg file directly 我正在开发一个网站，但我在UI方面不那么擅长，无论如何，我设法从illustrator中获取了SVG文件，然后使用jquery对其进行了操作，但是在浏览器中无法正确显示，SVG大于在Adobe Illustrator上的“预览”，在Adobe上的预览使用<object>但是在JQUERY中，我直接加载svg文件

here is the head of my svg file 这是我的svg文件的头

<?xml version="1.0" encoding="iso-8859-1"?>
    <!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 
    6.00 Build 0)  -->
    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" 
    xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1024 768" 
    style="width:1024;height:768;">

and here is start of my code 这是我的代码的开始

<!doctype html>
<html>
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-
 1.0.1.min.js"></script>
 <script>
 $.get('new.svg', function(data) {
 $(document.body).append(data.documentElement);
 $('#TESTGROUPCIRCLE').on('click touchstart', function () {
 $('#tooltip').hide();
 $('#TESTTEXT').fadeIn();
 $('#MAIN').fadeOut();
  });

i am not sure why the svg shows larger when i get it directly without using <object> , it shows at 1333 * 999 for a reason i don't know, anybody came across such a problem before? 我不确定为什么在不使用<object>情况下直接获取svg时显示的较大，由于我不知道的原因，它显示为1333 * 999，之前有人遇到过这样的问题吗？

Answer 1

You should use the img tag with style="width:1024;height:768" to display the svg in the correct dimensions. 您应该使用img标记，其style="width:1024;height:768" ，以正确的尺寸显示svg。 You are appending the svg right onto the body without having an img tag. 您正在将svg附加到主体上，而没有img标签。 As far as I can see your new.svg is at the same source. 据我所知，您的new.svg来自同一来源。 So there should be no need to load it with jQuery. 因此，无需使用jQuery加载它。

SVG缩放与jQuery

问题描述

1 个解决方案

解决方案1
0 2017-11-16 18:22:59

SVG缩放与jQuery

问题描述

1 个解决方案

解决方案1 0 2017-11-16 18:22:59

解决方案1
0 2017-11-16 18:22:59