Three.js: OutlinePass Π½Π΅ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ с ΡΠΎΠΎΡ‚Π½ΠΎΡˆΠ΅Π½ΠΈΠ΅ΠΌ пиксСлСй 2

Π‘ΠΎΠ·Π΄Π°Π½Π½Ρ‹ΠΉ Π½Π° 21 Π°ΠΏΡ€. 2017  Β·  3ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ  Β·  Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ: mrdoob/three.js

Π’ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ ΠΏΡ€ΠΎΡ…ΠΎΠ΄Π° ΠΊΠΎΠ½Ρ‚ΡƒΡ€Π° ΡΠΎΠΎΡ‚Π½ΠΎΡˆΠ΅Π½ΠΈΠ΅ пиксСлСй установлСно Π½Π° 1.
https://github.com/mrdoob/three.js/blob/master/examples/webgl_postprocessing_outline.html#L161

Π‘Ρ†Π΅Π½Π° нСчСткая, ΠΈ Ссли ΠΌΡ‹ Π·Π°ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚ΠΈΡ€ΡƒΠ΅ΠΌ строку ΠΈ Π²ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡΡ ΡΠΎΠΎΡ‚Π½ΠΎΡˆΠ΅Π½ΠΈΠ΅ΠΌ пиксСлСй устройства, сцСна Π±ΡƒΠ΄Π΅Ρ‚ сТата Π΄ΠΎ Π»Π΅Π²ΠΎΠ³ΠΎ Π½ΠΈΠΆΠ½Π΅Π³ΠΎ ΡƒΠ³Π»Π°, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΌ снимкС экрана:
image

ВСрсия Three.js
  • [] Dev
  • [x] r84
  • [] ...
Π‘Ρ€Π°ΡƒΠ·Π΅Ρ€
  • [ ] ВсС ΠΎΠ½ΠΈ
  • [x] Chrome
  • [ ] Fire Fox
  • [] Internet Explorer
ΠžΠΏΠ΅Ρ€Π°Ρ†ΠΈΠΎΠ½Π½Ρ‹Π΅ систСмы
  • [x] ВсС ΠΎΠ½ΠΈ
  • [] Windows
  • [] macOS
  • [] Linux
  • [] Android
  • [] iOS
ВрСбования ΠΊ ΠΎΠ±ΠΎΡ€ΡƒΠ΄ΠΎΠ²Π°Π½ΠΈΡŽ (Π²ΠΈΠ΄Π΅ΠΎΠΊΠ°Ρ€Ρ‚Π°, устройство VR, ...)

Π‘Π°ΠΌΡ‹ΠΉ ΠΏΠΎΠ»Π΅Π·Π½Ρ‹ΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

ΠŸΠΎΡ…ΠΎΠΆΠ΅, Ρ‡Ρ‚ΠΎ EffectComposer Π½Π΅ ΠΎΠ±Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π΅Ρ‚ pixelRatio установлСнноС Π² WebGLRenderer ΠΏΡ€ΠΈ создании WebGLRenderTarget .

Π― ΠΏΡ€Π΅Π΄Π»Π°Π³Π°ΡŽ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ ΠΎΠ±Ρ…ΠΎΠ΄Π½ΠΎΠΉ ΠΏΡƒΡ‚ΡŒ:

  1. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ нСстандартного Ρ€Π°Π·ΠΌΠ΅Ρ€Π° Π½Π°Π±ΠΎΡ€Π° для effectFXAA :
effectFXAA.setSize = function(width, height) {
    this.uniforms.resolution.value.set(1 / width, 1 / height);
};
  1. Π’Ρ‹Π·ΠΎΠ² composer.setSize с ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΡƒΠΌΠ½ΠΎΠΆΠ΅Π½Π½Ρ‹ΠΌΠΈ width ΠΈ height Π²ΠΎ врСмя ΠΈΠ½ΠΈΡ†ΠΈΠ°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΈ измСнСния Ρ€Π°Π·ΠΌΠ΅Ρ€Π° ΠΎΠΊΠ½Π°:
var size = renderer.getSize();
var pixelRatio = renderer.getPixelRatio();
composer.setSize(width * pixelRatio, height * pixelRatio);

ВсС 3 ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

/ ΠΏΠΈΠ½Π³ @ spidersharma03

Π― ΠΏΠΎΡΠΌΠΎΡ‚Ρ€ΡŽ

ΠŸΠΎΡ…ΠΎΠΆΠ΅, Ρ‡Ρ‚ΠΎ EffectComposer Π½Π΅ ΠΎΠ±Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π΅Ρ‚ pixelRatio установлСнноС Π² WebGLRenderer ΠΏΡ€ΠΈ создании WebGLRenderTarget .

Π― ΠΏΡ€Π΅Π΄Π»Π°Π³Π°ΡŽ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ ΠΎΠ±Ρ…ΠΎΠ΄Π½ΠΎΠΉ ΠΏΡƒΡ‚ΡŒ:

  1. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ нСстандартного Ρ€Π°Π·ΠΌΠ΅Ρ€Π° Π½Π°Π±ΠΎΡ€Π° для effectFXAA :
effectFXAA.setSize = function(width, height) {
    this.uniforms.resolution.value.set(1 / width, 1 / height);
};
  1. Π’Ρ‹Π·ΠΎΠ² composer.setSize с ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΡƒΠΌΠ½ΠΎΠΆΠ΅Π½Π½Ρ‹ΠΌΠΈ width ΠΈ height Π²ΠΎ врСмя ΠΈΠ½ΠΈΡ†ΠΈΠ°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΈ измСнСния Ρ€Π°Π·ΠΌΠ΅Ρ€Π° ΠΎΠΊΠ½Π°:
var size = renderer.getSize();
var pixelRatio = renderer.getPixelRatio();
composer.setSize(width * pixelRatio, height * pixelRatio);
Π‘Ρ‹Π»Π° Π»ΠΈ эта страница ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ?
0 / 5 - 0 Ρ€Π΅ΠΉΡ‚ΠΈΠ½Π³ΠΈ

Π‘ΠΌΠ΅ΠΆΠ½Ρ‹Π΅ вопросы

kdilayer picture kdilayer  Β·  62ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ

goodsign picture goodsign  Β·  101ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ

danrossi picture danrossi  Β·  210ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ

arefin86 picture arefin86  Β·  64ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ

fernandojsg picture fernandojsg  Β·  85ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