SVGDOMのプロパティを変更 それでは、さっそくSVGDOMの操作方法について記載していきます。 <rect id="rect" x="50" y="50" width="100" height="100" fill="#91e600" /> TweenMax.to($element,0.5,{attr:{x:100,y:150}); 指定した要素のx,y座標がアニメーションで変化していますね。viewBoxの指定方法については、後述します。 原点を固定してアニメーション transformOriginとsvgOriginを使ったアニメーション方法について説明します。 CSSで用いられるtransform-originは、要素の原点を変更することができるプロテパティです。 TweenMaxでも同じように各要素の原点を指定する場合は、transformOriginに値を渡すことで原点を変更
![JavaScriptライブラリTweenMaxでSVGアニメーションを扱う方法 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作](https://cdn-ak-scissors.b.st-hatena.com/image/square/9868b573829a77be6d0b0e1ac9b211583a25c463/height=288;version=1;width=512/https%3A%2F%2Fliginc.co.jp%2Fwp-content%2Fuploads%2F2015%2F06%2F892.png)