問題タブ [pixel-perfect]

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 投票する
2 に答える
22703 参照

opengl - OpenGL ピクセル パーフェクト 2D 描画

私は2Dエンジンに取り組んでいます。すでにかなりうまく機能していますが、ピクセルエラーが発生し続けています。

たとえば、私のウィンドウは 960x540 ピクセルで、(0, 0) から (959, 0) までの線を引きます。スキャンライン 0 のすべてのピクセルが色に設定されることを期待しますが、そうではありません。右端のピクセルは描画されません。ピクセル 539 に垂直に描画すると、同じ問題が発生します。描画するには、(960, 0) または (0, 540) に描画する必要があります。

私はピクセル時代に生まれたので、これは正しい結果ではないと確信しています。画面のサイズが 320x200 ピクセルの場合、0 から 319 までと 0 から 199 までを描画でき、画面がいっぱいになりました。これで、右/下のピクセルが描画されていない画面になります。

これはさまざまなことが原因である可能性があります.openglラインプリミティブがピクセルからピクセルまで包括的に描画されると予想される場合、最後のピクセルは実際には排他的ですか? それですか?私の射影行列は間違っていますか? 私は、960x540 のバックバッファを持っている場合、実際には 1 ピクセル多いという誤った仮定をしていますか? 他の何か?

誰か助けてくれませんか?私はこの問題を長い間調べてきましたが、大丈夫だと思っていたときはいつでも、しばらくすると実際にはそうではないことがわかりました。

これが私のコードの一部です。可能な限り削除しようとしました。line-function を呼び出すと、すべての座標に 0.375、0.375 が追加され、ATI アダプターと nvidia アダプターの両方で正しくなります。

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

html - 埋め込みフォントを使用したピクセル パーフェクトな HTML から PDF への変換

しばらくの間、この問題に頭を悩ませていました... Flash + Fpdf ( http://santaspencil.com/desktopを参照) でこれを行うことができます。

ただし、Flash はモバイル プラットフォームでは十分にサポートされていないため、別のもの (HTML5?) に移行する必要があると感じています。私が見つけた唯一の問題は、Flash を使用しない限り、Web ページに埋め込まれたフォントが PDF 内でレンダリングされたときの正確な外観を得ることができないことです。

これはできますか?... HTML5 で埋め込みフォントを使用して、ピクセル パーフェクトな PDF をレンダリングできますか?

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

c# - スプライト シート アニメーション、XNA でのピクセル パーフェクト コリジョン

XNA でスプライト シート アニメーションを使用しており、ピクセル パーフェクト コリジョンを使用したいと考えています。私の問題は、使用しているスプライトシートの一部をチェックするのではなく、スプライトシートの現在のピクセルが透明かどうかをピクセルの完全な衝突がチェックすることです。これは私のコードです:

スプライト シートの特定の部分を選択し、それに対する衝突をチェックする方法を知りたいです。この MSDN ガイドを使用しました。

編集:私はそれを理解することができました、代わりにこれを使用しました

フレームは、幅と高さの2つの写真を含むスプライトシートを使用するため0、最初と2番目など、開始した場合です。872*87100

Edit2: 問題は、一度ピクセルパーフェクトをヒットすると機能しなくなるため、1 ヒットでしか機能しないことです。

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

python - pygame:ラインに対するピクセル完璧な衝突?

1 つまたは 2 つの問題に関する質問があります。Pygame を使用して描画ゲームを作成しています。

ボール同士や壁に対して、表面の内部で跳ね返るボールがあります。マウスを使用すると、ボールが跳ね返る直線を描くこともできます。

ボールの Surface と Rect をカバーする ball.png があるため、ボールは pygame.image を使用して描画されます。しかし、線については単純な長方形を返す pygame.draw.line() を使用しています。

そして、私の現在の最大の問題:

各線を独自の Surface オブジェクトに描画し、これらをより大きな「ゲーム キャンバス」にブリットすることにしました。これは、ここで提供されているピクセルの完全な衝突検出と surfarray.array_colorkey() を使用したかったためです。そのためには、基礎となる Surface が必要です (ボールには pygame.image によって返される画像 Surface があります)。衝突アルゴリズムの透明度の側面を使用できるように、線に Surface が必要です。そうしないと、ボールが線を包む Rects から跳ね返ります。

Q1) 線を引く良い方法はありませんか? 画像やスプライトに似たものを使用したいと思います。そのようなことはありますか?

Q2) いいえの場合、「ゲーム キャンバス」の座標を使用して小さい面に線を描画するのが比較的簡単で、線が途切れず、上記のピクセル パーフェクト コリジョンが機能するように、線ごとに面を作成するにはどうすればよいですか? ?

