Toon posts:

[JS] berekenen probleempje...

Pagina: 1
Acties:

Onderwerpen


Acties:
  • 0 Henk 'm!

Verwijderd

Topicstarter
Hoi,

Ik ben bezig met een UML achtig tooltje met het canvas element, en het werkt al best tof, maar nu zit ik met een probleempje. Het is niet zozeer een programmeer probleem, maar ik heb gewoon niet zo goed opgelet bij wiskunde vroeger blijkbaar:

ik heb bijvoorbeeld een schuine lijn als een \ en nu wil ik met de muis zien of deze er op staat.
de volgende waardes weet ik, de x en y van de muis, en van het begin en eind punt eronder... bedoeling hiermee is om een bolletje bij je cursor te krijgen op de lijn om er een nieuw punt aan toe te voegen.

ik dacht zelf aan zoiets, maar dit is 'm dus niet...

code:
1
2
3
4
5
if( (start_point.x < mouse_x && end_point.x > mouse_x) &&
(start_point.y < mouse_y && end_point.y > mouse_y))
{
     console.log(mouse_x, mouse_y );
}


mijn dank is groot als iemand me hier mee kan helpen :)

[ Voor 7% gewijzigd door Verwijderd op 11-08-2008 20:22 ]


Acties:
  • 0 Henk 'm!

Verwijderd

Je zal met verhoudingen aan de slag moeten. Uit de losse pols:
JavaScript:
1
2
3
4
5
function pointOnLine(xPoint, yPoint, xStart, yStart, xEnd, yEnd) {
    var ratio1 = (xPoint - xStart) / (yPoint - yStart);
    var ratio2 = (xEnd - xStart) / (yEnd - yStart);
    return ratio1 == ratio2; 
}

Nu is deze functie wel heel streng (de verhoudingen moeten precies gelijk zijn). Ik laat het aan jou over om er een marge bij te implementeren.

Acties:
  • 0 Henk 'm!

  • r0bert
  • Registratie: September 2001
  • Laatst online: 30-07 02:32
Volgens mij moet je gewoon Pythagoras even e-mailen en heeft het op zich weinig met de code-technische kant te maken.

[ Voor 24% gewijzigd door r0bert op 11-08-2008 20:48 ]


Acties:
  • 0 Henk 'm!

Verwijderd

Topicstarter
ah, super bedankt! hier mee lukt mij het wel. dat het niks met programmeren te maken heeft zei ik dus ook al ;)

[ Voor 42% gewijzigd door Verwijderd op 11-08-2008 20:52 ]


Acties:
  • 0 Henk 'm!

  • Zip McOccup
  • Registratie: Februari 2001
  • Laatst online: 19-09 09:09
Verwijderd schreef op maandag 11 augustus 2008 @ 20:42:
Je zal met verhoudingen aan de slag moeten. Uit de losse pols:
JavaScript:
1
2
3
4
5
function pointOnLine(xPoint, yPoint, xStart, yStart, xEnd, yEnd) {
    var ratio1 = (xPoint - xStart) / (yPoint - yStart);
    var ratio2 = (xEnd - xStart) / (yEnd - yStart);
    return ratio1 == ratio2; 
}

Nu is deze functie wel heel streng (de verhoudingen moeten precies gelijk zijn). Ik laat het aan jou over om er een marge bij te implementeren.
Je moet wel opletten dat je met deze methode ook punten in het verlengde van de lijn meeneemt.
Dit kan je voorkomen door te testen of de x-coördinaat van de muis-cursor tussen de x-coördinaten van het lijnstuk valt. Dit kan uiteraard ook met de y-coördinaten. Je hoeft echter niet beide te testen/toetsen:

JavaScript:
1
2
3
4
5
function pointOnLine(xPoint, yPoint, xStart, yStart, xEnd, yEnd) {
    var ratio1 = (xPoint - xStart) / (yPoint - yStart);
    var ratio2 = (xEnd - xStart) / (yEnd - yStart);
    return (ratio1 == ratio2 && xPoint <= xEnd && xPoint >= xStart); 
}


Volgens mij zou het zo moeten kunnen. Als het anders moet; You catch my drift ;)

[ Voor 0% gewijzigd door Zip McOccup op 12-08-2008 08:14 . Reden: typo ]