Three.js: Pixeles élek a 3D-s modellen.

Three.js: Pixeles élek a 3D-s modellen.
2018-05-26T12:30:55+02:00
2018-06-02T07:43:55+02:00
2022-10-15T21:35:18+02:00
BIG W
Sziasztok!

Gyanítom, hogy egy itthon nem annyira népszerű js framework miatt nem kapok választ, de egy próbát megér:

Van egy CylinderGeometry-m, amivel konkrétan hengert képzek radiálisan. Viszont nagyon csúnyán pixelesek az élei, és igazából a netet böngészve sem találtam megoldásra, hogy lehetne ezt elsimítani.

Van egy ilyen js-es kódrészletem:

var geometry = new THREE.CylinderGeometry(25, 25, 5, 25); var materials = [ new THREE.MeshBasicMaterial({color:0x000000,side:THREE.DoubleSide}), new THREE.MeshBasicMaterial({color:0x000000,side:THREE.DoubleSide}), new THREE.MeshBasicMaterial({map:new THREE.TextureLoader().load(image),side:THREE.DoubleSide}) ]; var cylinder = new THREE.Mesh(geometry,materials);
Szóval a kérdés az, hogy hogyan lehetne ezt szebbé tenni?
Üdv,
W.
Mutasd a teljes hozzászólást!
three.js / documentation -n beállítva a paremétereidet, nekem nem tűnik pixelesnek, de valóban: a 25-szög ekkorában még nem nem igazán kör, és az is számít, hogy mi van azon a textúrán. A renderernek van egy antialias paramétere amúgy (three.js / documentation ), de attól csodát nem remélnék.
Screenshotot esetleg mellékelhetnél.
Mutasd a teljes hozzászólást!

  • Bocsi, tessék. :)

    Szerk.:
    Igazából a textúrán egy kép van, ami most így nem igazán publikus (szerzői jogok miatt). De bármilyen jpg-s, vagy png-s képet berakok a henger tetejére, pixelesen reagál.
    Mutasd a teljes hozzászólást!
    Csatolt állomány
  • Szép ez a kép, de én inkább olyanra gondoltam, ahol a 25-szögű henger látható a pixeleződésével.
    Mutasd a teljes hozzászólást!
  • Igaz, már pár napja el kellett fogadnom a megoldásodat, de sikerült ezt elkerülni.:D
    A lényeg, hogy a megoldás a válaszodban volt, hogy kicsit kevésnek találtad a 25 szöget. A kép, amit küldtem, nem a legjobb minőség nyilván.:D De a lényeg az lett volna, hogy egy hengert rajzoljak ki, pontosabban hokikorongot, ami régi paraméter értékekkel pixelessé vált. növeltem a szögeket, aminek köszönhetően kevésbé vált pixelessé, igaz, tökéletes nem lett, de szebb. Szóval nem a képpel volt a gond, hanem az alakzat szögeivel:





    var geometry = new THREE.CylinderGeometry(25, 25, 5, 360); var materials = [ new THREE.MeshBasicMaterial({color:0x000000,side:THREE.DoubleSide}), new THREE.MeshBasicMaterial({color:0x000000,side:THREE.DoubleSide}), new THREE.MeshBasicMaterial({map:new THREE.TextureLoader().load(image),side:THREE.DoubleSide}) ]; var cylinder = new THREE.Mesh(geometry,materials);
    Köszönöm! :)
    W.
    Mutasd a teljes hozzászólást!
Tetszett amit olvastál? Szeretnél a jövőben is értesülni a hasonló érdekességekről?
abcd