質問編集履歴

JS指摘部分修正

2017/09/30 02:22

投稿

Tokiyo

スコア7

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -295,3 +295,169 @@
 どなたかお助け下さい。
 宜しくお願い致します。
+###JSコード追記部分
+```
+var mclick = [];
+(function($) {
+function new_map( $el ) {
+    var $markers = $el.find('.marker' ,'.marker_click');
+    var args = {
+        zoom        : 16,
+        center      : new google.maps.LatLng(0, 0),
+        mapTypeId   : google.maps.MapTypeId.ROADMAP
+    };
+    // create map
+    var map = new google.maps.Map( $el[0], args);
+    // add a markers reference
+    map.markers = [];
+    // add markers
+    $markers.each(function(){
+        mclick.push( add_marker( $(this), map ) );
+    });
+    // center map
+    center_map( map );
+    // return
+    return map;
+}
+function add_marker( $marker, map ) {
+    var latlng = new google.maps.LatLng( $marker.attr('data-lat'), $marker.attr('data-lng') );
+    // create marker
+    var marker = new google.maps.Marker ({
+        position    : latlng,
+        map         : map
+    });
+    // add to array
+    map.markers.push( marker );
+    // if marker contains HTML, add it to an infoWindow
+    if( $marker.html() )
+    {
+        // create info window
+        var infowindow = new google.maps.InfoWindow({
+            content     : $marker.html()
+        });
+        // show info window when marker is clicked
+        google.maps.event.addListener(marker, 'click', function() {
+            infowindow.open( map, marker );
+        });
+    }
+    return marker;
+}
+function center_map( map ) {
+    var bounds = new google.maps.LatLngBounds();
+    // loop through all markers and create bounds
+    $.each( map.markers, function( i, marker ){
+        var latlng = new google.maps.LatLng( marker.position.lat(), marker.position.lng() );
+        bounds.extend( latlng );
+    });
+    // only 1 marker?
+    if( map.markers.length == 1 )
+    {
+        // set center of map
+        map.setCenter( bounds.getCenter() );
+        map.setZoom( 16 );
+    }
+    else
+    {
+        // fit to bounds
+        map.fitBounds( bounds );
+    }
+}
+// global var
+var map = null;
+$(document).ready(function(){
+    $('.acf-map').each(function(){
+        // create map
+        map = new_map( $(this) );
+    });
+});
+})(jQuery);
+```