https://hondacars-saitamanaka.co.jp/wp-content/themes/saitamanaka/common/js/mapwide.js

1var ib = new InfoBox();
2var gMap;
3
4function initialize() {
5    var mapOptions = {
6        zoom: 13,
7        center: new google.maps.LatLng(gLat, gLng),
8        mapTypeId: google.maps.MapTypeId.ROADMAP,
9        scrollwheel: false,
10        styles: [{
11            featureType: 'all',
12            elementType: 'all',
13            stylers: [{
14                hue: '#000000' //16進数のRGB値を記載
15            }, {
16                saturation: -500 //-100〜100の値を記載
17            }, {
18                lightness: 0 //-100〜100の値を記載
19            }, {
20                gamma: 1 //0.01〜10.0の値を記載
21            }]
22        }]
23
24    };
25    gMap = new google.maps.Map(document.getElementById('js-gmap'), mapOptions);
26    google.maps.event.addListener(gMap, "click", function () {
27        ib.close()
28    });
29    setMarkers(gMap, datas);
30    //var ctaLayer = new google.maps.KmlLayer({url: gKmlUrl });
31    //ctaLayer.setMap(gMap);
32    
33    infowindow = new google.maps.InfoWindow({
34        content: "loading..."
35    });
36    google.maps.event.addListenerOnce(gMap, 'idle', function(){
37    	gMap.setZoom(8);
38    });
39}
40function createMarker(data, map) {
41    var siteLatLng = new google.maps.LatLng(data['lat'], data['lng']);
42    var marker = new google.maps.Marker({
43        position: siteLatLng,
44        map: map,
45        //setMap: map,
46        html: data['content'],
47        icon: data['icon']
48    });
49    // Begin example code to get custom infobox
50    var myOptions = {
51        content: marker.html,
52        disableAutoPan: false,
53        maxWidth: 0,
54        pixelOffset: new google.maps.Size(45, -90),
55        zIndex: null,
56        boxClass: data['boxClass'],
57        boxStyle: {
58            width: "150px"
59        },
60        infoBoxClearance: new google.maps.Size(1, 1),
61        isHidden: false,
62        pane: "mapPane",
63        closeBoxURL: "",
64        arrowStyle: 2,
65        enableEventPropagation: false
66    };
67    // end example code for custom infobox
68    google.maps.event.addListener(marker, "click", function (e) {
69        ib.close();
70        ib.setOptions(myOptions);
71        ib.open(map, this);
72    });
73    return marker;
74}
75
76function setMarkers(map, markers) {
77    for (var i = 0; i < markers.length; i++) {
78        createMarker(markers[i], map);
79    }
80}
81google.maps.event.addDomListener(window, 'load', initialize);