I recently started working with the Google Maps API and wanted to add a marker to a specific location. I went through the documentation and attempted to implement it on my website, but encountered several undefined errors in the process. Here is the code snippet:
function initMap() {
// Map styled for night mode.
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 32.0225572, lng: 34.7766291},
zoom: 17,
mapTypeId: 'roadmap',
styles: [
{elementType: 'geometry', stylers: [{color: '#242f3e'}]},
{elementType: 'labels.text.stroke', stylers: [{color: '#242f3e'}]},
{elementType: 'labels.text.fill', stylers: [{color: '#746855'}]},
// More styling elements...
]
});
var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
var icons = {
info: {
icon: iconBase + 'info-i_maps.png'
}
};
function addMarker(feature) {
var marker = new google.maps.Marker({
position: feature.position,
icon: icons[feature.type].icon,
map: map
});
}
var feature = [
{
position: new google.maps.LatLng(32.0225572, 34.7766291),
type: 'info'
}];
addMarker(feature);
}
// Additional marker information
var myLatLng = new google.maps.LatLng(32.0225572, 34.7766291);
var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: iconBase + 'שטיק-לוגו-07.png'
});
function addMarker(feature) {
var marker = new google.maps.Marker({
position: feature.position,
icon: icon,
map: map
});
}
var features = [
{
position: new google.maps.LatLng(32.0225572, 34.7766291),
type: 'info'
}
];
for (var i = 0, feature; feature = features[i]; i++) {
addMarker(feature);
}