同じキャンバスに 2 つのレイヤーに依存しないレイヤー マスクを作成することはできますか? 私は試しましたが、あまり成功しませんでした。レイヤーインデックスに影響を与えるマスクが原因だと思います。マウスオーバーでマスキングを有効にすることでこれを強調しました (こちらを参照)。レイヤーマスクの上にマウスを置くと、他のレイヤーマスクが消えます。プロパティとしてレイヤーを描画すると、mask:trueレイヤーマスクが1つだけ表示されます。「レイヤーマスクごとに別のキャンバスを作ってみませんか？」と思うかもしれません。キャンバスを合成 jpeg としてレンダリングするつもりなので、できません$("canvas").getCanvasImage();(2 つのキャンバスでは難しいでしょう)。
最終的な目標は、キャンバスを垂直に 2 つのペインに分割することです。各ペインには、ドラッグ可能な画像が表示されます。ユーザーはペイン内の画像を移動して「トリミング」し、結果を合成画像としてレンダリングします。この例はかなり近いですが、右側のペインの下にある緑色のボックスをドラッグすると、そのペインにデッドスペースが作成されます。
ご協力ありがとうございます。