HTML ligne dessin sans toile (juste JS)

Je suis en train d'utiliser de l'HTML et de tracer une ligne sur une page.

De tout ce que j'ai lu suggère HTML5 canvas tag est le meilleur à utiliser, mais j'ai besoin de la ligne pour se connecter à quelque chose sur la page, ce qui n'est pas dans une balise canvas, si la toile n'est pas bon pour moi (si vous voulez/besoin d'utiliser JS natif).

J'ai écrit (à partir de quelque chose que j'ai trouvé) une fonction qui fait ce que j'ai besoin mais le problème est qu'une fois la ligne s'affiche, tout le reste de la page disparaît.

J'ai trouvé que chaque fois que je changer de style en JavaScript tout, mais la forme disparaît.

La suppression de "du document.écrire" se termine avec rien en voie de disparition.

function draw(ax, ay, bx, by) {
var n, widthLine, i, x, y;
widthLine = 1;
if (Math.abs(ax - bx) > Math.abs(ay - by)) {
if (ax > bx) {
n = ax;
ax = bx;
bx = n;
n = ay;
ay = by;
by = n;
}
n = (by - ay) / (bx - ax);
for (i = ax; i <= bx; i++) {
x = i;
y = Math.round(ay + m * (x - ax));
document.write("<div style='height:" + lineWidth + "px;width:" + widthLine + "px;background-color:black;position:absolute;top:" + y + "px;left:" + x + "px;'></div>");
}
} else {
if (ay > by) {
n = ax;
ax = bx;
bx = n;
n = ay;
ay = by;
by = n;
}
n = (bx - ax) / (by - ay);
for (i = ay; i <= by; i++) {
y = i;
x = Math.round(ax + n * (y - ay));
document.write("<div style='height:" + lineWidth + "px;width:" + lineWidth + "px;background-color:black;position:absolute;top:" + y + "px;left:" + x + "px;'></div>");
}
}
}

OriginalL'auteur Craig Shipman | 2013-01-28

Leave a Reply

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *