Graphik dreht sich in Richtung Maus - javarea.de Forum powered by javarea.de

Archivlink: javarea.de Forum > JavaScript > Graphik dreht sich in Richtung Maus

Vollständigen Link anzeigen: javarea.de Forum > JavaScript > Graphik dreht sich in Richtung Maus

Pages: [1]

geschrieben von vinz am 08.09.2006 - 20:46

Mir träumt es da von einem Script, dass es ermöglicht eine Graphik, wie z.B. ein Pfeil, nur um die eigene Achse drehen zu lassen und sich dabei automatisch immer Richtung Mauszeiger ausrichtet, aber dabei die Position nicht verändert. Der Pfeil (Graphik) soll dabei immer auf den Mauszeiger zeigen.
Könnt Ihr mir bitte helfen?

Vielen Dank

geschrieben von Klaush am 08.09.2006 - 23:17

Dein Wunsch ist widersprüchlich!

Du willst einen Pfeil der:
- immer in Richtung des Mauszeiger zeigt,
- und sich dennoch um seine eigene Achse dreht.

Sorry, aber die Logik versteh ich nicht.

geschrieben von René am 09.09.2006 - 08:30

@Klaus,

was ist daran unlogisch bzw. so will er es. Die Grafik soll ja nicht ständig rotieren sondern sich nur immer dem Mauszeiger zuwenden.

Aber eine Lösung ist mir unbekannt.

geschrieben von Micha am 09.09.2006 - 17:02

Hi,

mit SVGraphiken gehen es.

Micha

geschrieben von pyscho am 11.09.2006 - 07:57

@ micha

ob mit SVGraphiken einfacher geht weiss ich nicht so genau aber ich würde in Flash am einfachsten den Pfeil - Movieclip erstellen und ein Script dafür schreiben der die Maus bedient.

pyscho

geschrieben von Micha am 11.09.2006 - 08:28

Hi,

ich denke schon. Eine einfache Graphik ist recht einfach erstellt:

HTML-Quelltext

1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11: 
12: 
13: 
14: 
15: 
16: 
17: 
18:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" width="300" height="250">

<defs>
      <script type="text/javascript">
          <![CDATA[
      
          //Funktion zum drehen

      
          ]]>      
        </script>      
 </defs>	
		
		<line x1="10" y1="10" x2="10" y2="30" stroke="red" stroke-width="1px" />
		
</svg>

Die gezeichnete Linie hat zwei Koordianten P1 und P2. Mithilfe der Drehmatrix und einem ggb. Winkel kann man über Matrizenprodukte die beiden Koordinaten ausrechnen. Das es funktioniert, zeigt mein Tetris-Spiel in der Funktion rotate(). Falls sich das einer näher ansieht, bei mir sind die Winkel stets 1 bzw. -1, da ich lediglich um 90° drehen muss - das nur zur Info.

Micha