Hey Nicole,
I changed the marker and I’m happy to show you how I did this. All it took was adding 1 line of code and copy/pasting a url to an external cat image.
Feel free to look through the comments in bold in the code below.
I still haven’t disabled the scroll click, but I will when I have more time.
Here’s the javascript code I edited to make it happen below:
// This example puts a marker at RAWR
// When the user clicks the kitty marker, an info window opens.
function initMap() {
// var kitty is the location of RAWR in longitude and latitude
var kitty = {lat: 37.806176, lng: -122.26724};
var map = new google.maps.Map(document.getElementById(‘map’), {
zoom: 15,
// center the map at RAWR
center: kitty
});
// This code is for the info that pops up when you click the kitty
var contentString = ‘<div id=”content”>’+
‘<div id=”siteNotice”>’+
‘</div>’+
‘<h1 id=”firstHeading” class=”firstHeading”>RAWR</h1>’+
‘<div id=”bodyContent”>’+
‘<p>located at 1721 1/2 Webster St ‘+
‘<br>Oakland, CA 94612 </p>’ +
‘</div>’+
‘</div>’;
var infowindow = new google.maps.InfoWindow({
content: contentString
});
// Put a marker where the kitty is
var marker = new google.maps.Marker({
position: kitty,
// Make the marker icon a cat image. You can replace the url below with any link to a png or gif (gif sadly doesn’t animate) for any image you want. It works best if the image is about 40 x 40 pixels wide.
icon: ‘http://www.animated-gifs.eu/category_animals/mammals-cats-15/0015.gif’,
map: map,
title: ‘RAWR’
});
// This is the thing that pops up the info marker when people click on the cat
marker.addListener(‘click’, function() {
infowindow.open(map, marker);
});
}