开发者

Getting Events Out of an embedded SVG document

None of the questions I have searched through seems to help me with this.

I am embedding an SVG document thusly:

<embed onload="fixup()" id="zgraphic" src="images/test.svg" width="500" type="image/svg+xml" />

And then I am trying to seek out elements in the SVG and add event handlers to them. I already learned that jQuery won't work to find SVG elements. I have this in the head:

<script type="text/javascript">

 function blah(event) {
     alert("Got event: " + event)
 }

    var svg;
    var slot1;

function fixup() {
   svg = jQuery("#zgraphic")[0].getSVGDocument();
   slot1 = svg.getElementById("slot1");
   slot1.onclick = blah;
   alert("Set onclick for " + slot1);
  }
 </script>

Using firebug I can see that the svg and slot1 variables are getting set, a开发者_如何学JAVAnd the onclick property of slot1 is also getting set. Yet the event never comes.

Side question: Is there a better way to get the root SVGDocument object than the way I am doing it? I got there by trial and error but it looks shaky to me and I haven't been able to find anything like it on the web. It would be nice if jQuery could reach into the SVG document but I can live without it if I have to.


Create functions in test.svg that call the correct code in your file with the fixup function

So in your test.svg file you'll have something like this

function blah(e) {
e.stopPropagation();
window.parent.blah(e);

}


You might want to take a look at dojo's gfx: http://docs.dojocampus.org/dojox/gfx

It is an API for accessing the browsers vector capabilities.


I never did get this to work, but I have discovered what I want to do works fine in HTML 5 on browsers that supports it. An svg element gets integrated in to the document DOM the same as anything else, so jQuery and getElementById works the same as it would for other elements.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