3D projection

3 min read

Render 3D objekter direkte på PinePaper lærred. 3D projektionssystemet understøtter fem projektionstyper, fem primitive former, GPU- accelereret rendering, og et orbital kamera.

Oversigt

PinePaper 's 3D projektionssystem er et selvstændigt 0-afhængighedsbibliotek (~ 18KB minimeret), der gør 3D primitive som 2D polygoner på lærredet. Objekter kan vælges, trækkes og animeres sammen med almindelige 2D-elementer.

Projektionstyper

Vælg hvordan 3D objekter projiceres på 2D lærred:

Fremskrivning Varebeskrivelse
Perspektiver Realistisk dybde med forkortelse. Objekter længere væk synes mindre. Konfigurerbart synsfelt (FOV).
Ortografisk Ingen dybdeforvrængning. Parallelle linjer forbliver parallelle. Fælles for tekniske / tekniske tegninger.
Isometric Lige vinkel axonometrisk visning (30 ° akser). Populær i spilkunst og arkitektoniske diagrammer.
Kabinet Trådformet projektion, hvor dybdeaksen trækkes i halv skala og 45 °.
Kavalier Den obligatoriske projektion, hvor dybdeaksen trækkes i fuld skala og 45 °.

Primitiver

Fem build- i 3D former:

Primativ Varebeskrivelse
Cube Konfigurerbar størrelse
Sphere Konfigurerbar radius og segmenttælling
Cylinder Konfigurerbar radius og højde
Torus Konfigurerbare større / mindre radier
Cone Konfigurerbar radius og højde

Hver primitiv understøtter brugerdefinerede farver og rotation på alle akser.

GPU acceleration

Rendering vælger automatisk den bedste tilgængelige motor:

      • WebGPU beregne * * - hurtigste, bruges, når de er tilgængelige
      • WebGL2 transformere feedback * * - hurtig fallback
      • CPU * * - universel fallback

GPU acceleration aktiveres automatisk, når en scene overstiger 150 ansigter.

Kamera

Orbitalkameraet lader dig styre synsvinklen:

      • Position * * - hvor kameraet er i 3D-plads
      • Mål * * - hvor kameraet ser på (kredsløb center)
      • Synsfelt * * - perspektivforvrængning beløb (kun perspektiv tilstand)

Valg af & dragging 3D objekter

3D-objekter er valgbare og draggbare på lærredet, ligesom 2D elementer:

  • Klik på et 3D-objekt for at vælge det
  • Træk den tilbage
  • Animationer pause automatisk under træk og genoptage når udgivet
  • Den slæbte position fortsætter på tværs animationsrammer

3D projection Showcase skabelon

En præ-bygget skabelon viser 3D projicering system med flere primitiver, rotation animationer, og forskellige projektion typer. Find det i skabelonbiblioteket.

Begrænsninger

      • Standard animation forudsæt * * (fade, bounce, rulle, puls, etc.) er ikke understøttet på 3D-objekter. 3D objekter bruger deres egen rotation animation system gennem ThreeD rendering rørledning. Anvendelse af en standard animation til et 3D-objekt vil ikke have nogen effekt.
  • 3D objekter render som flad polygon fylder - ingen tekstur kortlægning, belysning, eller skygger.
  • Collision detektion mellem 3D-objekter er endnu ikke tilgængelig.

Tips

      • Start med isometrisk * * - det er den mest visuelt tiltalende for diagrammer og illustrationer
      • Brug rotation animationer * * - roterende 3D objekter giver en stærk følelse af dybde
      • Kombiner med 2D elementer * * - blande 3D primitive med tekst og former for infographic- stil kompositioner
      • Juster kameraafstand * * - Flyt kameraet yderligere for fladere perspektiv, tættere på dramatisk dybde
    • Relateret: * * [Animationer] (/features/animations)