<pc-particle-system>

<pc-particle-system>タグはエンティティにパーティクルシステムを追加します。雪、火花、煙のようなエフェクトのエミッターで、JSONアセットで設定します。

使用法

<pc-entity>、<pc-model>、または<pc-node>の直接の子である必要があります。

属性

属性	タイプ	デフォルト	説明
`asset`	Asset ID	-	パーティクルシステム設定を定義するJSONアセットID
`enabled`	Boolean	`"true"`	コンポーネントの有効状態

設定

JSONアセットはエンジンのParticleSystemComponentの設定を、同じプロパティ名で保持します。ベクトルは数値の配列で、パーティクルの寿命にわたって値を変化させるグラフはカーブです。カーブは、keysに時間と値を交互に並べたオブジェクト（[time, value, time, value, ...]）として書きます。ベクトルのグラフは、軸ごとにそうした配列を1つずつ取ります。

colorMapAssetは<pc-asset>をidで指定し、要素がそれをテクスチャに解決します。これができるアセット設定はこれだけで、normalMapAsset、meshAsset、renderAssetを同じように指定しても解決されません。

設定の<pc-asset>はlazyにでき、実行時にassetを変更すると別の設定に差し替わります。設定がいつ届いても、要素はエンジンと同じようにベクトルとカーブを構築し、すべての設定をコンポーネントに適用します。設定内のenabledキーは無視されます。システムを動かすかどうかは要素のenabled属性が決めます。

例

まず、パーティクルシステムをJSON形式で定義します。

snow.json
{
    "numParticles": 100,
    "lifetime": 10,
    "rate": 0.1,
    "colorMapAsset": "snowflake",
    "emitterExtents": [ 15, 0, 10 ],
    "startAngle": 360,
    "startAngle2": -360,
    "alphaGraph": {
        "keys": [ 0, 0, 0.5, 0.5, 0.9, 0.9, 1, 0 ]
    },
    "rotationSpeedGraph": {
        "keys": [ 0, 100 ]
    },
    "rotationSpeedGraph2": {
        "keys": [ 0, -100 ]
    },
    "scaleGraph": {
        "keys": [ 0, 0.1 ]
    },
    "velocityGraph": {
        "keys": [
            [ 0, 0 ],
            [ 0, -0.7 ],
            [ 0, 0 ]
        ]
    },
    "velocityGraph2": {
        "keys": [
            [ 0, 0 ],
            [ 0, -0.4 ],
            [ 0, 0 ]
        ]
    }
}

次に、HTMLでシーンにパーティクルシステムを追加します。これは上の snow.json をそのまま実行するものです — colorMapAsset が snowflake テクスチャアセットの id を指している点に注目してください:

ライブサンプル

<pc-app>
    <pc-asset src="https://developer.playcanvas.com/assets/snowflake.png" id="snowflake"></pc-asset>
    <pc-asset src="https://developer.playcanvas.com/assets/snow.json" id="snow"></pc-asset>
    <pc-scene>
        <pc-entity name="camera" position="0 0 8">
            <pc-camera clear-color="#1d1f2b"></pc-camera>
        </pc-entity>
        <pc-entity name="snow" position="0 5 0">
            <pc-particle-system asset="snow"></pc-particle-system>
        </pc-entity>
    </pc-scene>
</pc-app>

JavaScriptインターフェース

ParticleSystemComponentElement APIを使用して、<pc-particle-system>要素をプログラムで作成および操作できます。

componentプロパティは、この要素が追加するエンジンのParticleSystemComponentです。要素の準備が完了するまではnullで、属性が公開していないものはすべてここから利用できます。要素自体にも、エミッターを制御するplay()、pause()、reset()、stop()メソッドがあります。

属性​

設定​

例​

JavaScriptインターフェース​

関連項目​

属性

設定

例

JavaScriptインターフェース

関連項目