V CSS nemůžeme vytvořit zaoblený tvar. HTML element můžeme v 3D posouvat, zvětšovat i rotovat, ale jeho body stále leží v jedné rovině. V CSS tak nelze konstruovat Bézierovy plochy. Proto oblá tělesa musíme emulovat pomocí celé řady na sebe navazujících HTML elementů.
Protože však stále pracujeme s HTML elementy, jejich počet na stránce je omezený. Stránka s desítkami tisíc divů nebude nikdy plynulá — animace se budou sekat, interaktivita zpomalí. Kompromis mezi „oblostí“ a počtem prvků je tedy nutné hledat velmi pečlivě. A často výsledný vzhled vylepšíme pomocí nějakého chytrého grafického triku.
Anuloid
Jedním z prvních těles, které si zkusíme emulovat, je anuloid. Výpočet souřadnic jeho vrcholů lze totiž snadno odhadnout z hlavy. Stejně jednoduše pak můžeme vytvořit i další toroidní tvary. V ukázce anuloidu jsou spoje mezi stranami přiznány, ale maskovány rozostřením hran pomocí gradientu — těleso tak působí docela kulatě.
Koule
Po anuloidu přichází náročnější výzva — emulace koule. Plošky můžeme na její povrch mapovat různými způsoby, od těch jednoduchých, kde vrcholy zvládneme spočítat z hlavy, až po např. Goldbergovy mnohostěny.
Možnosti emulace koule v CSS rozebírá i toto vlákno na StackOverflow. Řešení často používají jen 2D grafické triky, nebo pokud přejdou do 3D, jsou prvky nespojité — a nelze je tak jednoduše použít pro mapování povrchu.
Úplně nejjednodušší kontrukce, kde vrcholy dovede odhadnout každý, je jejich určení dle poledníků a rovnoběžek, odborně nazývané UV-mapování. Nevýhody ve formě různě velkých povrchů jsou vidět na první pohled.
Lepší přiblížení koule představuje 54 stěn odvozených z ořezané krychle. Výpočet vrcholů je tu ale už podstatně složitější.
Další možností jsou geodetické mnohostěny. Ty se skládají z trojúhelníků, a protože mají malý poměr zobrazené oblasti k ploše celého DIVu, nejsou příliš efektivní. Přesto nás přivádějí k už zmíněným Goldbergovým mnohostěnům.
Tady už jde o skutečně kvalitní aproximaci. Jenže její konstrukce je podstatně složitější. Goldberg základy této geometrie publikoval kolem roku 1937, a jak to tak bývá, čím novější matematika, tím náročnější. Tohle je výrazně těžší než divergence nebo rotace popsané o dvě století dříve.
Jeho práci navíc rozvinul Buckminster Fuller, génius 20. století, který si na těchto výpočtech postavil živnost. Svá řešení držel v tajnosti až do 70. let. Kopule podle něj postavené se opírají o tenzorový počet — a ten je třeba zvládnout perfektně. Jednodušší příklad tzv. Goldberg–Coxeterovy konstrukce je k vidění zde, ale jednoduché to rozhodně není :-).
Přesto ani tato aproximace pro nás není ideální. I přes krásnou symetrii a rovnoměrné napětí v hranách jsou některé plochy (např. pětiúhelníky označené zeleno-žlutě) znatelně menší než ostatní — a to není úplně žádoucí.
Proto si vytvoříme vlastní aproximaci koule. Možná nebude tak dokonale symetrická, ale plocha jednotlivých stran bude mnohem rovnoměrnější. Připadá vám to jako hodně složitý matematický úkol? Není třeba se bát — vysokou matematiku necháme stranou a přistoupíme k tomu jako kreativní programátoři. A ukážeme si, že výsledek, který by jinak vyžadoval analytický výpočet od špičkových matematiků, zvládneme my sami pomocí jednoduché iterace a znalostí ze střední školy.
Anuloid a koule ale nejsou jediné oblé tvary, které si můžeme zkusit. Existují elipsoidy, rotační tělesa různých průřezů a další. Už teď můžete začít přemýšlet, jak byste taková tělesa aproximovali a jak spočítat jejich vrcholy.