Toon posts:

[SVG] Geanimeerde text **

Pagina: 1
Acties:

Verwijderd

Topicstarter
Ik ben bezig met een statistieken systeem in php waaruit ik SVG staafdiagrammen laat genereren. Dit is allemaal geen probleem.

Mijn vraag is of het mogelijk is om text geanimeerd weer te geven, dus bijvoorbeeld van links naar rechts te laten bewegen? Het enige wat mij lukt is om text te laten roteren.

  • curry684
  • Registratie: Juni 2000
  • Laatst online: 13-08 16:46

curry684

left part of the evil twins

Geen idee wat SVG is maar je hoofdplatform is iig PHP (in topictitle aangepast). Leg eens een stuk preciezer uit wat je wilt, wat je hebt, hoe je denkt dat te doen etc. :?

Professionele website nodig?


Verwijderd

Topicstarter
Voorbeeldje om een rechthoek maken en vervolgens te animeren.

code:
1
2
3
<rect x="10" y="400" width="15" height="100" fill="#FFFFFF" stroke="#0ebb00" stroke-width="0"> 
<animate attributeName="y" from="400" to="300" begin="load" dur="0.1s" fill="freeze" />
</rect>


Op deze manier druk ik tekst af dat tevens 90 graden geroteerd wordt:
code:
1
<text x="38" y="250" transform="rotate(-90, 38, 250)" style="fill: #FFFFFF; ">140 </text>

Nu wil bovenstaande laten bewegen over de y-as, zoals ik ook doe bij 1e code.
Ik kan nergens vinden hoe ik dit moet doen. Heb al het één en ander geprobeerd, maar geen succes.

[ Voor 46% gewijzigd door Verwijderd op 24-06-2003 13:30 . Reden: spelfoutje ]


  • whoami
  • Registratie: December 2000
  • Laatst online: 01:57
Dit hoort meer thuis in W&G.
P&W -> W&G.

https://fgheysels.github.io/


  • RM-rf
  • Registratie: September 2000
  • Laatst online: 00:15

RM-rf

1 2 3 4 5 7 6 8 9

code:
1
2
3
4
5
6
<text x="38" y="250" transform="rotate(-90, 38, 250)" 
         style="fill: #FFFFFF; ">
   <animate attributeName="y" from="400" to="300" 
                   begin="load" dur="0.1s" fill="freeze" />
140 
</text>


animate is gewoon een childelement van het te animeren element

[ Voor 55% gewijzigd door RM-rf op 24-06-2003 14:18 ]

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen


Verwijderd

Topicstarter
Op zich erg logisch! THANX!

Verwijderd

curry684 schreef op 24 June 2003 @ 13:17:
Geen idee wat SVG is maar je hoofdplatform is iig PHP (in topictitle aangepast). Leg eens een stuk preciezer uit wat je wilt, wat je hebt, hoe je denkt dat te doen etc. :?
http://www.w3.org/TR/SVG/

Verwijderd

Topicstarter
Ik heb nog even een andere vraag, anders moet ik weer nieuwe topic openen.
Ik genereer nu wat staafdiagrammen op het scherm.
Is het mogelijk om via een link in svg, deze diagrammen fullscreen te tonen.
Dus door middel van een link de viewbox aan te passen?

[ Voor 9% gewijzigd door Verwijderd op 25-06-2003 11:49 ]


  • RM-rf
  • Registratie: September 2000
  • Laatst online: 00:15

RM-rf

1 2 3 4 5 7 6 8 9

Verwijderd schreef op 25 June 2003 @ 11:41:
Ik heb nog even een andere vraag.
Ik genereer nu wat staafdiagrammen op het scherm.
Is het mogelijk om via een link in svg, deze diagrammen fullscreen te tonen.
Dus door middel van een link de viewbox aan te passen?
nee de viewbox wordt gegenereerd door het display-programma of de window.manager (alhoewel dit enigszins dubbel is, SVG kent zelf ook de viewbox, echter deze wordt altijd gerelateerd aan de window waarbinnen de SVG wordt weergegeven, het is een methode het maatsysteem aan te passen)

