Die Canvas zeigt unten ( eingekreist) Möglichkeiten 3 Variable zu erhöhen oder zu verkleinern.
html-seminar.de/woltlab/attachment/1461/
So ein Kästchen ( Zahl und + -) wird durch die folgende Funktion erstellt.
function PlusMinus(x0,y0,w,h,was)
{
recZahlx=x0;
recZahly=y0;
recZahlBreite=w;
recZahlHoehe=h;
ctx1.lineWidth = 1;
ctx1.fillStyle = '#B5EC9B';
ctx1.strokeRect(recZahlx, recZahly, recZahlBreite,recZahlHoehe);
ctx1.fillRect(recZahlx, recZahly, recZahlBreite,recZahlHoehe);
ctx1.fillStyle = '#7EB5EA';
ctx1.fillStyle = 'black';
ctx1.fillText((was),recZahlx +10 , recZahly + recZahlHoehe*(2/3));
//////////////////
recPlusx=x0 + w;
recPlusy=y0;
recPlusBreite=30;
recPlusHoehe=h/2
ctx1.lineWidth = 1;
ctx1.fillStyle = '#B5EC9B';
ctx1.strokeRect(recPlusx, recPlusy, recPlusBreite,recPlusHoehe);
ctx1.fillRect(recPlusx, recPlusy, recPlusBreite,recPlusHoehe);
ctx1.fillStyle = '#7EB5EA';
ctx1.fillStyle = 'black';
ctx1.fillText(("+"),recPlusx+10,y0+recZahlHoehe/2 );
////////////////
recMinusx=x0+w;
recMinusy=y0+h/2;
recMinusBreite=30;
recMinusHoehe=15;
ctx1.lineWidth = 1;
ctx1.fillStyle = '#B5EC9B';
ctx1.strokeRect(recMinusx, recMinusy, recMinusBreite,recMinusHoehe);
ctx1.fillRect(recMinusx, recMinusy, recMinusBreite,recMinusHoehe);
ctx1.fillStyle = '#7EB5EA';
ctx1.fillStyle = 'black';
ctx1.fillText((" - "),recMinusx + 10,y0+recZahlHoehe );
}
function setzeUrsprung()
{
ctx1.fillStyle = '#B5EC9B';
ctx1.fillRect(links,100,200,60);
ctx1.strokeRect(links,100,200,60);
ctx2.fillStyle = '#B5EC9B';
ctx2.strokeRect(links+250,100,100,60);
ctx2.fillRect(links+250,100,100,60);
}
Diese Funktion wird dreimal aufgerufen und erzeugt so die 3 Kästchen.
Wenn ich jetzt diese Zahlen verändern will muss ich Plus oder Minus anklicken und abfragen ob sie angeklickt worden sind.
Beispiel Abfrage
var s2= xPos> recPlusx && xPos < recPlusx+recPlusBreite && yPos > recPlusy && yPos < recPlusy + recPlusHoehe
if (s2==true) { LaengeZahl(1) }
ich kann jetzt allerdings nur das 3. Kästchen anklicken. Das ist mir klar weil das zuletzt erstellt wird und die Variabeln im Program für jedes Kästchen den gleichen Namen haben.
Ich könnte jetzt für jedes Kästchen ein eigenes Porgaramm erstellen. Aber dann ersticke ich ja in Variablen.
Hat jemand einen Tipp wie ich das vermeiden kann?.