<?xml version="1.0" encoding="UTF-8"?>
<?AdobeSVGViewer save="snapshot"?>
<svg overflow="visible" width="100%" height="100%" onzoom="myHandleZoomPan(evt)" onscroll="myHandleZoomPan(evt)" onload="myHandleLoad()" onresize="myHandleLoad()" xmlns="https://www.w3.org/2000/svg"  xmlns:xlink="https://www.w3.org/1999/xlink" version="1.0">
 
<!-- DIE ATTRIBUTE width&height MIT 100% OHNE ANGABE EINER viewBox VERURSACHEN EIN BILDSCHIRMBASIERTES BASISKOORINATENSYSTEM (PIXEL)
 
     VIEWERFEHLER UND WORK-AROUNDS:
 
     DAS ATTRIBUT overflow="visible" ERMÖGLICHT IM BATIK SQUIGGLE VIEWER DAS SICHTBAR BLEIBEN DES NAVIGATIONSBLOCKS BEIM HERAUSZOOMEN. 
     DAS VERSCHWINDEN DIESES BLOCKS IST ABER NICHT STANDARDKONFORM.
 
     FIREFOX HAT IN DER VERSION 1.5 BETA 2 (STAND NOVEMBER 2005) ERHEBLICHE PROBLEME INHALTE ZU ZOOMEN. DIE FUNKTIONEN WERDEN KORREKT AUSGEFÜHRT, ES HANDELT
     SICH HIERBEI UM EIN RENDERING-PROBLEM.
 
     DER ADOBE SVG VIEWER 3.x KENNT DIE METHODE .getScreenCTM() NICHT. DIESE WIRD DURCH DIE FUNKTION myGetScreenCTM() ERSETZT. ALLERDINGS IST .getScreenCTM()
     EINE METHODE, DIE ÄNDERUNGEN MITVERFOLGEN SOLLTE UND DER ADOBE SVG VIEWER 3.x MACHT DAS NICHT. DAHER MUSS DIESE FUNKTION AN MEHREREN STELLEN ZUSÄTZLICH
     AUFGERUFEN WERDEN. DIES IST AN try/catch-BLÖCKEN ERKENNBAR.
 
     DER ADOBE SVG VIEWER 3.x UND FIREFOX 1.5 KENNEN DIE METHODE .viewport NICHT. DER WERT WIRD EBENFALLS IN try/catch-BLÖCKEN ERSATZWEISE ERMITTELT. 
 
     DER ADOBE SVG VIEWER 3.x LIEFERT EINE FALSCH ANZAHL VON onscroll UND onzoom-EVENTS. DADURCH WIRD DIE LAGEKORREKTUR BEIM NAVIGIEREN AUSSERHALB DES 
     KARTENGEBIETS ERSCHERT BZW. INKOMPATIBEL ZU VIEWERN GEMACHT, DIE DIESE EVENTS RICHTIG AUSFÜHREN. AUS DIESEM GRUND, WIRD FÜR DEN DOBE SVG VIEWER 3.x
     DIESE FUNKTION DEAKTIVIERT. SIEHE FUNKTION myHandleZoomPan() FÜR NÄHERE DETAILS.
 
     DER ADOBE SVG VIEWER 3.x HAT PROBLEME WENN MITTELS SCRIPT DER ZOOMFAKTOR 8 ÜBERSCHRITTEN WIRD. DIES WIRD HIER NICHT ABGEFANGEN
 
     FIREFOX HAT IN DER VERSION 1.5 BETA 2 (STAND NOVEMBER 2005) ERAFSST onload .getScreenCTM() NICHT RICHTIG. DADURCH KOMMT ES BEI DER ERSTANSICHT BEI DER
     MASSSTABSLEISTE ZU EINER FALSCHEN DARSTELLUNG. NACH EINEM ZOOM ODER PAN IST DER FEHLER BEHOBEN DA .getScreenCTM() RICHTIGE WERTE AUSLIEFERT.
 
     MIT onresize WIRD DIE SELBE FUNKTION WIE onload AUFGERUFEN, DADURCH  SOLL SICHERGESTELLT WERDEN, DASS DIE WERTE VON .getScreenCTM()
     RICHTIG ERFASST WERDEN. MANCHE VIEWER HABEN HIER PROBLEME.
 
     BATIK SQUIGGLE 1.6 HAT (ENDE 2005) EINE FEHLER DER BEIM .getScreenCTM() onload. ES WIRD DIE TRANSFORMATIONSMATRIX DES VORANGEHENDEN FILES ÜBERNOMMEN WENN
     IN DIESEM ZOOM ODER PAN AKTIV WAR. MIT EINEM ABERMALIGEN LADEN DER DATEI IST DER FEHLER BEHOBEN.
 
  -->
 
  <title>Level of Detail und Nachladen © svg.carto.net, Nicole Ueberschär + André M. Winter</title>
  <desc>  
    Alle Kartenebenen werden abhängig vom Zoomlevel geladen bzw. sichtbar und wieder unsichtbar gemacht.
  </desc> 
 
  <defs>
    <symbol id="mySymbArrow" overflow="visible" fill="none" stroke="navy" stroke-width="1">
      <polyline points="-3,-5 3,-5 3,1 5,1 0,5 -5,1 -3,1 -3,-5"/><!-- SYMBOL SHAPE © ANDREAS NEUMANN, https://www.carto.net/papers/svg/tuerlersee/ -->
    </symbol>
 
    <script>
      <![CDATA[
 
        // GLOBALE VARIABLEN
        var myScreenMatrix = null; // UMFASST .getScreenCTM() UND SOLLTE IMMER ÄNDERUNGEN MITVERFOLGEN (DETAILS SIEHE OBEN IM DATEIHEADER
        var myDocElem = document.documentElement; // REFERENZ
        var myViewport = {}; // UMFASST .viewport
        // UMFASST PLATZIERUNGSANGEBEN FÜR ELEMENTE DIE FENSTERGRÖSSEN- UND MASSSTABSABHÄNGIG SIND.
        // DIE WERTE SIND viewport-ABHÄNGIG UND WERDEN DAHER IN DER FUNKTION mySetElements() ZUGEWIESEN.
        var myBlocks = {};
        var myVB = []; // UMFASST DIE VIEWBOXWERTE DER HAUPTKARTE BEIM LADEN. WIRD onload GESETZT.
        var myRemainings = [0,0]; // RESTBREITE ODER RESTHÖHE DURCH DAS EINPASSEN DER viewBox IN DEN viewport. WIRD onload GESETZT UND FÜR RANDBERECHNUNGEN BENÖTIGT.
        var myZoomConstraints = [1,20]; // UNTER- UND OBERGRENZE DES ZOOMFAKTORS. GÜNSTIGERWEISE SOLLTE DIESER BESSER VOM URSPRÜNGLICHEN viewport ABHÄNGEN.
        var mySliderConstraints = [0,209,15]; // ZUÄSSIGER SPIELRAUM FÜR DEN SLIDER, SOWIE SEINE HÖHE
 
 
 
 
        var myLayerArr = [
          [
            '99920.xml', // DIE URL
            'myTempTextAll', // DIE ZIELGRUPPE
            3, // UNTERE MASSSTABGRENZE
            100, // OBERE MASSSTABGRENZE
            0 // LADE-/SICHTBARKEITSZUSTAND
          ],[
            '99921.xml',
            'myTempRoadsCat4',
            8,
            100,
            0
          ],[
            '99922.xml',
            'myTempRoadsCat3',
            4,
            100,
            0
          ],[
            '99923.xml',
            'myTempRoadsCat2',
            2,
            1000,
            0
          ],[
            '99924.xml',
            'myTempRoadsCat01',
            1,
            100,
            0
          ],[
            '99925.xml',
            'myTempWaters',
            4,
            100,
            0
          ],[
            '99926.xml',
            'myTempCantons',
            4,
            100,
            0
          ],[
            '99927.xml',
            'myTempPoints',
            4,
            100,
            0
          ],[
            '99928.xml',
            'myTempDepartements',
            1,
            2,
            0
          ],[
            '99929.xml',
            'myTempArrondissements',
            2,
            4,
            0
          ],[
            '99930.xml',
            'myTempTextMain',
            1,
            3,
            0
          ]
        ];
 
 
 
 
        function myAddXML(myURL,myDestination,myEncoding){
          if (window.XMLHttpRequest) {
            var myReq = new XMLHttpRequest();
            if(myReq) {
              myReq.overrideMimeType('text/xml');
              myReq.open('GET', myURL, true);
              myReq.onreadystatechange = function(){
                if (myReq.readyState == 4){
                  document.getElementById(myDestination).appendChild(myReq.responseXML.documentElement);
                }
              }    
              myReq.send(null);
            }
            return;
          } else if (window.getURL){
            getURL(myURL, myFileLoaded,myEncoding);
          } else {
            return;
          }
          function myFileLoaded(myData){
            var myString = '';
            if(myData.success) {
              myString = myData.content;
            } else {
              return;
            }
            document.getElementById(myDestination).appendChild(parseXML(myString, document));
          }
        }
 
 
 
 
        function myHandleLoad(){ // ERFASSUNG DER AKTUELLEN TRANSFORMATIONSMATRIX FÜR DIE KOORDINATENAUSGABE SOWIE WEITERER GLOBAL BENÖTIGTER WERTE.
 
          // ES MUSS AUFGRUND DER VERSCHACHTELUNG HIER AUF DIE KARTE (myMap) UND NICHT AUF DAS WURZELELEMENT GEGANGEN WERDEN
          try {
            myScreenMatrix = document.getElementById('myMap').getScreenCTM(); // STANDARDMETHIDE
          }
          catch(e){ 
            myScreenMatrix = myGetScreenCTM(document.getElementById('myMap')); // ERSATZMETHODE FÜR ADOBE SVG VIEWER 3.x
          }
 
          // viewport ERFASSEN
          try { // HIER WIRD EIN SCRIPTOBJEKT GESCHAFFEN, DAS SO ÄHNLICH WIE DAS DIE EIGENSCHAFT .viewport KONSTRUIERT IST
            myViewport = {
              myWidth : myDocElem.viewport.width, // STANDARDMETHODE
              myHeight : myDocElem.viewport.height
 
            }
          }
          catch(e){ // FÜR ASV3 UND FF1.5
            myViewport = { // HIER WIRD EIN SCRIPTOBJEKT (HASH) GESCHAFFEN, DAS SO ÄHNLICH WIE DAS DIE EIGENSCHAFT .viewport KONSTRUIERT IST
              myWidth : window.innerWidth,  // ERSATZMETHODE
              myHeight : window.innerHeight
            }
          }
 
           // URSPRÜNGLICHE viewBox-WERTE SPEICHERN. DIESE WERTE WERDEN ÖFTERS BENÖTIGT UND ERSPAREN SO DAS ERFRAGEN AUS DEM DOM.
           myVB = document.getElementById('myMap').getAttributeNS(null,'viewBox').split(' ');
           myVB[0] = parseFloat(myVB[0]); // STRINGS FÜR SPÄTERE BERECHUNGEN IN ZAHLEN UMWANDELN.
           myVB[1] = parseFloat(myVB[1]);
           myVB[2] = parseFloat(myVB[2]);
           myVB[3] = parseFloat(myVB[3]);
 
           // DIESE WERTE / VERHÄLTNISSE SIND ZOOM/PAN-UNABHÄNGIG UND WERDEN FÜR RANDBERECHNUNGEN IN myHandleZoomPan() BENÖTIGT.
           // ES HANDELT SICH UM DIE RESTBREITE/-HÖHE IN PIXEL.
           if(myViewport.myWidth / myViewport.myHeight < myVB[2] / myVB[3]){ // BREITE PASST EIN, REST IN DER HÖHE
              myRemainings[1] = myViewport.myHeight - myViewport.myWidth * myVB[3] / myVB[2];
           } else { // HÖHE PASST EIN, REST IN DER BREITE
             myRemainings[0] = myViewport.myWidth - myViewport.myHeight * myVB[2] / myVB[3];
           }
 
          mySetElements();
          myUpdateDisplays(); // ZEIGT PARAMTER AN
          myHandleZoomPan();  // AUFRUF UM DIE MASSSTABSLEISTE MIT DATEN ZU VERSORGEN UND DAS RECHTECK IN DER ÜBERSICHTKARTE DEM TATSÄCHLICHEN AUSSCHNITT ANZUPASSEN
 
        }
 
        // SETZTEN VON INTERFACE-ELEMENTEN
        function mySetElements(){
          // DAS OBJEKT myBlocks IST GLOBAL VERANKERT, WIRD ABER HIER MIT DATEN BEFÜLLT DA myViewport.width/.height ERST onload ERMITTELT WURDE.
          // "FOB" STEHT FÜR FLYOUTBORDER UND BEZEICHNET DIE KLICKBAREN RÄNDER FÜR TRANSLATION DER KARTE. DIE BUCHSTABEN DAHINTER STEHEN FÜR DIE HIMMELSRICHTUNG.
          // DIE OBJEKTE WERDEN GESCHAFFTEN, IHRE EIGENSCHAFTEN myX,myY,myWidth,myHeigt,myObj SIND EIGNES ERSTELLT UND NICHT STANDARDISIERT.
           myBlocks = {
             'myFOBSS' : {
              myX : 100,
              myY : myViewport.myHeight - 70,
              myWidth : myViewport.myWidth - 200,
              myHeight : 70,
              myObj: document.getElementById('myFOBSS') // HIER WIRD DIREKT EINE REFRENZ AUF DAS OBJEKT ERSTELLT.
            },
             'myFOBNN' : {
              myX : 100,
              myY : 0,
              myWidth : myViewport.myWidth - 200,
              myHeight : 70,
              myObj: document.getElementById('myFOBNN')
            },
             'myFOBWW' : {
              myX : 0,
              myY : 100,
              myWidth :70,
              myHeight : myViewport.myHeight - 200,
              myObj: document.getElementById('myFOBWW')
            },
             'myFOBEE' : {
              myX : myViewport.myWidth - 70,
              myY : 100,
              myWidth : 70,
              myHeight : myViewport.myHeight - 200,
              myObj: document.getElementById('myFOBEE')
            },
             'myFOBNW' : {
              myX : 0,
              myY : 0,
              myWidth : 100,
              myHeight : 100,
              myObj: document.getElementById('myFOBNW')
            },
            'myFOBNE' : {
              myX : myViewport.myWidth - 100,
              myY : 0,
              myWidth : 100,
              myHeight : 100,
              myObj: document.getElementById('myFOBNE')
            },
            'myFOBSW' : {
              myX : 0,
              myY : myViewport.myHeight - 100,
              myWidth : 100,
              myHeight : 100,
              myObj: document.getElementById('myFOBSW')
            },
            'myFOBSE' : {
              myX : myViewport.myWidth - 100,
              myY : myViewport.myHeight - 100,
              myWidth : 100,
              myHeight : 100,
              myObj: document.getElementById('myFOBSE')
            },
            'myInfoBlock' : {
              myX : myViewport.myWidth - 190,
              myY : 10,
              myWidth : 180,
              myHeight : 520,
              myObj: document.getElementById('myInfoBlock')
            },
            'myDynScalebar' : {
              myX : 10,
              myY : myViewport.myHeight - 30,
              myWidth : 180,
              myHeight : 15,
              myObj: document.getElementById('myDynScalebar')
            }
          }
 
          for(var data in myBlocks){ // SETZE ALLE ELEMENTE AN IHREN PLATZ (RANDNAVIGATION UND INFOBLOCK).
            var myRectObj = myBlocks[data].myObj;
             myRectObj.setAttributeNS(null, 'x', myBlocks[data].myX);
            myRectObj.setAttributeNS(null, 'y',  myBlocks[data].myY);
            myRectObj.setAttributeNS(null, 'width', myBlocks[data].myWidth);
            myRectObj.setAttributeNS(null, 'height', myBlocks[data].myHeight);
          }
 
          document.getElementById('myDynScalebarText').setAttributeNS(null,'y',  myViewport.myHeight - 17);
 
        } // ENDE VON mySetElements().
 
 
 
 
 
        // AUSFÜHREN VON ZOOM-FUNKTIONEN ÜBER INTERFACE-ELEMENTE
        function myDoZoom(myVal,mySetAbs){ // NACHGEBAUTE ZOOM-FUNKTION
 
          var myOldScale = myDocElem.currentScale; // SPEICHERN DES AKTUELLEN ZOOMLEVELS
          var oldTranslate = { // HIER WIRD EIN SCRIPTOBJEKT GESCHAFFEN, DAS SO ÄHNLICH WIE DAS DIE EIGENSCHAFT .currentTranslate KONSTRUIERT IST
            x : myDocElem.currentTranslate.x,
            y : myDocElem.currentTranslate.y
          }
          if(mySetAbs){
            myDocElem.currentScale = myVal; // DIREKTE ZUWEISUNG DES ABSOLUTEN FAKTORS.
          } else {
            // UMRECHNUNG DES ÜBERGABEWERTS IN EINEM BRAUCHBAREN ZOOMFAKTOR
            var myStep = 2; // SPRUNGFAKTOR
            if(myVal > 0){
              myVal *= myStep;
            } else {
              myVal /= -myStep;
            }
            myDocElem.currentScale *= myVal; // DIREKTE ZUWEISUNG DES FAKTORS.
          }
          if(myDocElem.currentScale < myZoomConstraints[0]){ // HERAUSZOOMEN UNTER DIE AUSGANSANSICHT UNTERBINDEN.
            myDoReset();
            return;
          } else if(myDocElem.currentScale > myZoomConstraints[1]) { // HINEINZOOMEN LIMITIEREN
            myDocElem.currentScale = myZoomConstraints[1];
          }
          // ES FOLGEN NUN DIE KORREKTUREN DER LAGE. GEZOOMT WIRD JA RELATIV ZUM KOORDINATENURSPRUNG UND DAS IST BEI KARTEN SELTEN DIE BILDSCHIRMMITTE.
          // DER viewport IST IMMER IN PIXEL DEFINIERT. ES MUSS ALSO DIES SO BERECHNET WERDEN, DASS SICH ALLE ÜBERGABEWERT IN DIESEM SYSTEM BEFINDEN.
          myDocElem.currentTranslate.x = myViewport.myWidth / 2 - (myDocElem.currentScale / myOldScale) * (myViewport.myWidth / 2 - oldTranslate.x);
          myDocElem.currentTranslate.y = myViewport.myHeight / 2 - (myDocElem.currentScale / myOldScale) * (myViewport.myHeight / 2 - oldTranslate.y);
        }
 
 
 
 
 
        // AUSFÜHREN VON PAN-FUNKTIONEN ÜBER INTERFACE-ELEMENTE
        function myDoPan(myX,myY){
          // ES WIRD EINFACH DER AKTUELLE WERT GENOMMEN UND EIN FIXWERT ZUGESCHLAGEN. DA EINE TRANSLATION UNABHÄNGIG VOM KOORDINATENURSPRUNG IST, 
          // BRAUCHEN WIR UNS HIER UM DIESEN NICHT ZU KÜMMERN.
          var myCurrTransl = myDocElem.currentTranslate;
          myX *= myViewport.myWidth / 2;
          myY *= myViewport.myHeight / 2;
          // ZUWEISUNG UND DADURCH AUSFÜHRUNG. BEI GROSSEN DATEIEN UND WENN DER USER SCHNELL VIELE BEWEGUNGEN HINTEREINANDER AUSFÜHRT, KANN ES VORKOMMEN,
          // DASS EINER DER BEIDEN BEWEGUNGEN "VERSCHLUCKT" WIRD. DER GRUND IST HIER MEISTENS EINE ZU LANGSAME GRAPHIKKARTE.
          myCurrTransl.x += myX;
          myCurrTransl.y += myY;
        }
 
 
 
 
 
        function myDoReset(){ // ZURÜCKSETZEN IN DIE AUSGANGSANSICHT
          // DIE WERTE SIND BEIM START IMMER 1,0,0. WENN MAN SIE ALSO ZURÜCKSETZT, ERHÄLT MAN DIE STARTANSICHT.
          // DIESE METHODE IST NATÜRLICH NICHT ZULÄSSIG, WENN onload KORREKTUREN AN DIESEN WERTEN DURCHGEFÜHRT WURDEN.
          myDocElem.currentScale = 1;
          myDocElem.currentTranslate.x = 0;
          myDocElem.currentTranslate.y = 0;
        }
 
 
 
 
 
        // ERFASST ZOOM- UND PAN-ÄNDERUNGEN AM DOKUMENT.
        var myOldScale; // SPEICHERT VORANGEHENDEN ZOOMLEVEL UM ZU WEITES HINEINZOOMEN RÜCKGÄNGIG MACHEN ZU KÖNNEN.
        function myHandleZoomPan(evt){
 
          // ÜBERPRÜFT OB DER KARTENRAND ERREICHT IST UND KORRIGIERT GGF. DIE RICHTUNG. ADOBE SVG VIEWER 3.x-FEHLER SIE UNTEN.
          // BEWEGT DEN INFOBLOCK UND NAVIGATIONSELEMENTE INVERS ZU DIESEN ÄNDERUNGEN
          // PLATZIERT DAS RECHTECK IN DER ÜBERSICHTSKARTE PASSEND ZU DIESEN ÄNDERUNGEN
 
          // DER ADOBE SVG VIEWER 3.x LIEFERT EINE FALSCHE ANZAHL VON onzoom-EVENTS (DIE WEITERE onscroll-EVENTS AUSLÖSEN. DAHER WIRD DIESER
          // VIEWER HIER IM GEGEBENEN FALL AUSGENOMMEN. SOMIT ERFOLGT KEINE RANDKORREKTUR BEI ADOBE SVG VIEWER 3.x, DAS IST ABER NUR RELEVANT 
          // BEIM ZOOM-OUT, UND EIGENWILLIGEN ZOOM-IN NACH DEM LADEN. DIE onscroll-KORREKTUREN WERDEN AUSGEFÜHRT UND SOMIT ERFOLGTR EINE KORREKTUR SOBALD
          // DER ANWENDER EINE TRANSLATION AUSFÜHRT (EGAL WOMIT).
          // GRUNDSÄTZLICH IST NUR DIE ZOOM-FUNKTION ÜBER DEN VIEWER MIT DIESEM FEHLER BEHAFTET. DAS HEISST ZOOM ÜBER DIE INTERFACE-ELEMENTE WÜRDE RICHTIG 
          // GEHANDHABT WERDEN. ABER DA WIR DIE ÄNDERUNGEN ÜBER DIE ZENTRALEN EVENT-HANDLER onscroll UND onzoom ERFASSEN, IST EINE UNTERSCHEIDUNG NUR SEHR
          // SCHWIERIG ZU ERZIELEN. ES BESTÜNDE DIE MÖGLICHKEIT DIESEN ADOBE SVG VIEWER 3.x-FEHLER ZU ERKENNEN UND ZU UMGEHEN. DAFÜR WÄRE ABER DAS MITZÄHLEN
          // DER EVENTS (OB SIE NUN VOM VIEWER ODER DEN INTERFACE-ELEMENTEN KOMMEN) UND DAS MITFÜHREN EINES TIMERS NÖTIG.
 
          if(myDocElem.currentScale < myZoomConstraints[0]){ // HERAUSZOOMEN UNTER DIE AUSGANSANSICHT UNTERBINDEN. EINZOOM-KONTROLLE UNTEN.
            myDoReset();
            return;
          }
 
          var myASV3Stop = 'no';
          try{
            if(navigator.appName.match('Adobe') && parseInt(navigator.appVersion) <= 3 && evt.type == 'SVGZoom') {
              myASV3Stop = 'stop';
            }
          }
          catch(e){
            myASV3Stop = 'no';
          }
 
          if(myASV3Stop == 'no'){  // if-ABFRFAGE WEGEN  ADOBE SVG VIEWER 3.x.
            // RANDKORREKUREN. UNTERSCHEIDUNG ZWISCHEN KARTE BREITER/HÖHER ALS VIEWPORT UND KLEINER.
            // DIE HIER AUFGEFÜHRTEN FÄLLE UNTERSCHEIDEN ZWISCHEN DEN 4 SEITEN WO MAN DIE KARTE FÄLSCHLICHERWEISE VERLASSEN KÖNNE.
            // ZUSÄTZLICH ERFOLGT EINE UNTERSCHEIDUNG OB DURCH DAS EINPASSEN DER viewBox im viewport RÄNDER BESTEHEN (WO EIN SPIEL ZUGELASSEN WERDEN MUSS
            // UND DEM FALL WO DER ANWENDER HINREICHEND EINGEZOOMT IST.
            // DIE BERECHNUNGEN ERFOLGEN ALLE ÜBER currentTranslate/Scale DA DIES DIE EINZIGEN GRÖSSEN SIND DIE MAN NICHT NUR AUSLESEN SONDERN AUCH SETZEN KANN.
            // DIESE WERTE BEZIEHEN SICH AUF DEN ZUSTAND DER onload GEHERRSCHT HAT, DAHER SIND ALLE ANDEREN ÜBERABEWERTE IN PIXEL UND AUF DIESEN 
            // ZEITPUNKT BEZOGEN
            if(myVB[2] * myScreenMatrix.a > myViewport.myWidth){ // WENN DIE AKUTELLE BREITE DER KARTE IN PIXEL GRÖSSER ALS DIE BREITE DES VIEWPORT IST
              if(myDocElem.currentTranslate.x > -myRemainings[0] / 2 * myDocElem.currentScale){ // RAND RECHTS
                myDocElem.currentTranslate.x = -myRemainings[0] / 2 * myDocElem.currentScale;
              } else if(myDocElem.currentTranslate.x < -myRemainings[0] / 2 * myDocElem.currentScale + myViewport.myWidth - myVB[2] * myScreenMatrix.a){ // RAND LINKS
                myDocElem.currentTranslate.x = -myRemainings[0] / 2 * myDocElem.currentScale + myViewport.myWidth - myVB[2] * myScreenMatrix.a;
              }
            } else { // KARTE KLEINER ALS VIEWPORTBREITE  (SPIEL IN DER VIEWPORTBREITE ZULASSEN).
              if(myDocElem.currentTranslate.x < -myRemainings[0] / 2 * myDocElem.currentScale){ // RAND RECHTS
                myDocElem.currentTranslate.x =  -myRemainings[0] / 2 * myDocElem.currentScale;
              } else if(myDocElem.currentTranslate.x > -myRemainings[0] / 2 * myDocElem.currentScale + myViewport.myWidth - myVB[2] * myScreenMatrix.a){ // RAND LINKS
                myDocElem.currentTranslate.x = -myRemainings[0] / 2 * myDocElem.currentScale + myViewport.myWidth - myVB[2] * myScreenMatrix.a;
              }
            }
            // ES KANN ÜBER EINE ECKE GLEICHZEITIG AUCH IN DIE ANDERE RICHTUNG DAS KARTENFELD VERLASSEN WERDEN.
            if(myVB[3] * myScreenMatrix.d > myViewport.myHeight){ // WENN DIE AKUTELLE HÖHE DER KARTE IN PIXEL GRÖSSER ALS DIE HÖHE DES VIEWPORT IST
              if(myDocElem.currentTranslate.y > -myRemainings[1] / 2 * myDocElem.currentScale){ // RAND OBEN
                myDocElem.currentTranslate.y = -myRemainings[1] / 2 * myDocElem.currentScale;
              } else if(myDocElem.currentTranslate.y < -myRemainings[1] / 2 * myDocElem.currentScale + myViewport.myHeight - myVB[3] * myScreenMatrix.d){ // RAND UNTEN
                myDocElem.currentTranslate.y = -myRemainings[1] / 2 * myDocElem.currentScale + myViewport.myHeight - myVB[3] * myScreenMatrix.d;
              }
            } else { // KARTE KLEINER ALS VIEWPORTHÖHE (SPIEL IN DER VIEWPORTHÖHE ZULASSEN).
              if(myDocElem.currentTranslate.y < -myRemainings[1] / 2 * myDocElem.currentScale){ // RAND OBEN
                myDocElem.currentTranslate.y = -myRemainings[1] / 2 * myDocElem.currentScale;
              } else if(myDocElem.currentTranslate.y > -myRemainings[1] / 2 * myDocElem.currentScale + myViewport.myHeight - myVB[3] * myScreenMatrix.d){ // RAND UNTEN
                myDocElem.currentTranslate.y = -myRemainings[1] / 2 * myDocElem.currentScale + myViewport.myHeight - myVB[3] * myScreenMatrix.d;
              }
            }
 
            // ZU WEITES ZOOM-IN BEGRENZEN. ES MUSS DABEI AUCH DIE TRANSLATION RÜCKGÄNGIG GEMACHT WERDEN.
            if(myDocElem.currentScale > myZoomConstraints[1]) { // HINEINZOOMEN LIMITIEREN. NICHT ZULÄSSIG FÜR ADOBE SVG VIEWER 3.x
              myDocElem.currentTranslate.x /= myDocElem.currentScale / myOldScale; // DIVIDIERUNG DURCH DEN ZOOMUNTERSCHIED.
              myDocElem.currentTranslate.y /= myDocElem.currentScale / myOldScale;
              myDocElem.currentScale = myZoomConstraints[1];
            }
 
          } // if-ABFRFAGE WEGEN  ADOBE SVG VIEWER 3.x.
 
 
          // DA currentTranslate/Scale BEI DEN RAHMENKORREKTUREN GEÄNDERT WURDE, MUSS WIEDER myScreenMartix GECHECKT WERDEN, SONST IST DAS FOLGENDE
          // NACHFÜHREN VON INTERFACE-ELEMENTEN FALSCH. DIES WIRD NICHT FÜR ALLE VIEWER BENÖTIGT
          // ANFANG (NUR FÜR ASV3 UND FF1.5.). NORMALERWEISE WIRD .getScreenCTM() AUTOMATISCH MITGEFÜHRT. DIESE ZUSÄTZLICHE ABFRAGE VERLANGSAMT NATÜRLICH ZOOM UND PAN.
          try {
            myScreenMatrix = document.getElementById('myMap').getScreenCTM();
          }
          catch(e){ // getScreenCTM() FÜR ASV3
            myScreenMatrix = myGetScreenCTM(document.getElementById('myMap'));
          }
          // ENDE (NUR FÜR ASV3 UND FF1.5.)
          myUpdateDisplays(); // ZEIGT PARAMTER AN
 
          // BERECHNUNG DES RECHTECKS IN DER ÜBERSICHTSKARTE. ES WIRD DER AKTUELLE AUSSCHNITT DES BILDSCHIMRKOORDINATENSYSTEMS IN DAS 
          // KARTENKOORDINATENSYSTEM TRANSFORMIERT. 
          var mySvgPtUL = myDocElem.createSVGPoint(); // TRANSFORMIERE DEN ECKPUNKT LINKS OBEN
          mySvgPtUL.x = 0;
          mySvgPtUL.y = 0;
          mySvgPtUL = mySvgPtUL.matrixTransform(myScreenMatrix.inverse()); // TRANSFORMATION
          var mySvgPtBR = myDocElem.createSVGPoint(); // TRANSFORMIERE DEN ECKPUNKT RECHTS UNTEN
          mySvgPtBR.x = myViewport.myWidth;
          mySvgPtBR.y = myViewport.myHeight;
          mySvgPtBR = mySvgPtBR.matrixTransform(myScreenMatrix.inverse()); // TRANSFORMATION
 
          var myRectObj = document.getElementById('myOverviewRect'); // DEM OBJEKT ZU WEISEN
           myRectObj.setAttributeNS(null, 'x', mySvgPtUL.x); // SETZEN DER WERTE
          myRectObj.setAttributeNS(null, 'y',  mySvgPtUL.y);
          myRectObj.setAttributeNS(null, 'width', mySvgPtBR.x - mySvgPtUL.x);
          myRectObj.setAttributeNS(null, 'height', mySvgPtBR.y - mySvgPtUL.y);
 
          // WIRD DAS RECHTECK ZU KLEIN, MACHT ES SINN ES MIT EINER GRÖSSEREN GEOMETRIE ZU HINTERLEGEN DAMIT ES FÜR DEN ANWENDER ANFASSBAR BELEIBT
          var myOverviewRectCirc = document.getElementById('myOverviewRectCirc');
          if(mySvgPtBR.x - mySvgPtUL.x < 15000 || mySvgPtBR.y - mySvgPtUL.y < 15000){ // WERTE SETZEN WENN EINE DIMENSION KLEINER ALS 15000.
            var myOverviewRectCirc = document.getElementById('myOverviewRectCirc');
            myOverviewRectCirc.setAttributeNS(null,'cx',mySvgPtUL.x + (mySvgPtBR.x - mySvgPtUL.x)/2);
            myOverviewRectCirc.setAttributeNS(null,'cy',mySvgPtUL.y + (mySvgPtBR.y - mySvgPtUL.y)/2);
            myOverviewRectCirc.setAttributeNS(null,'r',28000);
          } else {
            myOverviewRectCirc.setAttributeNS(null,'r',0); // ANDERENFALLS UNSICHTBAR MACHEN DURCH RADIUS NULL.
          }
 
          // GRUPPEN KÖNNEN MIT transform EINFACH RÜCKTRANSFORMIERT WERDEN
          var myCurrTransl = myDocElem.currentTranslate; // BEREITS VERÄNDERTER TRANSLATIONSFAKTOR
          var myTransform = 'scale(' + 1 / myDocElem.currentScale + ') ' + 'translate(' + (-myCurrTransl.x) + ', ' + (-myCurrTransl.y) + ')'; // RÜCKTRANSFORMIERUNG
          document.getElementById('myFlyOutBorders').setAttributeNS(null, 'transform', myTransform);
 
          // SVG ELEMENTE MÜSSEN ÜBER x,y,width,height RÜCKTRANSFORMIERT WERDEN
          var myInfoBlock = myBlocks['myInfoBlock'].myObj;
          myInfoBlock.setAttributeNS(null, 'x', (myBlocks['myInfoBlock'].myX - myCurrTransl.x) / myDocElem.currentScale);
          myInfoBlock.setAttributeNS(null, 'y', (myBlocks['myInfoBlock'].myY - myCurrTransl.y) / myDocElem.currentScale);
          myInfoBlock.setAttributeNS(null, 'width', myBlocks['myInfoBlock'].myWidth / myDocElem.currentScale);
          myInfoBlock.setAttributeNS(null, 'height', myBlocks['myInfoBlock'].myHeight / myDocElem.currentScale);
 
          if(myOldScale != myDocElem.currentScale){
 
            // SETZEN DES SLIDERS ABHÄNGIG VOM ZOOMFAKTOR. 
            // DA DER SLIDER U.U. VOM ANWENDER BEREITS GESETZT WURDE, KÖNNEN KLEINE SPRÜNGE BEIM SLIDER ZU BEOBACHTEN SEIN. HIER HANDELT ES SICH UM RUNDUNSFEHLER.
            // WENN INTEFACE-ELEMENTE GLEICHZEITIG ANZEIGE UND BEDIENUNG SIND, KÖNNEN DIESE FEHLER DIE KAUM VERMIEDEN WERDEN.      
            // UMRECHNUNG VOM ZOOMFAKTOR (ZWISCHEN myZoomConstraints[0] UND myZoomConstraints[1] IN DEN RAUM DES SLIEDERS (ZW. mySliderConstraints[0] UND  mySliderConstraints[1])
            var mySliderTranslate = mySliderConstraints[1] - (myDocElem.currentScale - 1) * mySliderConstraints[1] / (myZoomConstraints[1] - 1);
            if(mySliderTranslate < mySliderConstraints[0]){ // VERMEIDEN, DASS DER SLIDER ZU WEIT VERSETZT WIRD. SOLLTE NICHT PASSIEREN WENN DIE ZOOM-KONTROLLE GREIFT.
              mySliderTranslate = mySliderConstraints[0];
            } else if(mySliderTranslate > mySliderConstraints[1]){
              mySliderTranslate = mySliderConstraints[2];
            }
            document.getElementById('mySlider').setAttributeNS(null, 'transform', 'translate(0,'+ mySliderTranslate +')');
 
            // SETZEN DER DYNAMISCHEN GRAPHISCHEN MASSSTABSLEISTE.
            // DIE BERECHNUNG ERFOLGT ÜBER DIE GANZZAHL DER HÄLFTE DER BILDSCHIRMBREITE IN KARTENKOORDINATEN. ANSCHLIESSEND UMRECHUNG IN BILDSCHIRMKOORDINATEN
            // DER WERT IST FÜR FIREFOX 1.5b2 BEIM LADEN FALSCH.
            var myHalfViewportInMapCoords = parseInt((mySvgPtBR.x - mySvgPtUL.x) / 2); // DIE HÄLFTE DER BILDSCHIRMBREITE IN KARTENKOORDINATEN. 
            var myScaleDivisor = Math.pow(10, String(myHalfViewportInMapCoords).length - 1); // ANZAHL ZIFFERN
             var myScaleInt = parseInt(myHalfViewportInMapCoords / myScaleDivisor); // ERSTE ZIFFER
             var myScaleBarWidth = myScaleInt * myScaleDivisor; // WERT
            document.getElementById('myDynScalebar').setAttributeNS(null,'width', myScaleBarWidth * myScreenMatrix.a);
            document.getElementById('myDynScalebarText').setAttributeNS(null,'x', myBlocks['myDynScalebar'].myX +  myScaleBarWidth * myScreenMatrix.a / 2);
            document.getElementById('myDynScalebarText').firstChild.data = myScaleInt * myScaleDivisor/ 1000 + ' km';
 
            myHandleLayers();
          }
 
          myOldScale = myDocElem.currentScale;
 
 
        } // ENDE myHandleZoomPan().
 
 
 
 
 
        // LÖSCHEN DES INHALTS EINER GRUPPE
        function myClearElem(myElem2Clear){
          myElem2Clear = document.getElementById(myElem2Clear);
          while(myElem2Clear.childNodes.length > 0){
            myElem2Clear.removeChild(myElem2Clear.firstChild);
          }
        }
 
 
 
 
        // LADEN WENN SICHTBARKEIT NÖTIG, SONST AUS DEM DOM LÖSCHEN
        // WERTE VON myLayerArr[i][4]: 0: NICHT GELADEN, 1: GELADEN (SICHTBAR)
        function myHandleLayers(){
          var myZoomLevel = myDocElem.currentScale;
          for(var i=0; i<myLayerArr.length; i++){ // DURCHLAUFEN ALLER MÖGLICHEN LAYER
 
            if(myZoomLevel >= myLayerArr[i][2] && myZoomLevel < myLayerArr[i][3]){ // WENN ZOOMSTUFFE MIT SICHTBARKEIT
              if(!document.getElementById(myLayerArr[i][1]).firstChild){ // WENN NOCH KEINE DATEN DA
                myAddXML(myLayerArr[i][0],myLayerArr[i][1],'UTF-8'); // NACHLADEN (WIRD SICHTBAR
              }
              myLayerArr[i][4] = 1;
            } else {
              myLayerArr[i][4] = 0;
              myClearElem(myLayerArr[i][1]); // LÖSCHEN (UNSICHTBAR)
            }
            document.getElementById(myLayerArr[i][1].replace(/^my/,'myShow')).firstChild.data = myLayerArr[i][4] + ' - '+ myLayerArr[i][1]; // LADE-ANZEIGE
          }
        }
 
 
 
 
 
        // EINDIMENSIONALE BEWEGUNG DES SLIDERS DURCH DEN ANWENDER
        // DIE FUNKTIONSWEISE IST ANALOG ZU JENER IN myDrag() AUFGEBAUT, JEDOCH KOMMT NUR DIE VERTIKALE DIMENSION ZUR ANWENDUNG UND DIE UMSETZUNG ERFOLGT NICHT 
        // DURCH EINWRIKUNG AUF KOORDINATEN SONDERN ÜBER transform.
        var mySliderDragLock = null; // GLOBALE VARIABLE UM ZU VERFOLGEN OB DIE BEWEGUNG GERADE AKTIV IST. AUCH HERANGEZOGEN UM DIE ANFANGSWERTE ZWISCHENZUSPEICHERN.
        var myOvRectNow = []; // GLOBALE VARIABLE ZUM DURCHREICHEN DER WERTE ZWISCHEN DEN EVENTS.
        function mySliderDrag(evt){
 
          if(evt.type == 'mousedown'){
 
 
            // ERFASSUNG DER PARAMETER DES RECHTECKS IN DER ÜBERSICHTSKARTE
            var myRectObj = document.getElementById('myOverviewRect');
             myOvRectNow[0] = myRectObj.getAttributeNS(null, 'x');
            myOvRectNow[1] = myRectObj.getAttributeNS(null, 'y');
            myOvRectNow[2] = myRectObj.getAttributeNS(null, 'width');
            myOvRectNow[3] = myRectObj.getAttributeNS(null, 'height');
 
            // SPEICHERT ZUSÄTZLICH DIE TRANSLATION AM SLIDER DAMIT DIESER WERT BEIM LOSLASSEN DER MAUS NICHT AUS DEM DOM ABGEFRAGT WERDEN MUSS.
            myOvRectNow[4] = 0;
 
            // ERFASSEN DER AKTUELLEN POSITION DES GREIFERS (IST TATSÄCHLICH EINE GRUPPE AUS ZWEI RECHTECKEN).
            // ES WIRD DIE VERTIKALE TRANSLATION ABGEFRAGT. DAFÜR MUSS IM SVG-CODE DORT DIESE GESETZT SEIN, AUCH WENN DER WERT NULL IST.  
            // BERECHNUNG DER DIFFERENZ UND SPEICHERUNG UNTER myDragLock. DURCH DIESE METHODE IST ES IRRELEVANT WO DER ANWENDER DAS RECHTECK ANFASST.
            var myRectNow = parseInt(document.getElementById('mySlider').getAttributeNS(null,'transform').split(',')[1]);
            mySliderDragLock = evt.clientY - myRectNow;
 
          } else if(evt.type == 'mousemove'){
            if(mySliderDragLock){ // MACHE ÄNDERUNGEN NUR WENN SIE AUCH INITIERT WORDEN SIND
 
              // ZUWEISUNG DER BEWEGTEN DIFFERENZ, DAS RECHTECK DES SLIDERS WIR SOFORT UNTER DER MAUS BEWEGT
              myOvRectNow[4] = evt.clientY - mySliderDragLock; // BERCHNUNG DER DIFFERENZ
 
              // ÜBERPRÜFEN, OB DIE BEWEGUNG IM BEREICH DER "FÜHRUNG" BLEIBT
              if(myOvRectNow[4] >= mySliderConstraints[0] && myOvRectNow[4] <= mySliderConstraints[1]){
 
                // DEN SLIDER WEITERFÜHREN DURCH SETZTEN NEUER TRANSLATIONSWERTE
                document.getElementById('mySlider').setAttributeNS(null, 'transform', 'translate(0,'+ myOvRectNow[4] +')');
 
                // BEHANDLUNG DES RECHTECKS IN DER ÜBERSICHTSKARTE
                // DAS RECHTECK WIRD AN ORT UND STELLE VERÄNDERT, DAS ECHTE ZOOMEN DER HAUPTKARTE ERFOLGT ABER ERST WENN MAN DIE MAUS LOSLÄSST.
                // NORMALERWEISE WIRD DAS RECHTECK IN DER ÜBERSICHTSKARTE NACH DEM ÄNDERN VON ZOOM/PAN GESETZT. DA HIER DER SPIESS UMGEDREHT WIRD,
                // MÜSSEN DIE WERTE FÜR x,y,width UND height ETWAS UMSTÄNDLICH BERECHNET WERDEN. SOLCHES "GEGEN DEN FLUSS" SCHIMMEN SOLLTE MAN BEI
                // DER INTERFACE-PROGRAMMIERUNG VERMEIDEN.
 
                // ÜBERSETZUNG VON SLIDERWERTEN AUF ZOOMWERT
                var myZoom = (mySliderConstraints[1] - myOvRectNow[4]) * myZoomConstraints[1] / mySliderConstraints[1] + 1; 
 
                var myRectObj = document.getElementById('myOverviewRect');
 
                // BERECHNUNG DER BREITE DER BOX IN DER JEWEILIGEN ZOOMSTUFFE
                var myExpectedWidth = myViewport.myWidth / myScreenMatrix.a * (myDocElem.currentScale / myZoom);
                var myExpectedHeight = myViewport.myHeight / myScreenMatrix.d * (myDocElem.currentScale / myZoom);
 
                // SETZEN DER WERTE FÜR DAS RECHTECK. MAN HÄTTE AUCH x UND y MITTELS MATRIXOPERATION BERECHNEN KÖNNEN, WIR NEHMEN HIER DIE ANFANGSWERT DIE
                // onmousedown GESPEICHERT WURDEN.
                 myRectObj.setAttributeNS(null, 'x', myOvRectNow[0] - (myExpectedWidth - myOvRectNow[2]) / 2);
                myRectObj.setAttributeNS(null, 'y', myOvRectNow[1] - (myExpectedHeight - myOvRectNow[3]) / 2);
                myRectObj.setAttributeNS(null, 'width', myExpectedWidth); 
                myRectObj.setAttributeNS(null, 'height', myExpectedHeight);
 
              }
 
            }
          } else if(evt.type == 'mouseup' || evt.type == 'mouseout'){
            if(mySliderDragLock){ // MACHE ÄNDERUNGEN NUR WENN SIE AUCH INITIERT WORDEN SIND
 
              // DIE BEWEGUNG DES SLIDERS WURDE MIT evt.clientY BERECHNET, ABER RÄUMICH BEGRENZT. WENN DIE MAUS AUSGELASSEN WIRD, ERFOLGT DIE 
              // ÜBERMITTLUNG WIEDER ÜBER evt.clientY. DAHER MUSS HIER GGF. WIEDER DER "RÄUMLICHE" RAHMEN BEGRENZT WERDEN, DAMIT DER WERT NICHT
              // ÜBER DIE MAXIMA HINAUSGEHT.
              if(myOvRectNow[4] <= mySliderConstraints[0]){
                myOvRectNow[4] = mySliderConstraints[0];
              }  else if(myOvRectNow[4] >= mySliderConstraints[1]){
                myOvRectNow[4] = mySliderConstraints[1];
              }
               // UMSETZUNG VON mySliderConstraints[0] BIS mySliderConstraints[1] AUF myZoomConstraints[1] BIS myZoomConstraints[1]
              var myZoom = (mySliderConstraints[1] - myOvRectNow[4]) * (myZoomConstraints[1] -1)/ mySliderConstraints[1] +1;
 
              // ZOOM IN DER HAUPTKARTE AUSFÜHREN.
              myDoZoom(myZoom,true);
            }
            mySliderDragLock = null; // BEWEGUNGEN WIEDER FREIGEBEN.
          } 
        }
 
 
 
 
 
 
 
        // BEWEGUNG DES RECHTECKS ÜBER DER ÜBERSICHTSKARTE DURCH DEN ANWENDER UND SETZEN DES NEUEN AUSSCHNITTS.
        var myDragLock = null; // GLOBALE VARIABLE UM ZU VERFOLGEN OB DIE BEWEGUNG GERADE AKTIV IST. WIRD AUCH HERANGEZOGEN UM DIE ANFANGSWERTE ZWISCHENZUSPEICHERN
        function myDrag(evt){
 
          if(evt.type == 'mousedown'){
 
            // BERECHNUNG IN PIXEL
            // ZWISCHENSPEICHERUNG DER ANFANGSWERTE. MIT DEN ERSTEN BEIDEN WIRD UNTEN DIFFERENZ ZUM OBEREN LINKEN ECKPUNKT DES RECHTECKS UND SPÄTER
            // DER ERFOLGTE WEG BERECHNET. DIE MULTIPLIKATION MAL 1000 ERGIBT SICH AUS DEM UMSTAND, DASS DAS VESCHACHTELTE SVG GENAU 1000 MAL KLEINER
            // IST ALS DIE URSPRÜNGLICHE viewBox. WENN DIES NICHT DER FALL IST, MUSS MAN DIESEN WERT FOLGENDERMASSEN BERECHNEN: 
            // FAKTOR =  parseFloat(document.getElementById('myOverviewMap').getAttributeNS(null,'viewBox').split(' ')[2])/document.getElementById('myOverviewMap').getAttributeNS(null,'width')
            // ACHTUNG, AUCH HIER WIRD VORAUSSGESETZT, DASS DIE PROPORTIONEN DES SVG-ELEMENTS MIT DER ÜBERSICHTSKARTE ZWISCHEN INHALT, viewBox UND width/height 
            // PASSEN UND DASS preserveAspectRatio MIT DEM DEFAULT-WERT BELEGT IST.
            // DIE LETZTEN BEIDEN WERTE SPEICHERN EBENFALLS DEN ANFANGSWERT IM BILDSCHIRMKOORDINATENSYTSTEM, DIESER WIRD onmouseup ZUM BERECHNEN
            // VON myCurrTransl.x/y DER HAUPTKARTE GEBRAUCHT.
            myDragLock = [evt.clientX * 1000, evt.clientY * 1000, evt.clientX, evt.clientY];
 
            var myRectNow = []; // ERFASSEN DER AKTUELLEN POSITION DES RECHTECKS.
            var myRect = document.getElementById('myOverviewRect');
            myRectNow[0] = myRect.getAttributeNS(null,'x');
            myRectNow[1] = myRect.getAttributeNS(null,'y');
            // BERECHNUNG DER DIFFERENZ UND SPEICHERUNG UNTER myDragLock. DURCH DIESE METHODE IST ES IRRELEVANT WO DER ANWENDER DAS RECHTECK ANFASST.
            myDragLock[0] -= myRectNow[0];
            myDragLock[1] -= myRectNow[1];
 
          } else if(evt.type == 'mousemove'){
 
            if(myDragLock){ // MACHE ÄNDERUNGEN NUR WENN SIE AUCH INITIERT WORDEN SIND
              // ZUWEISUNG DER BEWEGTEN DIFFERENZ, WIEDER MIT 1000er-SKALIERUNSGFAKTOR. DAS RECHTECK WIR SOFORT UNTER DER MAUS BEWEGT
              var myRect = document.getElementById('myOverviewRect');
              myRect.setAttributeNS(null, 'x', evt.clientX * 1000 - myDragLock[0]);
              myRect.setAttributeNS(null, 'y', evt.clientY * 1000 - myDragLock[1]);
              // FÜHRE AUCH DEN HINTERGELEGTEN KREIS MIT
              var myRectCirc = document.getElementById('myOverviewRectCirc');
              myRectCirc.setAttributeNS(null, 'cx', evt.clientX * 1000 - myDragLock[0] + myRect.getAttributeNS(null,'width') / 2);
              myRectCirc.setAttributeNS(null, 'cy', evt.clientY * 1000 - myDragLock[1] + myRect.getAttributeNS(null,'height') / 2);
            }
 
          } else if(evt.type == 'mouseup' || evt.type == 'mouseout'){
            if(myDragLock){ // MACHE ÄNDERUNGEN NUR WENN SIE AUCH INITIERT WORDEN SIND
 
              // DIE ZUWEISUNG MUSS ÜBER currentTranslate/Scale ERFOLGEN.
              var myCurrTransl = myDocElem.currentTranslate;
 
              // ES WIRD DIE REALE DISTANZ IN PIXEL HERANGEZOGEN (DER AUSGANGS WERT LIEGT IN myDragLock[2] UND myDragLock[3]). 
              // DIESER WERT MUSS MIT DER SKALIERUNG DER AKTUELLEN TRANSFORMATIONSMATRIX MULTIPLIZIERT WERDEN.
              // DA UNSERE ÜBERSICHTSKARTE 1000 MAL KLEINER DEFINIERT IST, MUSS DIESER FAKTOR HIER AUCH AUFGESCHLAGEN WERDEN.
              // DAS RESULTAT WIRD DANN DEM AKTUELLEN WERT VON currentTranslate ABGEZOGEN.
              myCurrTransl.x -=  (evt.clientX - myDragLock[2]) * myScreenMatrix.a * 1000;  
              myCurrTransl.y -=  (evt.clientY - myDragLock[3]) * myScreenMatrix.d * 1000;
 
            }
            myDragLock = null; // BEWEGUNGEN WIEDER FREIGEBEN.
          } 
        }
 
        // ANSZEIGE VON PARAMETERN DES SVGS.
        function myUpdateDisplays(){
           document.getElementById('myCurrScale').firstChild.data = 'currScal: ' + myDocElem.currentScale;
        }
 
 
 
 
 
        // DIESE FUNKTION ERSETZT DAS NICHT VERFÜGBARE getScreenCTM() FÜR DEN ADOBE SVG VIEWER 3.x.
        // ES WERDEN MÖGLICHST ALLE MÖGLICHKEITEN BERÜCKSICHTIGT, DAHER DIESE LANGEN if-ABFRAGEN.
        function myGetScreenCTM(doc){ // HANDLES getScreenCTM() FOR ASV3
          // THIS FUNCTION IS BASED ON THE WORK BY HOLGER WILL https://groups.yahoo.com/group/svg-developers/message/50789.
          var de = document.documentElement;
          var sCTM = de.createSVGMatrix();
          var tr = de.createSVGMatrix();
          var par = null;
          if(doc.hasAttributeNS(null,'preserveAspectRatio')){
            par = doc.getAttributeNS(null,'preserveAspectRatio');
          }
          if (par == null || par == ''){
            par='xMidYMid meet'; // setting to default value
          }
          var parX = par.substring(0,4); // xMin;xMid;xMax
          var parY = par.substring(4,8); // YMin;YMid;YMax
          var ma = par.split(' ');
          var mos = ma[1]; // meet;slice
          // set dimensions of the viewport
          sCTM.a = 1;
          sCTM.d = 1;
          sCTM.e = 0;
          sCTM.f = 0;
          // ## Batik doesn't know about innerWidth/innerHeight!
          var w = null;
          if(doc.hasAttributeNS(null,'width')){
            w = doc.getAttributeNS(null,'width');
          }
          if (w == null || w == '' || w.match(/%$/)){
            w  =  innerWidth;
          }
          var h = null
          if(doc.hasAttributeNS(null,'height')){
            h = doc.getAttributeNS(null,'height');
          }
          if (h == null || h == '' || h.match(/%$/)){
            h = innerHeight;
          }
          var vba = null;
          if(doc.hasAttributeNS(null,'viewBox')){
            vba = doc.getAttributeNS(null,'viewBox');
          }
          if(vba == null || vba == ''){
            vba = '0 0 ' + w + ' ' + h;
          }
          var vb = vba.split(' '); // get the viewBox into an array
          // create a matrix with current user transformation
          tr.a = de.currentScale;
          tr.d = de.currentScale;
          tr.e = de.currentTranslate.x;
          tr.f = de.currentTranslate.y;
          //scale factors
          var sx = w / vb[2];
          var sy = h / vb[3];
          // preserveAspectRatio='none'
          if (par == 'none'){
            sCTM.a = sx; // scaleX
            sCTM.d = sy; // scaleY
            sCTM.e = -vb[0] * sx; // translateX
            sCTM.f = -vb[0] * sy; // translateY
            sCTM = tr.multiply(sCTM) ; // taking user transformations into acount
            return sCTM;
          }
          //meetOrSlice
          var s = null;
          if(mos == 'slice'){
            s = (sx > sy ? sx : sy)
          } else {
            s = (sx < sy ? sx : sy)
          }
          sCTM.a = s; // scaleX
          sCTM.d = s; // scaleY
          switch(parX){
            case 'xMid':
            sCTM.e = ((w - vb[2]* s) / 2) - vb[0]*s; // translateX
            break;
            case 'xMin':
            sCTM.e = -vb[0] * s; //translateX
            break;
            case 'xMax':
            sCTM.e = (w - vb[2] * s) - vb[0] * s; // translateX
            break;
          }
          switch(parY){
            case 'YMid':
            sCTM.f = ( h - vb[3] * s) / 2 - vb[1] * s; // translateY
            break;
            case 'YMin':
            sCTM.f = -vb[1] * s; //translateY
            break;
            case 'YMax':
            sCTM.f = ( h - vb[3] * s) - vb[1] * s; // translateY
            break;
          }
          sCTM = tr.multiply(sCTM); //taking user transformations into acount
          return sCTM
        } // ENDE VON getScreenCTM() FÜR ASV3
 
 
      ]]>
    </script>
  </defs>
 
  <!-- DIESER RAHMEN ENTSPRICHT DEN ANGABEN IN DES BEREIHTS DER HAUPTKARE -->
  <rect x="0" y="0" width="100%" height="100%" fill="orange" />
 
  <!-- HAUPTKARTE ALS VERSCHACHTELTES SVG-ELEMENT, ABER SO PLATZIERT, DASS ES SICH VERHÄLT, ALS WÄRE ES DAS WURZELELEMENT -->
  <svg id="myMap" width="100%" height="100%" viewBox="437000 -4788000 146000 226000">
    <image id="myTerrain" xlink:href="92321.jpg" x="447111.7" y="-4769218.4" width="108147.8" height="202257"/>
 
    <path id="mySea" fill="lightblue" fill-rule="evenodd" d="M440000 -4785000 h 140000 v 220000 h-140000 z M485402.1 -4618513.3l-284 -196.7l-478.6 138.8l-640.9 -264.4l-322.1 312.7l-407.7 -66.6l-349.4 237.2l-191.6 462.5l-702.5 321.8l-130 -124l263.3 -641.8l-161 -351.9l-713.7 -135.7l-233.3 -197.6l-32.9 -304.2l297.5 -556.6l721.2 -1349.2l-264.9 -451.3l-718.2 -313.2l-2186.8 840.5l-871.2 681.8l-1441.7 187.3l-551.5 267.5l-458.4 -65.5l-234.5 -248.6l-216.4 -1570.8l-284.6 -221.7l-2593.6 -217.6l-175.3 200.1l-302.7 -35.9l286.7 -657.9l249.2 -244.7l1138.7 -129.1l290.9 475.9l469.9 -494.2l380.3 -9.2l744.5 -678.8l782.4 -171l260.7 -510.8l199.2 -390.3l1016.4 -964.9l139 -537l-460.3 -141.6l-70.1 -786.3l-535.2 -89l-182.5 -198.8l37.6 -534.8l-287.8 -349.1l351.3 -161.1l510.9 140.2l675.8 645.1l514.3 -749.8l749.5 -475.5l314.6 -617.9l303 -58l311.9 297.8l303.7 -33l377.5 -1152.7l918.3 -835.7l216.3 -488.2l-129.2 -22.8l-890.2 -156.1l-437.4 -243.9l-192.6 -605.3l-758.9 94.4l-106.5 -200.6l168.7 -359.9l2276.2 -308.9l323.4 -262.2l183.4 -792.4l-316.6 -1517.9l-154.7 -97.8l193.5 -386.2l-421.5 -625.4l998.7 -659.5l605.6 -141.7l197.9 -207.9l63.5 -510.2l-275 -857.5l-307.8 -486.5l-326 -515.4l-936.8 -943.5l-437.5 -243.8l-1240.9 105.9l-698.6 -542.5l-658.8 41.2l-165.6 487l143.8 683.2l-119.9 282.6l-785.6 44.2l-567 674.6l-2109.4 -127.4l-759 94.7l-573.2 420.6l-429.9 61.1l-1481.3 -395l-688.2 -112.1l-1265 157.4l-928.3 429.3l-666.5 753.1l-486.3 -166.1l443.4 -659.6l95.1 -141.5l-173 -834.7l87.7 -561.6l416.7 -594.9l323 -1304.4l-341.7 -474.6l-713.2 -109.9l-330.2 -1034.5l-560.5 -88.2l90.1 -460.4l-136.2 -377.6l-438.1 -268.5l119.3 -308.6l708.3 -93.7l374.2 -262.6l1845.1 -298.9l468.5 471.7l965.1 27.3l627.5 -733.6l740.4 -392.7l364 -669.1l111.2 -638.3l-114.7 -531.6l-708.8 68l-408.8 -1133.8l78.1 -266.1l132.6 -451.4l2890.7 -2154.6l1849 -145.6l597.4 -472l362.2 -746l939.1 3.4l169.4 -334.9l16.3 -1398.5l-242.1 -553.9l-541.4 -343.1l-1116.6 1.5l-564 -1257.7l-700.6 -618.3l-269.3 -629.5l210.7 -717.2l-248.7 -1850.1l-341.7 -475.6l-327.2 109.8l-814.5 934.7l-991.1 -52.1l-368.5 492l-357.6 -92.9l-704.5 -1185l-226.6 -547.7l-284.8 -221.4l-534.5 -64.1l-493.3 -445.2l-627.2 294.6l-1399.3 -1161.3l-1494 137.8l-282.8 -145.4l90.8 -434.6l324.8 -211.1l264.5 -591.3l-358.3 -119l-862.2 -996.2l-608.1 39.8l-572.7 446.1l-353.9 59.6l386.4 -797.7l115.7 -15.9l795 -107l389.5 -671.5l504.8 -113.6l239.2 -590.6l-185.7 -326.2l-1951.9 98.3l-110.9 -378.8l1415.5 -237.7l168.7 -359.6l-556 -927.8l127.9 -2012.2l-282.8 -145.4l-783.8 120.6l391.3 -594.8l478.8 -138.2l46.3 -178.9l-387.4 -270.5l89.4 -603.6l84.6 -570.5l-850.3 -513.5l-445.9 443.3l-204.9 -71.8l-343 -525.3l-513.6 -242.1l-108.4 -277.6l275.3 -158.6l410.2 168.2l710.9 8.4l551.8 -267.8l734.3 -67.9l794.1 -731.4l1265.2 -157.9l887.4 -1064.1l934.8 -174.5l265 451.4l613.8 189.1l455.3 -62.4l317.2 -516.3l313 -79.2l1097.6 -361.5l838.4 30.4l617.8 -675.3l338 322.3l878.4 -403l-260.6 -273.3l-66.5 -633.9l-210.5 -299.8l-304.4 6.5l-413.4 -294.7l55.4 -840.6l-748.2 -491.3l-604.2 -824.5l-554.3 166.3l-357.7 -92.5l-407.6 270.2l-1110.5 -1098.8l-564.3 -241.4l-660.9 -34.3l-598.1 447.1l-378.7 84.7l-517.2 -1411.7l170 -308.8l556.2 -90.2l1324.4 -845.4l267.2 -489.3l8.7 -382l3.4 -152.5l-508 -13.3l-157.2 -199.4l138.3 -563.6l-160.3 -326l-628.6 244.1l-855.3 -716.9l-408.4 -92.2l-444.7 493.9l-483.9 -65l-930 1395.7l-431.9 -14.9l-645.2 600.3l-312.6 -323.1l166.3 -461.7l-332.1 -1110.3l314.1 -643.9l-306.1 -1085.6l-408.4 -92.8l-294.8 -628.1l143.4 -359.7l301.9 -108.9l75.4 -27.1l441.3 396.7l683.1 -93l135.6 352.7l251.8 -83l564.6 -776.1l-437 -218.2l570.3 -547.4l763 57.6l291.2 -540.8l769.9 337.5l369.8 -440.9l255.6 69.8l199.2 -157.5l-473.6 -675.3l15.3 -407l445.3 -468.5l-32.3 -278.9l-329.8 7.8l-107.2 -225.8l292.5 -490.8l1321.2 -972.5l560.7 88.5l223.2 -209.5l575.4 143.9l446.4 112l146.3 784.2l330.5 17.9l-61.5 -431l574.7 -369.6l166.9 -436.9l139 -537l-282.5 -1163l-457.9 -40l-32.3 -278.9l396.5 -390.6l-131.9 -200.5l69.1 -281.4l300.7 -159.7l65.2 582.7l336.1 246.2l175.1 -105.2l45.4 -1247.7l215.8 -722.2l135.8 -455.7l597 -497.5l-366.5 -449.1l-1624.9 -12.4l-412.8 -269l1186.4 -1300.2l114.2 -510.8l-159.4 -1319.3l189.1 -564.3l1422.9 -974.7l388.1 295.8l271.5 -311.6l378.6 -85.5l488 -800.1l427.5 -162.9l233.9 222.8l458.6 66l271.6 -311.7l-109.9 -180.4l-287 -472l361.1 -796l-95 -2821l-410.9 -193.7l804.6 -1341.3l277.2 -83.4l92.5 659l493.9 471.4l-342.7 516.9l55.2 176.4l331.7 68.8l447.3 -392.5l353.9 -59.5l1251.9 326.1l806.5 794.8l1547.6 -37.4l652.8 -295.3l295.1 -388.6l-12.9 -1550.8l945.7 -1803.1l-418.5 -498.7l248.6 -209.1l1567.4 -266.4l440.7 370.7l551.9 -267.5l868.6 -809.1l331.1 43.4l132.4 225.2l1042.1 51.3l523.4 -394l436.7 -824.1l208.3 -818.9l133.9 -107.8l189.7 -154.3l1397.3 42.9l1626 -980.2l187.4 -639.9l582.3 -64.7l626.4 697.3l665.2 212.3l1372 43.5l1991.2 -580.6l878 -428.2l838.5 30.9l310.1 221.1l1715 -1490.6l1036.6 -176.7l1077.8 -560.2l37 -560l-411.2 -1237l189.2 -563.9l374.3 -263.7l-336 -245.9l-135 -327.8l116.9 -409.7l1274.2 199.4l515.3 -724.4l307.6 -23.6l199.2 -14.6l243.7 -412.8l-119 -709l342.1 -542.6l735.8 -17.3l168.8 -360.3l1072.3 -788.8l379.2 -59.4l-19.1 254.6l204.9 71.3l368.7 -491.9l326.7 -134.8l722.3 465.7l174.4 -131.2l181.8 -869.1l2123.7 -355.9l880.2 691.6l219.6 -361l279.7 18l446.3 599.7l943.8 181.2l442.3 -595.4l585.5 62.1l318 -490.9l227.8 -31.1l239.6 452.6l335.5 221.1l280.5 1086.6l893 182.6l243.1 -438.3l204.8 71.4l604.8 850.1l-336.5 771.1l213.6 427.2l1232.2 555.8l84.8 354.3l409.7 142.7l167.8 631.9l281.5 94.8l445 549.2l295.9 679.7l489.6 294l-40.3 -609.8l167 -436.5l852.7 -427.1l1118.1 -993.3l238.2 -641.4l-148.7 -887.3l82.8 -764.5l508.7 38.3l926.8 -1547.3l105.1 -892.5l-236.6 -1368.1l27.7 -941.4l191.6 -1505.4l-222.3 -783.2l369.3 -1509.5l-1915.2 -2523.1l-207.5 -1216.7l-576.3 -723.5l923.2 -1700.9l550.8 -317.7l552.4 -1284.5l63.7 -510.3l-187.8 -209.4l-282 -314.1l-293.6 -1621.3l-423.5 -701.6l185.6 -716.6l2661.6 -2250.9l13.4 -483.8l-415.3 -371.5l207.9 -844.3l-102.9 -1090.8l-495.8 -548.2l-169.8 -708.4l73.5 -1146.6l-448.2 -675.5l48.7 -426.4l76.7 -670.5l-324.4 -806.1l93.4 -332.9l1014.8 -1067.1l527.2 -241.6l641.2 264.5l875.1 -555l1874.6 -171.8l488.4 242.9l378.2 -110.7l618.1 -676.2l443.2 472.7l502.6 -215.2l206.9 1190.6l1216.3 937.5l588.8 227.7l154.6 60.2l320.7 653.6l-425 1306.7l194.1 2743.2l549 648.1l192 580.6l-63.1 535.4l548.5 1665.6l-178.1 1022.4l349.2 779.6l-88.5 536.4l196.3 758.9l-278.3 1074.6l13.7 559.5l198.7 245.9l325 402.7l673 2603.9l-301.9 1151.4l179.5 72.3l164 479.4l7.7 2390.4l385.7 1237.3l-597.1 1540.3l-132.3 817.1l-639.8 829.3l-151.5 1071.7l-431.2 1053l-116.2 1477.8l-542.5 1691.5l-190.2 3641.9l-296.4 337.5l-190.9 2573.2l-429.3 1129.1l226.5 961.7l-82.2 790l653.6 773l742.1 1279.5l310.1 1264l50.2 1016.4l631.3 900.4l513.7 1284.8l1265.5 885.2l896.8 335.2l277.2 -83l167.7 -410.6l-169 -683.1l-1310.4 -2255.1l-738.5 -878.5l-60.3 -71.7l-280.3 -43.7l-68 332.1l240.7 503.1l-191.8 462l-234.5 -248.6l-416.1 -1440l261.7 -718.2l-268.6 -604.2l-514.9 -292.8l-319.4 -602.7l-346 -1081.7l-460 -730.3l-87.9 -481.2l116.9 -409.4l1310.4 2715.3l1091.4 1343.9l793.2 976.5l379.4 983.1l833.1 844.4l1063.2 1959l603.5 1842.3l508.8 2124.1l-37 1603.1l-84.1 713.9l-243.7 1456.2l-120.5 2342l109 1345.5l1040.9 2086.4l43.4 1778.8l-178.1 1021.1l212.3 376.5l-504.3 2224.5l28.6 2211.8l-455.3 1104.2l937 4072l746.3 2499.9l398.5 2813.4l301.3 908.3l-64.9 459.2l240.7 502.9l-723.3 1568.2l229 1062.5l-371.8 2449.9l769.7 2422.9l-261.1 743.8l-115 485.7l511.6 1208.9l-472.7 1434.8l-147.2 1249.7l-220.2 335.2l-353.3 -957.5l-384.8 -169.1l-193.6 385.8l346.4 678.5l-42.7 331.5l612.6 138.4l83.5 303.2l-146.6 232.2l-713.4 -110.2l-502.4 215.8l271 705.2l-368.1 516.5l161.5 378.1l-193.7 385.8l-1007.2 329l-141.6 199.5l-79.3 111l577.2 774.6l483.3 39.8l738 -958.9l276.5 -108.1l306.8 -948.2l11.8 -559.6l470.2 548.5l13.6 559l-366.8 1610.2l-287.7 693.1l-1273.2 -172.9l-349 262.6l1097 228.7l136.1 377.8l-540.2 1765.9l-47.5 154.5l-864.2 987.2l-430.6 1078l-1263.3 1275.7l-374.9 1280.1l-710.8 1033.8l-597.6 471.8l-2936.5 4467.9l-209.1 -249.2l-345.8 389.8l-68.7 306.2l-1071.4 779.2l-50.1 239.6l553.2 -457.2l280.6 132.4l-1245.8 1987.2l-639.6 1871l-206 -122.3l-24.2 -991l-228.9 -20.1l-291.5 -501.4l-171.9 232.9l189.9 504l-83.5 739.1l306.9 1137.1l400.2 -238.2l362.5 296.4l-460 2985.3l-416.9 594.5l-26.6 992.1l-708.2 2177.8l355.1 1033.9l-266.5 515l6.2 254.1l256.1 95.4l136.8 403.8l-58.7 713.1l238.2 1446.5l178.8 1085.5l-97.7 1197.4l-699.5 1491.1l381.1 1058.4l-277.7 1099.9l36.5 456.4l840.6 132.9l-207.2 869.2l384.8 2253.1l-398.9 1331.4l193.1 1673.3l-149.1 130.7l246.3 731.1l-205.9 920l-280.9 -69.4l-113.8 -506l-247.4 260.3l326 882l-218.4 411.8l-50 35l-473.8 333.4l-455.9 35.9l-665.5 803.8l-357.5 -93.3l-351.3 161.2l438.5 294.6l-38.9 483.8l340.8 449.6l355.6 17.1l56.9 252.6l-523.9 368.2l-45.7 204.3l611.1 87.5l642.6 340.6l-387.8 746.3l13.6 559l-283.9 -196.9l-227 56.5l-162.6 614l-588.8 827.2l-532.5 12.4l-364.3 -372.4l-782.9 145.5l-439.1 722.2l-349.4 236.9l182.4 199.2l452.2 -188.6l183.6 250l-90.9 434.1l187.4 339.3l131.2 237.9l-175.6 80.3l-258.5 -197.2l-1097.2 -253.6l-845.3 706.3l-508.4 -38.8l67.4 -357.7l631.4 -116.7l-81 -201.3l-809.6 95.4l-1058.9 -762.7l-168.7 359.7l139.8 530.6l-138.6 562.5l-1455.8 644.5l-244.9 361.6l172.7 834.6l-186.7 665.5l106.4 200.8l563.4 215.4l-47.5 1170.3l203.4 20.5l479.9 -1129.9l544.2 -572l259.1 -819.6l850.3 -502.8l512 191.2l934.6 -174.7l529.4 902.1l1246.2 123.3l795.9 -654.3l266 502l-240 564.7l-815.7 883.5l-606 1158.3l-21 1220.7l-96.9 129.6l-173.4 232.4l-1667.3 294l-645.1 599.6l-403.1 111.2l-296.3 337.8l56.3 227.2l-252.3 56.8l-1804.4 1949.3l-335.8 -246.2l-933.2 225.3l-409.9 873.7l1067.4 76.7l233.8 222.9l91 607.9l-284.5 820.4l-925.1 555.6l592.9 526.7l159.2 141.8l401.3 -187.6l330.9 43l87.9 480.8l-221.9 1301.3l-399.5 263.9l-265.9 540l-604.8 166.6l-170.6 283.9l747 465.2l56.3 227.2l-276.4 108.4l-720.5 -415.3l-322.8 287.3l-80.9 840.9l-331.4 -68.5l-1617.6 1283.6l-1947.3 249.8l-242.9 437.6l821.2 387.2l400.8 829l-448.3 341.2l336.4 271.5l-33.9 687l-609.7 -36.2l-121.8 206.1l-9.2 661.1l285.7 272.4l478.6 -138.4l742 -779.9l1093.7 -856.4l847.8 -664l434.1 116.9l82.3 252.2l-219.6 361.1l-58 738.3l-548.5 394.2l-62.4 560.9l-1258.9 1427.3l-304.1 1049.4l-422.3 365.7l-318.9 1481.4l-915.2 -79.9l-527.4 216l-2082 -77.5l-463.2 -268.4l-178.8 -568.8l-233.7 -743.2l-337.7 -322.1l-1398.1 -119.4l-1217.1 -1013.1l-563.3 -215.1l-242.5 -578.6l-753.7 297.5l-884.8 122.7l-618.3 649.9l-511.6 -1207.7l297.8 -1303.4l322.1 -312.5l457 14.7l294.9 -388.3l40.8 -407.9l-338.4 -347.7l703.3 -663.2l982.8 -927.1l-109.4 -327.6l-305.5 -43.6l-341.2 567.1l-379.7 34.4l-205.3 -96.7l-298.8 -806l-316.5 541.2l-412.5 -269.7l-72.4 -887.6l-159 -275.9l-655.2 1210.2l-750.6 424.2l-304.9 -17.9l-388.4 -321.1l-474.4 -725.9l464.1 -1764.7l717.1 -754l-144.2 -708l-1547 1053.2l-638 879.6l-857.7 198.2l-331.7 -1110.3l-330.9 -43.1l-741.8 780.3l-118.9 -708.9l-721.2 -440.3l182.2 -842.8l-356.9 327l-412.1 377.4l-356.2 -42.3l-857.9 -843.7l-353.8 59.2l-412.9 747l-292.6 -551.9l-588.7 -214.9l-86.2 -404.5l-231.3 -121.6l-575 344.1l107.3 -790.2l-413.8 -320.8l-408.2 -91.7l-1203.9 562.5l-541.8 -368.4l-315.2 592.2l-357.5 -93.1l-326.4 134.8l-82.4 -252.1l236.7 -692.2l-485.2 -1157.5l392.6 -543l-792.3 -235.4l-393.1 518l-378.5 85.1l-693.3 -339.2l-672.7 499.3l-280.1 -44.4l-107 -225.9l511.2 -876.4l-391.6 -448.2l-418.2 -498.2l-1075.3 635.8l-361.3 -245.8l-1189.8 104.7l-310.5 -246.6l262.6 -667l615.7 -751.9l-345.9 -652.4l334.2 -846.9l-279.5 -18.7l-442 595.1l-202.2 30.1l-264.9 -451.1l-227 56.3l-258.6 -197l-651 346l-486.1 -166.2l-865.6 -1148.8l-1091.6 -24.5l-418.9 -523.6l14.1 -457.8l912.4 -1064.2l-81.1 -201.4l-670.5 -441.2l-168.5 -656.9l-556 89.7l-522.2 -597.6l181.1 -118.1l667.8 -435.8l-262.3 -349.6l593.7 -1640.9l-418.8 -524.1l541.5 -673.8l43.2 -306.1l818.6 -756.6l81.4 -815.5l174.9 -105.9l1123 1295l666.5 -753.3l2430.2 -1252.9l505.2 -88.1l742.3 261.6l199.1 -157.3l455.2 -2120.7l443.9 -519l606.1 -116.1l572 -471.1l733.5 -94l349.3 -236.8l290 -591.8l-210.4 -300.1l-79.8 -150.4l-1899.9 121.9l-459.6 -116.2l-568.5 -418.4l-788.6 -82.9l-567.2 -367.7l-1164.6 103.9l-664.4 -187.2l-1166.8 -1014.5l120.6 -256.8z M522227.6 -4579741.8l-327.2 109.4l-262.8 -374.9l-358.6 -144.2l-131.8 -199.9l269 -413.3l334.6 195.5l324.6 -211l332.7 119.3l-170 308.8l123 385.4l-133.5 224.9z M521624.4 -4576398.5l-906.6 -766l70.5 -230.6l302.9 -58l726 643.7l-192.9 410.9z"/>
 
    <g id="myTempArea">
      <g id="myTempPolys">
        <g id="myTempCantons"/>
        <g id="myTempArrondissements"/>
        <g id="myTempDepartements"/>
      </g>
      <g id="myTempWaters"/>
      <g id="myTempRoads">
        <g id="myTempRoadsCat4"/>
        <g id="myTempRoadsCat3"/>
        <g id="myTempRoadsCat2"/>
        <g id="myTempRoadsCat01"/>
      </g>
      <g id="myTempPoints"/>
      <g id="myTempTexts">
        <g id="myTempTextMain"/>
        <g id="myTempTextAll"/>
      </g>
    </g>
 
    <g id="myPassiveElements" pointer-events="none">  
      <g id="myMapFrame">
        <g id="myGrid" stroke="blue" stroke-width="200" fill="none">
          <path d="M450000 -4785000 v 220000"/>
          <path d="M500000 -4785000 v 220000"/>
          <path d="M550000 -4785000 v 220000"/>
          <path d="M440000 -4750000 h 140000"/>
          <path d="M440000 -4700000 h 140000"/>
          <path d="M440000 -4650000 h 140000"/>
          <path d="M440000 -4600000 h 140000"/>
        </g>
 
        <g id="myBorder">
          <rect id="myBorderOuter" stroke="black" stroke-width="5000" fill="none" x="440000" y="-4785000" width="140000" height="220000"/>
          <rect id="myBorderInner" stroke="white" stroke-width="4500" fill="none" x="440000" y="-4785000" width="140000" height="220000"/>
          <g id="myGridCoords" fill="blue" font-size="4000" text-anchor="middle">
            <text id="myGridCoords1" x="450000" y="-4785000" baseline-shift="-2000">450000</text>
            <text id="myGridCoords2" x="500000" y="-4785000" baseline-shift="-2000">500000</text>
            <text id="myGridCoords3" x="550000" y="-4785000" baseline-shift="-2000">550000</text>
            <text id="myGridCoords4" x="440000" y="-4750000" baseline-shift="-1500" transform="rotate(-90 440000 -4750000)">4750000</text>
            <text id="myGridCoords5" x="440000" y="-4700000" baseline-shift="-1500" transform="rotate(-90 440000 -4700000)">4700000</text>
            <text id="myGridCoords6" x="440000" y="-4650000" baseline-shift="-1500" transform="rotate(-90 440000 -4650000)">4650000</text>
            <text id="myGridCoords4" x="440000" y="-4600000" baseline-shift="-1500" transform="rotate(-90 440000 -4600000)">4600000</text>
          </g>
        </g>
      </g>
 
      <use id="myMapElementsOverTheGridHalo" xlink:href="#myMapElementsOverTheGrid" stroke="lightblue" stroke-width="0.5"/>
      <g id="myMapElementsOverTheGrid">
        <text id="myTitle" x="460000" y="-4751000" font-size="10000" fill="black">Korsika</text>
        <text id="myProjection" x="575000" y="-4570000" font-size="3000" text-anchor="end">Projektion: UTM (Zone 32)</text>
        <g id="myCopyright" font-size="3000" transform="translate(-3000,2000)">
          <text x="448000" y="-4587000">Grundlagen: DCW und SRTM</text>
          <text x="448000" y="-4583000">Schummerung: n.hafner@carto.at</text>
        </g>
        <g id="myScaleBar">
          <path id="strecke" stroke="black" stroke-width="500" fill="none" d="M460000 -4571000 v 2000 h 25000 v -2000"/>
          <text id="m_text" fill="black" font-size="3000" x="472500" y="-4571000" text-anchor="middle">25 km</text>
        </g>
      </g>
    </g><!-- ENDE PASSIVER ELEMENTE -->
 
  </svg>
  <!-- ENDE DES VERSCHACHTELTEN SVG-ELEMENTS MIT DER HAUPTKARTE -->
 
  <!-- GRUPPE FÜR INTERFACE-ELEMENTE-->            
  <g id="myFlyOutBorders" fill="black" onmouseover="evt.target.setAttributeNS(null,'opacity',.3)" cursor="pointer" onmouseout="evt.target.setAttributeNS(null,'opacity',0.1)">
    <rect id="myFOBSS" x="0" y="0" width="0" height="0" opacity=".1" onclick="myDoPan(0,-1)"/>
    <rect id="myFOBNN" x="0" y="0" width="0" height="0" opacity=".1" onclick="myDoPan(0,1)"/>
    <rect id="myFOBEE" x="0" y="0" width="0" height="0" opacity=".1" onclick="myDoPan(-1,0)"/>
    <rect id="myFOBWW" x="0" y="0" width="0" height="0" opacity=".1" onclick="myDoPan(1,0)"/>
    <rect id="myFOBSE" x="0" y="0" width="0" height="0" opacity=".1" onclick="myDoPan(-1,-1)"/>
    <rect id="myFOBSW" x="0" y="0" width="0" height="0" opacity=".1" onclick="myDoPan(-1,1)"/>
    <rect id="myFOBNE" x="0" y="0" width="0" height="0" opacity=".1" onclick="myDoPan(1,-1)"/>
    <rect id="myFOBNW" x="0" y="0" width="0" height="0" opacity=".1" onclick="myDoPan(1,1)"/>
    <g pointer-events="none">>
      <rect id="myDynScalebar" x="0" y="0" width="0" height="0" fill="lightgray" stroke="navy" stroke-width="1" shape-rendering="crispEdges"/>
      <text id="myDynScalebarText" x="0" y="0" fill="black" font-size="12" text-anchor="middle"> </text>
    </g>
  </g>                                            
  <!-- ENDE GRUPPE FÜR INTERFACE-ELEMENTE -->    
 
 
  <!-- VERSCHACHTELTES SVG-ELEMENT FÜR EIN INTERFACE -->
  <svg id="myInfoBlock" x="200" y="0" width="180" height="520" viewBox="0 0 180 520" overflow="visible" font-size="12">
 
    <!-- HINTERGRUNDRECHTECK ZUR ABGRENZUNG DES INTERFACEBEREICHS -->
     <rect x="0" y="0" width="180" height="520" fill="lightgreen" stroke="navy" stroke-width="1" shape-rendering="crispEdges"/>
    <g id="myNavig" transform="translate(5,10)" stroke="navy" stroke-width="1" onmouseover="evt.target.setAttributeNS(null,'fill','lightgray')" cursor="pointer" onmouseout="evt.target.setAttributeNS(null,'fill','white')">
      <g shape-rendering="crispEdges">
        <rect id="myPanNW" x="0" y="0" width="20" height="20" onclick="myDoPan(1,1)" fill="white"/>
        <rect id="myPanNN" x="25" y="0" width="20" height="20" onclick="myDoPan(0,1)" fill="white"/>
        <rect id="myPanNE" x="50" y="0" width="20" height="20" onclick="myDoPan(-1,1)" fill="white"/>
        <rect id="myPanWW" x="0" y="25" width="20" height="20" onclick="myDoPan(1,0)" fill="white"/>
        <rect id="myResetAll" x="25" y="25" width="20" height="20" onclick="myDoReset()" fill="white"/>
        <rect id="myPanEE" x="50" y="25" width="20" height="20" onclick="myDoPan(-1,0)" fill="white"/>
        <rect id="myPanSW" x="0" y="50" width="20" height="20" onclick="myDoPan(1,-1)" fill="white"/>
        <rect id="myPanSS" x="25" y="50" width="20" height="20" onclick="myDoPan(0,-1)" fill="white"/>
        <rect id="myPanSE" x="50" y="50" width="20" height="20" onclick="myDoPan(-1,-1)" fill="white"/>  
      </g>
      <circle cx="100" cy="17" r="16" fill="white" onclick="myDoZoom(1)"/>
      <circle cx="100" cy="53" r="16" fill="white" onclick="myDoZoom(-1)"/>
      <circle cx="135" cy="35" r="16" fill="white" onclick="myDoReset()"/>
      <g id="myNavigSymbols" pointer-events="none">
        <use xlink:href="#mySymbArrow" transform="translate(10,10),rotate(135)" />
        <use xlink:href="#mySymbArrow" transform="translate(35,10),rotate(180)" />
        <use xlink:href="#mySymbArrow" transform="translate(60,10),rotate(-135)" />
        <use xlink:href="#mySymbArrow" transform="translate(10,35),rotate(90)" />
        <circle cx="35" cy="35" r="7.5" fill="none" stroke="navy" stroke-width="1"/>
        <circle cx="35" cy="35" r="5" fill="navy"/>
        <use xlink:href="#mySymbArrow" transform="translate(60,35),rotate(-90)" />
        <use xlink:href="#mySymbArrow" transform="translate(10,60),rotate(45)" />
        <use xlink:href="#mySymbArrow" transform="translate(35,60)" />
        <use xlink:href="#mySymbArrow" transform="translate(60,60),rotate(-45)" />
        <text x="100" y="30" fill="navy" text-anchor="middle" font-size="40">+</text>
        <text x="100" y="66" fill="navy" text-anchor="middle" font-size="50">-</text>
        <text x="135" y="45" fill="navy" text-anchor="middle" font-size="26">F</text>
      </g>
    </g>
 
    <!-- ÜBERSICHTSKARTE -->
    <!-- DIESE KARTE IST IM SELBEN BEZUGSSYSTEM WIE DIE HAUPTKARTE, JEDOCH MIT KLEINEREN AUSMASSEN DARGESTELLT -->
    <svg overflow="hidden" id="myOverviewMap" onmouseup="myDrag(evt)" onmouseout="myDrag(evt)" onmousemove="myDrag(evt)" viewBox="437000 -4788000 146000 226000" x="3" y="90" width="146" height="226">
      <rect id="myBackgroundRect" x="437000" y="-4788000" width="146000" height="226000" fill="green" fill-opacity=".3" stroke="green" stroke-opacity="1" stroke-width="3000"/>
 
      <!-- ES WIRD HIER EINFACH EINE KOPIE DER POLYGONE DER HAUPTKARTE HERANGEZOGEN, IDEALERWEISE WÄRE HIER EINE GENERALISIERTE ÜBERSICHTSKARTE -->
      <use xlink:href="#mySea"/>
 
      <g onmousedown="myDrag(evt)" cursor="pointer">
        <!-- DIESER KREIS HINTERLEGT DAS RECHTECK (UNTEN) WENN DIESES IN DER ÜBERSICHTKARTE ZU KLEIN WIRD SO DASS ES DER ANWENDER NOCH ANFASSEN KANN -->
        <circle id="myOverviewRectCirc" cx="0" cy="0" r="0" fill="navy" fill-opacity=".1" stroke="navy" stroke-width="1000"/>
 
        <!-- RECHTECK, DASS ANZEIGEN SOLL, WELCHER AUSSCHNITT IN DER HAUPTKARTE DARGESTELLT WERDEN SOLL -->
        <!-- BEI ÄNDERUNG DER VIEWBOX DR HAUPTKARTE, WERDEN DIE 4 PARAMETER DER VIEWOX DEN ATTRIBUTEN DES RECHTECKS ZUGEWIESEN -->
        <rect id="myOverviewRect" x="437000" y="-4788000" width="146000" height="226000" fill="navy" fill-opacity=".1" stroke="navy" stroke-opacity="1" stroke-width="2000" shape-rendering="crispEdges"/>
      </g>    
 
    </svg><!-- ENDE ÜBERSICHTSKARTE-->
 
 
    <!-- ZOOM-SLIDER MIT "FÜHRUNG" UND ERWEITERTEN SENSIBLEN BEREICH. DIE ÄNDERUNG ERFOLGT NICHT ÜBER x/y SONDERN ÜBER transform -->
    <g transform="translate(159 90)" shape-rendering="optimizeSpeed">
      <rect id="mySliderBg" x="-1" y="-1" width="17" height="226" fill="lightgrey" stroke="blue" stroke-wdith="1"/>
      <g id="mySlider" transform="translate(0,209)" onmousedown="mySliderDrag(evt)" onmouseup="mySliderDrag(evt)" onmousemove="mySliderDrag(evt)">
        <rect x="-9" y="-30" width="100" height="75" opacity=".1" fill="black"/>
        <rect x="0" y="0" width="15" height="15" fill="grey" stroke="black" stroke-wdith="0" cursor="pointer"/>
      </g>
    </g>
 
    <text x="5" y="330" font-size="12" onclick="alert(myLayerArr)" id="myCurrScale"> </text>
    <text x="5" y="345" font-size="12" id="myShowTempTextMain"> </text>
    <text x="5" y="360" font-size="12" id="myShowTempTextAll"> </text>
    <text x="5" y="375" font-size="12" id="myShowTempPoints"> </text>
    <text x="5" y="390" font-size="12" id="myShowTempRoadsCat01"> </text>
    <text x="5" y="405" font-size="12" id="myShowTempRoadsCat2"> </text>
    <text x="5" y="420" font-size="12" id="myShowTempRoadsCat3"> </text>
    <text x="5" y="435" font-size="12" id="myShowTempRoadsCat4"> </text>
    <text x="5" y="450" font-size="12" id="myShowTempWaters"> </text>
    <text x="5" y="465" font-size="12" id="myShowTempCantons"> </text>
    <text x="5" y="480" font-size="12" id="myShowTempArrondissements"> </text>
    <text x="5" y="495" font-size="12" id="myShowTempDepartements"> </text>
 
 
 
 
 
 
 
 
 
  </svg>
  <!-- ENDE DES VERSCHACHTELTEN SVG-ELEMENTS FÜR EIN INTERFACE -->
 
 
 
</svg>