html - Add onclick event to SVG element -


i found example in svg tutorial, explains how can use onclick event handler svg element. looks code below:

 <svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='600' width='820'>   <script type="text/ecmascript"><![cdata[  function changerect(evt)  {  var svgobj=evt.target;  svgstyle = svgobj.getstyle();  svgstyle.setproperty ('opacity', 0.3);  svgobj.setattribute ('x', 300); } ]]> </script>  <rect onclick='changerect(evt)' style='fill:blue;opacity:1' x='10' y='30' width='100' height='100' />  </svg> 

however doesn't seem work. nothing happens when click on element.

perhaps important mention fact displaying svg inside php script, using echo. content generated php script brought page using ajax and:

 xmlhttprequest() 

could perhaps have it? lot help.

it appears of javascript must included inside of svg run. unable reference external function, or libraries. meant code wass breaking @ svgstyle = svgobj.getstyle();

this attempting.

<?xml version="1.0" standalone="no"?> <!doctype svg public "-//w3c//dtd svg 1.1//en" "http://www.w3.org/graphics/svg/1.1/dtd/svg11.dtd"> <svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='600' width='820'>  <script type="text/ecmascript"><![cdata[     function changerect(evt) {         var svgobj=evt.target;         svgobj.style.opacity= 0.3;         svgobj.setattribute ('x', 300);     } ]]> </script>  <rect onclick='changerect(evt)' style='fill:blue;opacity:1' x='10' y='30' width='100'height='100' /> </svg> 

Comments

Popular posts from this blog

linux - xterm copying to CLIPBOARD using copy-selection causes automatic updating of CLIPBOARD upon mouse selection -

c++ - qgraphicsview horizontal scrolling always has a vertical delta -