Q3) 私が完全にオフになっている場合/衝突、検出、描画などを行うためのより良い方法がある場合.

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

alignment - Photoshop はピクセルを mm に完全に揃えます

こんにちは、下の画像から、1mm 離れて設定されたガイドがいくつか表示されますが、私が描いたピクセル線は整列されておらず、それらを mm に整列させることもできません。アンカー ツールで線を移動すると、線の堅さが失われ、他のピクセルににじみます。ピクセルをmmに合わせる方法を知っている人はいますか?

私に欠けているものかもしれません

サンプル画像 http://img401.imageshack.us/img401/51/ruleo.jpg

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

android - Android での回転ビットマップの衝突検出

Android ゲームでピクセル単位の衝突検出が必要です。「通常の」ビットマップ (回転されていない) との衝突を検出するコードをいくつか書きました。正常に動作します。ただし、回転したビットマップでは取得できません。残念ながら、Java には回転した四角形のクラスがないため、自分で実装しました。画面に対する四隅の位置を保持し、ビットマップの正確な位置/レイヤーを記述します。「アイテムサーフェス」と呼ばれます。検出を解決するための私の計画は次のとおりでした。

  1. 異なる itemSurfaces の交差を検出する
  2. 重なり面積の計算
  3. 上位 itemSurface/bitmap に関連してこれらの領域を設定します
  4. 各単一ピクセルを他のビットマップの対応するピクセルと比較します

さて、1枚目と2枚目で悩んでいます。誰かがアイデアを持っているか、コードを持っていますか? たぶん、Java/Android ライブラリには既にコードがあり、私はそれを見つけられませんでした。

0 投票する
3 に答える
3026 参照

actionscript-3 - AS3 ピクセルパーフェクトな描画?

私が使用しているとき:

必要な黒い線が得られますが、その隣に灰色のピクセルが浮かんでいます。あいまいなピクセルを追加するスムージング/アンチエイリアシングをオフにする方法はありますか?

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

html - IE6/IE7入力送信ボックスモデルのジレンマ

今日、divからinputsまですべてのスタイルを設定する汎用ボタンクラスを作成するときに遭遇した奇妙なバグ。input [type = submit]に関しては、ほとんどのブラウザが異なるボックスモデルを使用しているようです。

最近のほとんどのブラウザ(ie9 +、ff、chromeなど)は、間違いがなければボーダーボックスを使用する送信を除いて、すべての入力にコンテンツボックスボックスモデルを使用します。

基本的に、高さを100に設定し、パディングを10に設定すると、送信を除くすべての入力の高さは120になりますが、送信の高さは100になります。

これは、ボックスサイズとそのブラウザプレフィックスを使用して簡単に修正できます。しかし、私の問題は、同じことをするがボックスサイズ設定をサポートしていないIE6/7にあります...

これで、半分にカットされた送信を除いて、すべての入力がフルハイトで表示されます。条件付きコメントとは別に、コンテンツボックスまたは別の修正を強制するためにどのようなオプションが必要ですか?

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

css - aが表示されているときにChromeがピクセルパーフェクトではない:ブロック

[this] [1]フィドルでわかるように、ホバーすると、のホバー状態はa常にulより1ピクセル高くなります。(これはフィドルで確認できます。境界を越えてもulかまいません)これはChromeでのみ発生します(FF en IE10でもテストされていますが、問題はありません)。それに対する解決策はありますか?

注:overflow: hiddenオーバーフローを他のもの(特にサブメニュー)に表示したいので、これは解決策ではありません。

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

xaml - Windows Phone 8 デバイスでのピクセルの位置合わせ

WP8 デバイス (Lumia 920) で単純なフルスクリーン ビットマップを表示しようとしています。

ScaleFactor 160 と 800x480 の仮想解像度を使用して、1280x768 の画面があります。

黒/白の市松模様のビットマップを表示した結果を次に示します (ぼやけています)。

そして、明らかに、UseLayoutRoundingどこでも True です。

では、高解像度の Windows Phone 8 デバイスでビットマップをピクセル アラインすることは可能ですか?

更新: 800x480 エミュレーター (800x480 画像) でチェック - 完全に鮮明。1280x768 エミュレータ - ぼやけ、デバイスと同じ :/

また、背景が市松模様の Web ページ(注: 1280x768 の画像) を開くviewport width=device-widthと、同じ画像がぼやけます。それは、Direct3D を使用する以外に、Lumia で鮮明なフルスクリーン画像を取得する方法がないということですか?

XAML:

ズームされたフラグメント:

ここに画像の説明を入力