Vonni: Gummiband zwischen zwei Punkten

Hallo liebe Selfhtml-Gemeinde,

ich bin zur Zeit damit beschäftigt eine Landkarte im Netz zu präsentieren. Dabei würde ich gern die Streckenmessung zwischen zwei Punkten mit anbieten, so dass der Nutzer sieht wo er geade hingedrückt hat. Allerdings fehlt mir dazu jeglicher Ansatz. Bin über jeden Hinweis und jeder bereits mit diesem Thema gemachte Erfahrung dankbar.

MfG. Vonni

  1. Hallo,

    zunächst einmal stellt sich mir folgende Frage (die Du Dir scheinbar auch noch nicht überlegt hast): Wie soll zunächst überhaupt die Ausgabe der Landkarte erfolgen (ich nehme mal an, das soll stattfinden)? Mal abgesehen davon, dass man dazu sicher eine komplexe (und teure) Datenbank bräuchte, müsste man ja daraus irgendwie eine Ausgabe generieren (z.B. serverseitig mit einem CGI, oder clientseitig mit Java (s. Map24.de) oder vielleicht (eher unkonventionell) mit Flash oder oder oder...).

    Mirko

    1. Hallo Mirko,

      ich schreibe zur Zeit an meiner Diplomarbeit und arbeite mit einer Firma zusammen, die mir einen entsprechendenden Server zur Verfügung stellt. Die Karte wird als gif oder jpg, also als Bild in die Seite geladen und die Bildkoordinaten werden in Gauß-Krüger-Koordinaten (also x,y) umgerechnet.... Bis hierhin steht die Sache!
      Jetzt soll dem Nutzer die Möglichkeit gegeben werden clientseitig in der Karte die Strecken (immer 2 Punkte) abzustecken und zu messen....auch das geht bereits! Zur verbesserten Übersichtlichkeit sollen jetzt die Punkte mit einem "Gummiseil" verbunden werden. Und hier suche ich einen Ansatz!!!

      Vonni

      1. Hallo,

        Jetzt soll dem Nutzer die Möglichkeit gegeben werden clientseitig in der Karte die Strecken (immer 2 Punkte) abzustecken und zu messen....auch das geht bereits! Zur verbesserten Übersichtlichkeit sollen jetzt die Punkte mit einem "Gummiseil" verbunden werden.

        ich fürchte, dass dies eine (fast) unlösbare Aufgabe ist. Selbst wenn es dir gelingt mit Hilfe von http://www.walterzorn.de/jsgraphics/jsgraphics.htm eine Linie zu zeichnen wirst du spätestens beim Löschen/Neuzeichnen der Linie jeden Browser überfordern.

        Grüße,

        Jochen

        1. Hallo und natürlich recht vielen Dank für eure schnelle Hilfe. Hätte nicht gedacht, dass ich gleich so viele Hinweise, wenn auch nicht immer aufbauender Art, bekomme.
          Jetzt habe erst einmal wieder eine Richtung in der ich mich vortasten kann.

          Habt recht herzlichen Dank.

          Vonni

      2. Hallo,

        es gibt irgendeinen INPUT-Element-Typ (ich glaube type=image), bei dem beim Daraufklicken die Koordinaten submittet werden.

        Du könntest also relativ "undynamisch" (also nicht so schick "zappel-zappel-interaktiv" auf der Seite) in zwei Schritten (bedeutet also "primitiverweise" zweimal Request vom Server) die 2 Punkte vom User festlegen lassen und: beim 1. Submit den 1. Punkt in die Grafik generieren (serverseitig, und dann wieder zum Client posten) und beim 2. Klick (= beim 2. Submitten durch den User) eine Grafik mit der eingezeichneten Strecke zurückschicken. Das Ganze dann in einer HTML-Seite, in die das CGI auch gleich die Distanz reinschreibt.

        Anderer Ansatz: Mit JavaScript würde man sicher die Klicks auch relativ zum Bildursprung (eine Ecke des Bildes) rauskriegen und clientseitig mit 2 Layern, zumindest 2 Kreuze auf der Grafik positionieren können und das ganze ebenso mit JS ausrechnen und ausgeben (wie auch immer, bleibt Dir überlassen (am primitivsten in ein INPUT-Feld)).

        Mirko

      3. Hallo,

        ich schreibe zur Zeit an meiner Diplomarbeit und arbeite mit einer Firma zusammen, die mir einen entsprechendenden Server zur Verfügung stellt. Die Karte wird als gif oder jpg, also als Bild in die Seite geladen und die Bildkoordinaten werden in Gauß-Krüger-Koordinaten (also x,y) umgerechnet.... Bis hierhin steht die Sache!

        Wurde mal die Verwendung von SVG angedacht? Gerade im Bereich Kartografie wird dieses Vektorformat favorisiert, siehe http://www.carto.net/.

        MfG, Thomas

        1. Hi Thomas,

          Wurde mal die Verwendung von SVG angedacht? Gerade im Bereich Kartografie wird dieses Vektorformat favorisiert, siehe http://www.carto.net/.

          kannst Du mir sagen, wo ich eine gute (!) Deutschlandkarte mit Bundesland- und Landkreisgrenzen im SVG-Format bekomme (respektive die Vektordaten dafuer), die frei benutzt werden darf? Bisher habe ich nur Karten mit den Grenzen der Bundesländer, nicht aber mit den Grenzen der Landkreise gefunden.

          Danke Dir schonmal.

          Ciao,

          Harry

          --
            Bald kommt die Waldfee ... (Projektphase: Planung)
            Bis dahin:
            http://harry.ilo.de/projekte/berge/
          1. Hallo,

            kannst Du mir sagen, wo ich eine gute (!) Deutschlandkarte mit Bundesland- und Landkreisgrenzen im SVG-Format bekomme (respektive die Vektordaten dafuer), die frei benutzt werden darf?

            Dazu ist mir keine (freie) Quelle bekannt. Das wuerde mich selbst interessieren.

            Bisher habe ich nur Karten mit den Grenzen der Bundesländer, nicht aber mit den Grenzen der Landkreise gefunden.

            Aktuell zeigt das Statistische Bundesamt einen "Atlas zur Regionalstatistik" unter: http://www.destatis.de/onlineatlas/ oder direkt: http://www.destatis.de/atlas/atlas.svg. Dort sind auch Kreisgrenzen enthalten.

            Als Kartengrundlage wird auf das Bundesamt für Kartographie und Geodäsie verwiesen.

            MfG, Thomas

  2. Hi,

    Allerdings fehlt mir dazu jeglicher Ansatz. Bin über jeden Hinweis und jeder bereits mit diesem Thema gemachte Erfahrung dankbar.

    Ein "Gummiband" wirst Du weder mit HTML, noch mit JavaScript hinbekommen (was man zusammen gemeinhin als DHTML bezeichnen würde). Das wäre etwas für z.B. ein Java-Applet.

    Was die Entfernungsmessung angeht: Mit dem Satz des Pythagoras + Maßstab der Karte läßt sich die Entfernung leicht auch in JavaScript berechnen. Mittels JS sind auch die Mauskoordinaten zu ermitteln, bzw. werden die Koordinaten bereits via reinem HTML übermittelt, wenn eine ImageMap Verwendung findet. Eine Suche im </archiv/> bringt definitiv weitere Hilfe ...

    Gruß, Cybaer

    --
    Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
    1. Hallo Cybear, hallo Vonni,

      Ein "Gummiband" wirst Du weder mit HTML, noch mit JavaScript hinbekommen (was man zusammen gemeinhin als DHTML bezeichnen würde). Das wäre etwas für z.B. ein Java-Applet.

      Was die Entfernungsmessung angeht: Mit dem Satz des Pythagoras + Maßstab der Karte läßt sich die Entfernung leicht auch in JavaScript berechnen. Mittels JS sind auch die Mauskoordinaten zu ermitteln, bzw.

      Das gilt natürlich auch alles für Flash und Actionscript welches ich hier zur darstellung des Gumibandes (Vektor!) und zur Berechnung der Strecke verwenden würde.

      Gruß Gernot

  3. Hi,

    ich bin zur Zeit damit beschäftigt eine Landkarte im Netz zu präsentieren. Dabei würde ich gern die Streckenmessung zwischen zwei Punkten mit anbieten, so dass der Nutzer sieht wo er geade hingedrückt hat. Allerdings fehlt mir dazu jeglicher Ansatz. Bin über jeden Hinweis und jeder bereits mit diesem Thema gemachte Erfahrung dankbar.

    Eine beliebige Linie zu zeichnen ist aufwendig (ja, mit e!), siehe den bereits geposteten Link.

    Wenn Du aber damit leben könntest, daß ein Rechteck erscheint mit den beiden Punkten als gegenüberliegenden Ecken, dann würde ein einziges transparentes div mit einer border reichen. Und da könnte man sogar noch z.B. nur die untere und die rechte Border anzeigen.

    cu,
    Andreas

    --
    MudGuard? Siehe http://www.Mud-Guard.de/
    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    1. Hi,

      ich bin zur Zeit damit beschäftigt eine Landkarte im Netz zu präsentieren. Dabei würde ich gern die Streckenmessung zwischen zwei Punkten mit anbieten, so dass der Nutzer sieht wo er geade hingedrückt hat. Allerdings fehlt mir dazu jeglicher Ansatz. Bin über jeden Hinweis und jeder bereits mit diesem Thema gemachte Erfahrung dankbar.

      Noch eine Idee:
      Du brauchst zwei Bilder (nicht zu klein, jeweils quadratisch, transparent bis auf eine der Diagonalen).

      Je nach Lage der beiden Punkte muß halt das BIld mit der - oder mit der /-Diagonale benutzt werden.

      Das Bild so positionieren, das seine linke obere Ecke auf die linke obere Ecke des durch die Koordinaten bestimmten Rechtecks fällt und dann mit width und height auf die passende Größe ziehen (so daß die rechte untere Ecke paßt).

      Dann wird das Bild halt vom Browser verzerrt, die Linie wird nicht allzu sauber aussehen.

      cu,
      Andreas

      --
      MudGuard? Siehe http://www.Mud-Guard.de/
      Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
  4. Hallo Vonni,

    Fuer so etwas ist zB SVG (scaleable vector graphics) geeignet. Basiert auf XML, Informationen finden sich zB auf der W3C website.

    Gruss,
    Melanie

  5. Moin,

    falls es was hilft hier die Berechnung für Luftlinienentfernungen mit Gauß-Krüger-Koordinaten in Javascript:

    var luftlinienentfernung = Math.sqrt((hw1-hw2)*(hw1-hw2) + (rw1-rw2)*(rw1-rw2))

    hw1 = Hochwert1
    rw1= Rechtswert1

    cu mipu