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

Popular posts from this blog

c# - Binding a comma separated list to a List<int> in asp.net web api -

Delphi 7 and decode UTF-8 base64 -

html - Is there any way to exclude a single element from the style? (Bootstrap) -