Hallo, Gast! (Registrieren)

Letzte Ankündigung: MyBB 1.8.19 veröffentlicht (11.09.18)


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste
Google Maps Pins "verknüpfen"?
#1
Hallo ihr Lieben,

ich hoffe ich bin hier im richtigen Thread, da meine Frage doch etwas kompliziert ist.

und zwar möchte ich in mein Forum gerne eine Google Karte einbinden. Ich hatte zuerst bei Google Maps direkt nach einem Code gesucht zum "einbetten" aber da finde ich nur diese vereinfachte Variante mit dem "<iframe" Code. Nun hab ich eine Seite gefunden, bei der man sich den kompletten Code anzeigen lassen kann. Das Einbetten klappt damit wunderbar und nun möchte ich gerne meine Pins verknüpfen. Ich hätte gerne neben der Karte eine Tabelle in der die verschiedenen Markierungen sozusagen aufgelistet sind und sobald man mit der Maus über eine "Adresse" fährt soll diese in der Karte angezeigt werden, also der Bildausschnitt soll sozusagen zu der Markierung springen. Ich hoffe ich hab es einigermaßen verständlich erklärt und ihr wisst, was ich damit meine? *Kekse dalass*

Hier einmal der Code, den ich zum Einbinden in das Forum verwende:
Code:
<script src='https://maps.googleapis.com/maps/api/js?key=&sensor=false&extension=.js'></script>

<script>
   google.maps.event.addDomListener(window, 'load', init);
   var map;
   function init() {
       var mapOptions = {
           center: new google.maps.LatLng(40.782597,-73.971114),
           zoom: 14,
           zoomControl: true,
           zoomControlOptions: {
               style: google.maps.ZoomControlStyle.SMALL,
           },
           disableDoubleClickZoom: false,
           mapTypeControl: false,
           scaleControl: false,
           scrollwheel: true,
           panControl: false,
           streetViewControl: false,
           draggable : true,
           overviewMapControl: false,
           overviewMapControlOptions: {
               opened: false,
           },
           mapTypeId: google.maps.MapTypeId.ROADMAP,
       }
       var mapElement = document.getElementById('Manhattan');
       var map = new google.maps.Map(mapElement, mapOptions);
       var locations = [
['Central Park West', '', 'undefined', 'undefined', 'undefined', 40.78327901108392, -73.97107356961976, 'https://mapbuildr.com/assets/img/markers/default.png']
       ];
       for (i = 0; i < locations.length; i++) {
if (locations[i][1] =='undefined'){ description ='';} else { description = locations[i][1];}
if (locations[i][2] =='undefined'){ telephone ='';} else { telephone = locations[i][2];}
if (locations[i][3] =='undefined'){ email ='';} else { email = locations[i][3];}
          if (locations[i][4] =='undefined'){ web ='';} else { web = locations[i][4];}
          if (locations[i][7] =='undefined'){ markericon ='';} else { markericon = locations[i][7];}
           marker = new google.maps.Marker({
               icon: markericon,
               position: new google.maps.LatLng(locations[i][5], locations[i][6]),
               map: map,
               title: locations[i][0],
               desc: description,
               tel: telephone,
               email: email,
               web: web
           });
link = '';     }

}
</script>
<style>
   #Manhattan {
       height:400px;
       width:550px;
   }
   .gm-style-iw * {
       display: block;
       width: 100%;
   }
   .gm-style-iw h4, .gm-style-iw p {
       margin: 0;
       padding: 0;
   }
   .gm-style-iw a {
       color: #4272db;
   }
</style>

<div id='Manhattan'></div>
Zitieren
#2
Hast Du Dir mal das Plugin Usermap angesehen? Vielleicht kommt das dem ja schon nahe, was Du brauchst....
viele Grüße
Jockl
übersetzte und eigene Plugins
Zitieren


Möglicherweise verwandte Themen...
Thema Verfasser Antworten Ansichten Letzter Beitrag
  XThreads - Custom Thread Fields "Maps" anzeigen frage7 3 600 20.10.2014, 10:52
Letzter Beitrag: MrBrechreiz
Lightbulb IP-Adresse verknüpfen mit utrace? happyspeedy 5 1.773 06.01.2013, 17:30
Letzter Beitrag: StefanT
  Benutzer von WordPress importieren und verknüpfen? Mr.Blade 0 822 01.05.2012, 14:27
Letzter Beitrag: Mr.Blade
  Google Maps API FL4PJ4CK 35 5.710 15.04.2009, 14:30
Letzter Beitrag: RebelAce
  Karte basierend auf Google Maps borsti67 11 3.486 30.05.2007, 23:00
Letzter Beitrag: Boardie05