Eigen logo bij google maps locatie

Pagina: 1
Acties:

Acties:
  • 0 Henk 'm!

  • CasGas
  • Registratie: November 1999
  • Laatst online: 23-07 15:44
Ik ben mij de hele middag al rot aan het zoeken hoe ik het volgende voor elkaar krijg.

Website heeft een embedded google maps erin zitten die door middel van een iframe in wordpress, zoiets als dit:

<iframe src="hele lang url van google" width="400" height="300" frameborder="0" style="border:0"></iframe>

Dan zie je mooi het bedrijf op de kaart met een marker erbij. Nu weet ik dat het mogelijk is dat je een plaatje als marker kan neerzetten, zodat het een en ander wat duidelijker is, bijvoorbeeld het logo van een bedrijf of een ander plaatje. Nu heb ik het ergens anders wel gevonden hoe men dat gedaan heeft, maar dat word anders geladen dan hoe ik dit doe:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 // Get the HTML DOM element that will contain your map 
                // We are using a div with id="map" seen below in the <body>
                var mapElement = document.getElementById('map');

                // Create the Google Map using our element and options defined above
                var map = new google.maps.Map(mapElement, mapOptions);

                // Let's also add a marker while we're at it
                var marker = new google.maps.Marker({
                    position: POSTITIE,
                    icon: 'hier de url van het plaatje',
                    animation: google.maps.Animation.DROP,
                    map: map,
                    title: 'de titel van de locatie'
                });
            }
        </script>


Is het uberhaubt mogelijk om zoiets te integreren? Ik gebruik zelf Visual Composer binnen wordpress om het wat duidelijker te krijgen voor mezelf, maar ergens in bestanden klooien heb ik geen moeite mee. Is dit iets wat toe te voegen is binnen zo'n iframe?

Sony A7III | Sony a6300 | Sony ZV-E1 | 12 2.0 | 21 1.4 | 24 1.4 | 35 2.8 | 50 1.4 | 135 1.8 | 16-28 2.8 | 16-70 4 | 28-75 2.8


Acties:
  • +1 Henk 'm!

  • HendrikN
  • Registratie: Februari 2007
  • Laatst online: 23-07 23:04
Wat je daar aan code ziet is de Google Maps Javascript API, deze API laad je in op je website, in plaats van een iframe. De documentatie vind je hier: https://developers.google...ation/javascript/tutorial

Daar zou je verder mee moeten komen!

PS: Deze tutorial komt volgens mij in de buurt van wat jij wilt: https://developers.google...cript/adding-a-google-map

[ Voor 22% gewijzigd door HendrikN op 09-10-2017 17:09 ]