我可以在JavaScript中嵌入svgs吗？

我用自己的矢量图形创建了一个相当专业的JavaScript应用程序。我想主持我自己的可链接的API来补充这个应用程序，并认为如果我可以将矢量图形直接嵌入到API中将会非常整齐。我可以在JavaScript中嵌入svgs吗？

我知道它可以用字体来完成（记住cufon，在谷歌涡轮增压webfonts之前相当不错），而且我不需要支持传统版本的浏览器，所以你的想法是什么？你会如何去做这件事？

来源

2013-08-01 Starkers

我认为SVG是XML（所以纯文本，而不是二进制）。我不知道这是否有帮助，但也许它确实... – GolezTrol

我认为你需要更具体地说明你正在尝试回答的技术问题。 – 2013-08-01 15:21:45

是的，您可以使用标准<svg>标签将SVG嵌入到HTML中。

不仅如此，但你也可以从JavaScript操纵SVG。我使用jquery.svg库。使用起来很简单，很有趣。

尝试......

<script type="text/javascript" src="jquery.svg.js"></script> 
.... 

$(function() { 
    var div=$("#sample"); 
    div.svg(); 
    var svg = div.svg('get'); 
    svg.load('chart.svg'); 
    setInterval(function() { 
    draw(svg,div.width()); 
    }, 1000); 
}); 

function draw(svg,w) { 
    svg.circle(Math.random()*w, 
      Math.random()*w, 
      Math.random()*(w*.10)+10); 
}

来源

2013-08-01 16:04:32

看起来像我们在这里的东西，但我可以嵌入svg到javascript，而不是HTML？这个答案会有点工作，但我必须使用jquery.svg的语法重新创建所有图形！（我想，我还没有真正研究jquery.svg.js，请纠正我！）。将Adobe Illustrator svg嵌入到html中会导致巨大的代码块。我希望尽可能保持HTML的亮度，并让API完成所有繁重的工作。 – Starkers

是的，你可以使用这个库加载完整的svg文件'svg.load（svgfile）' –

在我进入之前，你说我的API看起来像这样： // App V1.0 Copywrite 2013 me ** Jquery minifed code ** //向量图形在这里： <？xml version =“1.0”“？> <！DOCTYPE svg PUBLIC” - // W3C // DTD SVG 1.1 // EN“”http： //www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd“> 还是接近够？从概念上讲，这是我能做的吗？ – Starkers

显然，您可以直接在HTML中嵌入svg图片，方法是添加带有正确内容的svg标签。因此，使用document.createElement来从Javascript或JQuery插入这样的元素应该是合理的。

当搜索一个例子时，我发现this other question表明由于涉及的命名空间，需要做更多的工作。

来源

2013-08-01 15:03:56 GolezTrol

我可以在JavaScript中嵌入svgs吗？

回答

相关问题