# Linien zeichnen



## firezz (7. Mai 2004)

Hallo,

Weiß jemand wie Linien mit JavaScript zeichnen lassen?  Es muss aber auch Anklicken der Linie klappen, d.h. wenn ich die gezeichnete Linie anklicke erschein ContextMenü.



viele Grüße
firezz


----------



## aquasonic (7. Mai 2004)

Mir wäre nicht bekannt dass du mit JavaScript Linien zeichenen könntest. Ich weiss nur dass du das mit HTML machen kannst und dann evt. (weiss ich nicht) mit JavaScript darauf zugreifen kannst...


----------



## firezz (7. Mai 2004)

*das geht...*

Hallo,

Linien zeichnen geht... in dem man mit Layern arbeitet. Hier ein Beispiel dafür: http://www.walterzorn.de/jsgraphics/jsgraphics.htm

Ich brauche aber die Event-Behandlung:-((

viele Grüße
firezz


----------



## firezz (7. Mai 2004)

*kennt sich hier niemand aus?*

Wo sind die JavaScript Profis Nur die AnfängerFragen beantworten?


Nicht böse sein, ist nur ein Ansporn


----------



## ka (9. Mai 2004)

huhu, 
also des eigentlich ganz einfach!

also hier mal ein Beispiel: 

[1] import java.awt.*;
[2]  public class wusa extends Frame
[3]  {
[4]    public wusa ()
[5]    {
[6]      super(" Fenster...");
[7]      this.setSize( 500, 200 );  // fenster größe
[8]      this.show();  // wird aufgerufen
[9]    }
[10]   public void paint( Graphics g ) // paint funktion mit der kannst du auch andere sachen malen /zeichnen
[11]   {
[12]     int laenge=50;
[13]     int x2=0;int y2=0;
[14]     for ( int i=0; i<360; i+=15)
[15]     {
[16]       y2= 100-(int)(Math.sin(Math.toRadians(i))*laenge);
[17]       x2= 250-(int)(Math.cos(Math.toRadians(i))*laenge);
[18]       g.drawLine(250,100,x2,y2);
[19]     }
[20]   }
[21]   public static void main( String args[]   )
[22]   {
[23]     wusa f= new wusa();
[24]   }
[25] }


wenn du da jetzt noch Fragen haben solltest sag bescheit ich helfe gerne ^^


----------



## firezz (10. Mai 2004)

*Java*

Hallo 'ka,

Danke für die Antwort, aber ich brauche Lösung in JavaScript 

In JavaScript ist es komplizierter (man muss DIV-Layers verwenden), ich habe zwar schon eine Library gefunden, mit deren Hilfe Linien zeichnen lassen, aber die EventBehandlung wird nicht unterstützt: um zum Beispiel auf das Klicken der Linie zu reagieren. Ich werde woll bei allen Mausklicken prüfen sollen, ob die Klickkoordinaet auf einer der Linien liegen. Performance wird schrecklich sein 

viele Grüße
firezz


----------



## Andreas Gaisbauer (10. Mai 2004)

Ja, denke auch das die Performance nicht berauschend sein wird. Was willst du genau machen? Wäre zu überlegen ob nicht Flash oder auch SVG die Sinnvollere Methode wären. Du musst entweder sämmtlich Koordinaten speichern oder zuminderst die Formel wie du die Koordinaten berechnen kannst (bei jedem Click ) Bei Überdeckung kannst du dann ja die Funktion deiner Wahl aufrufen. Oder du änderst die Bibliothek von Walter Zorn (der übrigens auch die geniale Drag'n'Drop Lib gechrieben hat ) insofern ab, das du automatisch jeder div (oder span) per default einen Event-Handler übergeben kannst. Ich hab mal eine Mini Beispiel für dich:


```
<html>
<head>

<script type="text/javascript">

var coords = new Array('100-300','10');

function test(elem){
  if(document.all){ //MSHTML
    var x = window.event.clientX;
    var y = window.event.clientY;
    alert('Du hast auf '+x+'|'+y+' geklicked - das ist das Element mit der ID '+elem.id);
  }
   /* hier kommt Gecko Code */
}

</script>
</head>
<body>

<script type="text/javascript">
var x = coords[0].split('-');
for(var a=x[0];a<x[1];a++){
  document.write('<span id="'+a+'" onclick="test(this)" style="width:1px; height:1px; background-color:red; position:absolute; left:'+a+'px; top:'+coords[1]+'px;"><img src="test.gif" width="1" height="1" border="0"></span>');
}
</script>
</body>
</html>
```
Das ganze ist nur IE tauglich im moment. 100-300 sind die Länge bzw die X-Position meiner Linie (also 200 px), 10 ist die Y-Position. Im Body gehe ich einfach durch und schreibe die <span>s mit den OnClick Handlern. Solange die Linien nicht zu komplex werden, sollte es klappen...


bye


----------

