[SVG/Math]Positie control points berekenen voor een grafiek

Pagina: 1
Acties:

  • Michali
  • Registratie: Juli 2002
  • Laatst online: 22-03 18:12
Ik ben bezig met proberen van het grafisch weergegeven van gegevens in een grafiek. Ik heb besloten het in SVG te gaan doen, omdat dit gemakkelijk en snel te genereren is en precies de mogelijkheden biedt die ik nodig heb.

Nu heb ik het voor elkaar gekregen om een grafiekje te tekenen, maar de lijnen hieren lopen recht van het ene punt naar het andere. Nu wil ik graag dat over de punten een vloeiende lijn komt te lopen. Ik maak op moment al gebruik van het path element waarmee met de C en S commands een cubic Bezier curve is te tekenen.

Het probleem is dat ik echt geen idee heb hoe ik uitreken waar ik zo'n punt neer zou moeten zetten. Ik weet ook echt niet waar ik op zou moeten zoeken en wat ik zou moeten leren om het wel te kunnen. Mischien iemand die me een beetje op weg kan helpen?

Noushka's Magnificent Dream | Unity


  • alienfruit
  • Registratie: Maart 2003
  • Laatst online: 22-05 23:32

alienfruit

the alien you never expected

Stelling van pythogras? Of weet je juist niet de x,y positie van de verschillende punten in de grafiek? Kun je dat ook niet opvragen?

  • Michali
  • Registratie: Juli 2002
  • Laatst online: 22-03 18:12
Ik heb juist de data die in de grafiek komt te staan. Nu bereken ik hieruit de plaats waar de punten moeten komen te staan. Dit gaat allemaal perfect zo. Het gaat hier om vector lijnen (SVG => Scalable Vector Graphics). Nu teken ik de path met de line command en dat wil ik gaan doen met de cubic bezier command. De plaats waar de punten komen te staan heb ik al. Nu wil ik alleen weten op welke plaats de control points moeten komen te staan, omdat deze punten bepalen hoe de kroming van de lijn is.

Mijn vraag was of iemand hier al ervaring mee heeft en weet hoe dit uit te rekenen is. Ik hoef niet de exacte methode te hebben, want ik verwacht al eigenlijk dat wel redelijk complex is zo uit te leggen. Ik wil alleen een zetje in de goed richting zodat ik weet wat ik moet leren om dit te kunnen of anders graag een aanbeveling om er niet aan te beginnen als het echt niet te doen is.

Noushka's Magnificent Dream | Unity


  • Sjaaky
  • Registratie: Oktober 2000
  • Laatst online: 22-04 07:04
Het is het best als je de lijn tekent volgens het algoritme dat svg definieert. Als svg je vertelt dat iets een B-spline is, kan je het misschien wel terug rekenen naar een aantal cubic beziers, maar je kunt beter gewoon een B-spline tekenen.

  • farlane
  • Registratie: Maart 2000
  • Laatst online: 22-05 16:53
Je kunt natuurlijk ook een hogere orde functie bepalen uit je punten en dan vervolgens toch rechte lijnen gaan tekenen. Ze lijken dan iig niet meer recht.

Somniferous whisperings of scarlet fields. Sleep calling me and in my dreams i wander. My reality is abandoned (I traverse afar). Not a care if I never everwake.


  • Juup
  • Registratie: Februari 2000
  • Niet online
Als je een algoritme hebt waarbij je de kromming in de punten moet opgeven dan heb je de verkeerde te pakken. Die kromming weet je niet. Jij wilt alleen de punten aangeven en daar zal toch ook wel een functie voor zijn? Laat eens eens tukje zien van hoe je met die "C en S commands een cubic Bezier curve" tekent?

Een wappie is iemand die gevallen is voor de (jarenlange) Russische desinformatiecampagnes.
Wantrouwen en confirmation bias doen de rest.


  • Michali
  • Registratie: Juli 2002
  • Laatst online: 22-03 18:12
Beetje laat, maar ik wil er weer even op terug komen. Het gaat dus hier om:

http://www.w3.org/TR/SVG1...thDataCubicBezierCommands

Voor het C command zijn 5 parameter nodig, respectievelijk zijn dat de x en y coordinaten van het control point aan het begin van de curve, de x en y coordinaten van het control point aan het eind van de curve en de x en y coordinaten van het punt zelf.

Het S command vraagt om 2 minder parameters omdat de waardes voor het control point gewoon gespiegeld gekopieerd worden van het punt aan het eind.

Plaatje wat het wat meer verduidelijkt is dit:

Afbeeldingslocatie: http://www.w3.org/TR/SVG11/images/paths/cubic02.png

Noushka's Magnificent Dream | Unity

Pagina: 1