用javascript修改中风和填充svg图像 [英] modify stroke and fill of svg image with javascript
问题描述
我正在尝试修改.svg图像的描边和填充。
我一直在从是否可以使用JavaScript处理HTML文档中嵌入的SVG文档？。
我使用javascript来操作它在头部的javascript：
pre $ function svgMod（）{
var s = document.getElementById（svg_img ）;
s.setAttribute（stroke，0000FF）;
}
html：
...
< body onload =svgMod（）;>
< img id =svg_imgsrc =image.svg>
...
任何帮助表示感谢！
编辑：1
我认为这里的主要问题是如何显示一个svg图像作为一个svg元素，一个实际的图像，而不是像.png或。 jpeg，使用.svg结尾，以及如何操作它的填充和描边！如果您使用img标签，那么出于安全原因，您将无法访问图像数据的DOM。
使用< iframe> 图片与动画位图实际上是一样的。 c>或< object> 标签将允许您操作嵌入对象的DOM。
I am trying to modify the stroke and fill of an .svg image. I have been getting some information from Is it possible to manipulate an SVG document embedded in an HTML doc with JavaScript?.
I used javascript to manipulate it, the javascript in the header:
function svgMod(){
var s = document.getElementById("svg_img");
s.setAttribute("stroke","0000FF");
}
the html:
...
<body onload="svgMod();">
<img id="svg_img" src="image.svg">
...
Any help appreciated!
EDIT:1 I think the main problem here is how to display an svg image as an svg element, an actual image that instead of an ending like .png or .jpeg, uses an ending of .svg, and furthermore how the fill and stroke of it can then be manipulated!
If you use an img tag then for security reasons you will not be able to access the DOM of the image data. The image is effectively the same as an animated bitmap as far as the container is concerned.
Using an <iframe> or <object> tag will allow you to manipulate the embedded object's DOM.
这篇关于用javascript修改中风和填充svg图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
