html - How to move a svg element? -
am new web application development , trying move svg element , have problems....here code reference.
<!doctype html> <html> <body> <svg width=500 height=500> <circle cx="200" cy="200" r="100" stroke="black" stroke-width="4" fill="black" /> <g transform="translate(200,200)"> <line x1="0" y1="0" x2="100" y2="0" style="stroke:rgb(255,255,255);stroke-width:2"> <animatetransform attributename="transform" attributetype="xml" type="rotate" from="0" to="360" dur="100s"/> </line> </svg> </body> </html>
copy paste & try it,to clear context
and requirement want rotate "line" along circle,but want rotate values(eg: want line placed in position want palce it,but code starts rotating automatically begin end position)...
any appreciated..
your question not clear. sounds saying don't want have rotation animation. want line @ 45deg angle. right?
if is want, remove animatetransform
element, , put fixed transform on line. follows:
<svg width=500 height=500> <circle cx="200" cy="200" r="100" stroke="black" stroke-width="4" fill="black" /> <g transform="translate(200,200)"> <line x1="0" y1="0" x2="100" y2="0" style="stroke:rgb(255,255,255);stroke-width:2" transform="rotate(45)"/> </g> </svg>
Comments
Post a Comment