Skip to main content
Kenji OKIRUME
Kenji OKIRUME
Legend
November 14, 2018
Answered

中心からの距離を変動させる方法

  • November 14, 2018
  • 2 replies
  • 1999 views

下図の星を赤点との距離を変えながら赤点を中心に回したいのですが、

どのような方法がベストでしょうか？

下図は説明用にシェイプで作成しましたが、

実際に動かしたいのは最初の位置が決まっているイラレデータです。

（各オブジェクトはレイヤー分けされています。赤点の位置は変えません。）

赤点を中心に回すのは簡単ですが、

何かと何かの距離を制御する方法が分かりません。

wiggleなども使いたいので、スライダーで簡単に制御できると嬉しいのですが。。

ご教授下さい。宜しくお願いします。

This topic has been closed for replies.
Correct answer Mukaida

２つのシェイプ間の距離は、length(A - B) で求められます。

length(thisComp.layer("シェイプレイヤー 2").transform.position - thisComp.layer("シェイプレイヤー 1").transform.position)

星を中央に配置している場合は、下記のエクスプレッションで回転できますが、星の位置が決められているので、上記の距離を組み合わせると出来そうな気がします。（ampが距離になるので、一工夫必要です）

freq = 0.5;
amp = 400;
amp2=wiggle(5,20)[1];
x=value[0] + amp*Math.sin(freq*time*Math.PI*2);
y=amp2 + amp*Math.cos(freq*time*Math.PI*2);
[x,y]

2 replies

M
Community Expert
MukaidaCommunity ExpertCorrect answer
Community Expert
November 15, 2018

２つのシェイプ間の距離は、length(A - B) で求められます。

length(thisComp.layer("シェイプレイヤー 2").transform.position - thisComp.layer("シェイプレイヤー 1").transform.position)

星を中央に配置している場合は、下記のエクスプレッションで回転できますが、星の位置が決められているので、上記の距離を組み合わせると出来そうな気がします。（ampが距離になるので、一工夫必要です）

freq = 0.5;
amp = 400;
amp2=wiggle(5,20)[1];
x=value[0] + amp*Math.sin(freq*time*Math.PI*2);
y=amp2 + amp*Math.cos(freq*time*Math.PI*2);
[x,y]
    Kenji OKIRUME
    Kenji OKIRUMEAuthor
    Legend
    November 15, 2018

    Mukaidaさん

    〜遅くなりました。なぜかずっと審査中のままで投稿されていなかったようです。〜

    ご返信ありがとうございます。

    やっぱりエクスプレッションなのかな？と思っていたところです。

    が、エクスプレッションに関しては、数少ない書籍を一冊読んだだけの素人です。

    基本的な用語は分かりますが、自分では構築できず、他の人のを解読するのもちょっと苦労します。

    隠す必要もないので実際のデザインとコンポを貼っておきます。

    イラレで作ったデータをコンポジションとして読み込みこんだものです。

    コンポサイズは1920×1080です。

    イラレで３つのレイヤーに分けているので、そのまま３つのレイヤーでいじれます。

    イラレデータは私が作ったものなので、イラレに戻って再調整する事も可能です。

    下図の様に各オブジェクトのアンカーポイントはコンポジションの中心点に置かれています。

    この中心点との距離を変えながらゆっくり回したいです。

    length(thisComp.layer("シェイプレイヤー 2").transform.position - thisComp.layer("シェイプレイヤー 1").transform.position) 

    初心者質問になりますが、上記の距離のエクスプレッション（lengthのパラメーター）は

    どこに適用すればよいでしょうか？

    そしてアンカーポイントとの距離は下記で通用しますでしょうか？

    length(thisComp.layer("1").transform.anchorPoint - thisComp.layer("1").transform.position)

    距離を変えるということは方向（角度）も考慮しないと座標が決まらないですかね。

    方向は純粋に放射状をイメージしているのですが。。

    回転させるのは置いておいて、

    まずは中心との距離を変動させる方法を見いだしたいと思っております。

    長々とすいません。

    これを機にエクスプレッションも自分で構築できるようになりたいと思います。m(_ _)m

    M
    Community Expert
    MukaidaCommunity Expert
    Community Expert
    November 15, 2018

    スクリーンショットありがとうございます。

    まず、距離を求められていますが、全てのレイヤーの位置がコンポジションの中央になっているため距離は０になります。

    読み込みで「レイヤーサイズを保持」した場合は、位置が変わるので距離も変わってきます。

    エクスプレッションは、テキストレイヤーのソーステキストに適用すると、文字で表示されます。

    なお、CC2018からエクスプレッションを適用したプロパティをプレビュー画面にドラッグすると自動でテキストレイヤーが作成されるようになっています。（ガイドレイヤーなのでレンダリングはされません）

    また、位置のプロパティに前の回答にあるエクスプレッションをは追加した時に amp=length() と代入することもできます。

    それと、フォーラムへの投稿についてはモデレーターの方の審査後に反映されるため、時間がかかることはありますが、ご辛抱ください。

      150kw
      Community Expert
      150kwCommunity Expert
      Community Expert
      November 14, 2018

      お早うございます、Kenji OKIRUMEさん

      移動と回転を別々にコントロールできる次の方法が良いと思います。お試しください。

      ①「コンポ 1」コンポジションで、赤点の中心を「アンカーポイント」に合わせます。そして星の位置を移動します。

      ②「コンポ 2」コンポジションを作成し、「コンポ 2」コンポジションに「コンポ 1」コンポジションを入れます。

      ③「コンポ 2」コンポジションで、「コンポ 1」コンポジションレイヤーに回転をかけます。

        Kenji OKIRUME
        Kenji OKIRUMEAuthor
        Legend
        November 15, 2018

        150kwさん

        すみません、私の説明がイマイチなようです。

        赤点はないものとしてお考え下さい。

        コンポの中心点との距離を変えながら星をその中心点を基準に回したいと思ってます。

        最初の星の位置がどこでも良いのであれば、最初に水平または垂直に配置させてXまたはY軸で移動させ、

        回転に関してはアンカーポイントを移動させたり、ヌルとリンクさせれば良いのですが、

        現状では最初のデザイン（配置）を決めてしまっていまして、

        「やっぱり座標ではなく距離でコントロール出来たら美しいな…」と思っている次第です。

        少し説明不足でした、すみません。

        次のMukaidaさんへの返信で実際のコンポを添付します。

        もし、またアイデアをご提示して頂けるのであれば宜しくお願いします。m(_ _)m

        Terms & ConditionsAccessibility statement
        Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices