[ Príspevkov: 4 ] 
AutorSpráva
Offline

Užívateľ
Užívateľ
svg rotacia

Registrovaný: 14.11.10
Prihlásený: 22.09.17
Príspevky: 129
Témy: 27 | 27
NapísalOffline : 24.07.2012 15:56 | svg rotacia

Ahojte,
prosím Vás, pozná niekto spôsob ako otočiť obrázok vytvorený v SVG ? V ukážke je zelený obdĺžnik, ktorý rotuje po osiach X a Y, ja by som potreboval vytvoriť podobnú rotáciu, s tým rozdielom, že by sa jednalo o rotáciu v tretom rozmere - os Z (modré obdĺžniky). Skúšal som už rôzne príkazy, ale nič mi nefunguje (červené obdĺžniky).

Môže to byť animované ale aj statické, môže byť využitý aj javascript.

Ukážka: http://jsfiddle.net/Vv345/4/

Vopred ďakujem pekne za každú radu.


Offline

Čestný člen
Čestný člen
svg rotacia

Registrovaný: 11.08.07
Príspevky: 4088
Témy: 34 | 34
Bydlisko: Brno
NapísalOffline : 24.07.2012 16:11 | svg rotacia

Cau, specifikaciu 3D transforms najdes na http://www.w3.org/TR/SVG-Transforms/ , skus tam pozriet, ake su spravne hodnoty. (Nie je pri rotaciach potrebne uviest jednotky, tzn. napriklad 45deg miesto 45?)
Mam divne tusenie, ze budes musiet nastavit vlastnost perspective (tiez je popisana v spec), take nieco sa tusim robilo v CSS 3D transformaciach (aj ked ich specifikacia sa teraz trochu zmenila).
Skus sa teda pozriet na hento ^ a ked nie, pohram sa s tym ja, len este nikdy som s tym nerobil.


Offline

Užívateľ
Užívateľ
svg rotacia

Registrovaný: 14.11.10
Prihlásený: 22.09.17
Príspevky: 129
Témy: 27 | 27
Napísal autor témyOffline : 25.07.2012 15:12 | svg rotacia

Presiel som si tu specifikaciu, skusal som CSS, skusal som pridat aj jednotku deg, aj vlastnost perspective, sedim tu nad tym uz niekolko hodin, ale stale sa mi to nedari vytvorit.

Na nete som nenasiel ziadny priklad na takuto rotaciu, natrafil som jedine na taketo priklady:

Avsak kedze pri tychto prikladoch boli pouzite elementy <path> (path = element, ktoremu sa zadaju lubovolne suradnice, ktore sa nasledne spoja a vytvori sa tak v podstate lubovolny tvar), myslim si, ze sa nejedna o klasicku rotaciu (napr. ciary, stvorca, obldznika), ale "iba" o JS funkciu, ktora v pravidelnych casovych intervaloch generuje suradnice, ktore tymto elementom priradi. Cize akasi deformacia jednotlivych elementov, ktora navonok posobi ako rotacia. Tato metoda by pri zlozitejsich elementoch bola zrejme velmi narocna.

Ukazka niecoho co som skusal: http://jsfiddle.net/Vv345/15/

Ďuri prosim ta pekne, ak by si si na to nasiel cas, bol by som ti velmi vdacny :)


Offline

Užívateľ
Užívateľ
svg rotacia

Registrovaný: 14.11.10
Prihlásený: 22.09.17
Príspevky: 129
Témy: 27 | 27
Napísal autor témyOffline : 26.07.2012 15:14 | svg rotacia

podarilo sa mi to vyriesit, staci pouzit atribut
Kód:
transform="scale(0.5 1)"
, ktory meni velkost obrazka, vysledkom je rovnaky efekt ako 3D rotacia pomocou CSS.


 [ Príspevkov: 4 ] 


svg rotacia



Podobné témy

 Témy  Odpovede  Zobrazenia  Posledný príspevok 
V tomto fóre nie sú ďalšie neprečítané témy.

SVG editor

v Grafické programy

1

598

12.12.2010 18:40

Ďuri

V tomto fóre nie sú ďalšie neprečítané témy.

HTML - AJAX - SVG

v Frontend

8

756

25.03.2012 22:15

Osmargel

V tomto fóre nie sú ďalšie neprečítané témy.

WordPress a SVG obrazky

v CMS

3

469

17.12.2014 16:43

hatto13

V tomto fóre nie sú ďalšie neprečítané témy.

SVG vykreslovanie v cecku

v Backend

12

850

19.06.2011 17:52

ice-g



© 2005 - 2026 PCforum, edited by JanoF