問題タブ [image-clipping]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
2241 参照

android - クリッピング パスの問題

基本的に、マトリックスを使用して変更できるポイントのリストを保持する独自のポリライン クラスを作成しました。ポリ ラインを他のポリ ラインに追加して、共通の端点で結合できます。終点が始点と等しい場合、ポリ ラインは多角形を表します。

次に、一連の lineTo() 呼び出しでポイントのリストを反復処理することにより、ポリゴンを Path オブジェクトに変換するメソッドがあります。このパスは、View の onDraw メソッドでクリップ パスとしてキャンバスに適用されます。

複雑なポリゴンに最適で、そのパスを描画して精度を検証できます。

真ん中に不規則な穴がある複合ポリゴンがある場合に問題に気付いていることを除いて、これまでのところ良いです。別のポリゴン内のポリゴンであるため、この時点でポリゴンと呼ぶのはやめたほうがよいでしょう。

たとえば、下の図では、外側のボックスと中央の「城」のような形状が両方とも、クリップ パスとして使用される同じ Path オブジェクトの一部であると考えてください。# は塗装領域を表します。

外箱の外側と内側の「城」形状の内側はすべて切り取られると思います。私が見ている問題は、内側の形状が適切に切り取られていないことです。レイ トレーシング アルゴリズムに問題があるようです。

どんなアイデアも役に立ちます。

編集: また、すべての Region.Op モードをテストしてみましたが、どれも問題を解決しませんでした。「穴」があるかどうかを検出し、何か創造的なことを行うための対策を講じる必要があると思います。

0 投票する
2 に答える
1069 参照

wpf - How to calculate the clipping area of an image after scaling and translating

I have an image on a canvas and a ScaleTranform and a TranslateTransform attached to the image's RenderTranform. So with a bit of mouse event handling I can move and zoom the image within the 350 by 450 bounds of the canvas.

How would I calculate the clipping rectangle on the original BitmapImage, to that of the visible area on the screen, after some scaling and translation. I'd like to crop the original BitmapImage.

Thanks

0 投票する
2 に答える
2478 参照

jquery - JQuery Draggable - 親に制限しますが、親の下でスライドできますか?

JQuery Draggable プラグインを使用しています。ユーザーがドラッグ可能な画像を移動 (および最終的にはサイズ変更) できる画像編集コントロールを作成しようとしています。ここのデモを見ると、灰色のボックスをドラッグしてフレームの境界を超えると、スクロール バーが表示され、ドラッグし続けることができることがわかります。スクロールバーなしで同じ機能を実現したいと思います。画像をドラッグできるようにする必要があります。画像がフレームの境界の外に出た場合は、フレームの下にスライドするように見えるはずです。フレームが大きくなったり、スクロールバーが表示されたりしてはいけません。これは可能だと思いますが、見つけたドキュメントではそうする方法が見つかりませんでした。これが私のコードです:

質問: ドラッグ中にスクロールバーを表示せずに、ドラッグ可能オブジェクト<img>を親の下にスライドさせるにはどうすればよいですか?<div>

更新:これについて考えれば考えるほど、質問を言い直すべきだと思います。私が本当にやりたいことは、親<div>タグをドラッグ可能の周りのマスク/クリッピング パスのようにすること<img>です。内部の画像は実際には よりも大きくなる可能性がありますが、 にある<div>ものだけ<div>が表示されます。<img>好きなように内側をドラッグできるはず<div>です。

0 投票する
1 に答える
1697 参照

android - 画像がクリップされたことを知るにはどうすればよいですか?

ImageViews を含む LinearLayout がある場合、どのコードが画面の端でクリップされているかを知るにはどうすればよいでしょうか?

誰もクリップされていない場合、インデックスまたは 0 を返すようなものを想像します。関数呼び出しのセマンティクスはそれほど重要ではありません... クリッピングがあるかどうかを確認する方法が必要なだけです。

0 投票する
1 に答える
1147 参照

javascript - Html5 Canvas + fabric.js での独立した合成

キャンバスで下の画像のようなことをする必要があります。

ここをクリックしてご覧ください

ユーザーは、画像のサイズと位置を変更するよりも、画像を黄色い縁取りの四角形にドラッグ アンド ドロップします。画像は黄色の枠内で切り取られます。クリッピングを使おうと思ったのですが、グローバルクリッピングを使うと。画像が他のセクションに重なっています。これについて何ができますか?独立したクリッピング エリアのように動作するようにします。

0 投票する
0 に答える
1066 参照

ios - iPhoneのUIViewと画像クリッピング?

真ん中の円が透明な画像があり、drawRect 関数を使用して、下の 2 番目の画像のように正方形を描画するとします。

次に、最初の画像のアルファレイヤー、パスとしての円を取得し、四角形に適用して、それを描画してクリップし、最終的な画像のように描画します。円パスに描画したいだけです。

少し早いですがお礼を。

ここに画像の説明を入力 ここに画像の説明を入力 ここに画像の説明を入力

0 投票する
2 に答える
3146 参照

iphone - iPhoneで画像を切り抜く方法

私はこの質問で尋ねられたのと同じことをしたいです。私のアプリでは、FaceBookでの画像のトリミングと同じように画像をトリミングしたいのですが、優れたチュートリアルのリンクやサンプルコードを使ってガイドしてくれます。私が提供したリンクは私の要件を完全に説明します。

0 投票する
1 に答える
529 参照

c# - スクロール中のスムーズな画像クリッピング

そこで、PhotoChooserTask を使用するときに、ネイティブのクロッパーのような効果を実現しようとしています。慣れていない場合は、背景に境界線が上にある画像があり、境界線に出入りすると画像の不透明度が変化するように見えます。次のコードは正常に動作しますが、それほどスムーズではありません (クリップされた画像はドラッグの動きにわずかに遅れます)。クリッピングをスピードアップしたり、ラグを少なくするように変更したりする方法はありますか? 次の XAML があります。

スライド中のトラッキングとクリッピングのコードは次のとおりです。

0 投票する
1 に答える
1586 参照

objective-c - 不規則な形のフレームを作成する

エッジを超えると切り取られる画像を表示するキャンバスを作成しました。正方形のフレームでこれをうまく行うことができますが、使用したいフレームは下のフレームです。画像の周りに透明でない正方形の境界線を追加せずに、つまり、既に描いた黒い線を使用するだけで、フレーム内の画像をクリップできる方法はありますか? (iPad)

ここに画像の説明を入力

0 投票する
1 に答える
2926 参照

imagemagick - PSD ファイルを GIF、PNG、JPG ファイルに変換するときに、ImageMagick はクリッピング パスをどの程度保持できますか?

ImageMagickを呼び出して PSD から他の形式に画像を変換する PHP ツールがあります。

ツールの機能を潜在的に拡張するために、「クリッピング パスに関して、PSD ファイルを GIF、PNG、および JPG ファイルに変換する ImageMagick の可能性は何か」を調べる必要があります。たとえば、次の質問に答えます。

  • ImageMagick は PSD ファイルを GIF/JPG/PNG に変換し、後でさらに編集できるようにクリッピング パスを維持できますか?

  • または、ImageMagick は PSD ファイルを GIF/JPG/PNG にのみ変換できるので、クリッピング パスの外側のすべて透明な領域に変換できますか?

  • GIF、PNG、および JPG の各形式は、PSD ファイルがサポートしているという意味でクリッピング パスをサポートしていますか?