wil je de afbeelding vergroten, moet je een opdracht hiertoe versturen naar de 'drager', bv de html-pagina waarbinnen SVG wordt weergegeven, zoiets zou met DOmscripting wel mogelijk zijn, maar ik meen dat de adobe-plugin hierin beperkt is (staat niet, of slechts beperkt toe uitwisseling van adata tussen plugin en pagina).

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen


Verwijderd

Topicstarter
Nog een andere vraag. Ik heb nu schaduw om mijn staafdiagrammen heen middels de volgende code:

code:
1
2
<feGaussianBlur in="SourceAlpha" stdDeviation="0.5" result="blur2" style="stroke:#FFFFFF;"/>
<feOffset in="blur2" dx="-1" dy="0" result="offsetBlur2"/>

Nu wil ik deze schaduw een andere kleur geven, maar het blijft bij mij zwart.
Op zich een normale kleur voor schaduw, maar ik wil hem wit hebben.
Ik heb geprobeerd een style aan de feGaussianBlur te hangen, maar er verandert bij mij niks.

Is het mogelijk om deze kleur te veranderen?
Zo ja, hoe doe ik dat?

RM-rf nog bedankt voor je vorige reply!

[ Voor 11% gewijzigd door Verwijderd op 25-06-2003 15:02 . Reden: edit ]


  • André
  • Registratie: Maart 2002
  • Laatst online: 19-08 12:30

André

Analytics dude

Even half offtopic:
http://home.deds.nl/~svg/
Dit is een site waar ik een groot deel van mijn SVG kennis weggehaald heb.

Verwijderd

Topicstarter
André schreef op 25 June 2003 @ 15:22:
Even half offtopic:
http://home.deds.nl/~svg/
Dit is een site waar ik een groot deel van mijn SVG kennis weggehaald heb.
Die staat bij mij ook al een paar dagen bij mijn favorieten.
Goeie site om te beginnen, maar gaan niet overal op in.

  • RM-rf
  • Registratie: September 2000
  • Laatst online: 00:15

RM-rf

1 2 3 4 5 7 6 8 9

Verwijderd schreef op 25 June 2003 @ 15:02:
Nog een andere vraag. Ik heb nu schaduw om mijn staafdiagrammen heen middels de volgende code:

code:
1
2
3
<feGaussianBlur in="SourceAlpha" 
   stdDeviation="0.5" result="blur2" style="stroke:#FFFFFF;"/>
<feOffset in="blur2" dx="-1" dy="0" result="offsetBlur2"/>

Nu wil ik deze schaduw een andere kleur geven, maar het blijft bij mij zwart.
Op zich een normale kleur voor schaduw, maar ik wil hem wit hebben.
Ik heb geprobeerd een style aan de feGaussianBlur te hangen, maar er verandert bij mij niks.

Is het mogelijk om deze kleur te veranderen?
Zo ja, hoe doe ik dat?
feGaussianBlur is niet zozeer een element, maar een filter, dat een transformatie van een bestaand element inhoud, feitelijk blurred het enkel de alpha-laag (de tranpsrantie-laag van een element, en in die zin exact een schaduw-beeld)

je kunt heel veel filters gebruiken foor verschillende doeleinden, er is er ook eentje voor kleurtransities, feColorMatrix:
http://www.w3.org/TR/2002...ilters.html#feColorMatrix
(het kost me echter altijd een halve dag die kleurmatrix-berekening te doorgronden, het ding is nogal lastig, maar de mogelijkheden zijn enorm, en de methode is een erkende vorm voor kleurtransities, ieder grafisch programma werkt er in essentie mee)

[ Voor 5% gewijzigd door RM-rf op 25-06-2003 15:31 ]

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen

Pagina: 1