javascript - Transform rotate in snap svg -


here js fiddle trying rotate 1 of cogwheel, rotates moving different point. tried different values rotate center without luck. appreciated.

code

var s = snap("#main"); var orange = s.select("#orgbearing");  rotating();  function rotating() {     orange.stop().animate({         transform: 'r360 126.7 126.7'     }, 1000); }   

would love see if animation can made repeat indefinitely.

you need calculate center of object, rotate around correct point.

var bbox = orange.getbbox(); //bounding box, coords , centre  orange.stop().animate({ transform: "r360," + bbox.cx + ',' + bbox.cy }, 1000); 

here solution:

https://jsfiddle.net/cfogknc5/1/

you can call setinterval() on rotating function make infinite loop.


Comments

Popular posts from this blog

php - failed to open stream: HTTP request failed! HTTP/1.0 400 Bad Request -

java - How to filter a backspace keyboard input -

java - Show Soft Keyboard when EditText Appears -