简体   繁体   中英

Google Map now showing Marker is I add custom icon

My code is given below. It is working now but if I uncomment icon line ( //icon: ' http://108.163.162.202:8080/finex/img/map_marker.png '), all the marker and their title do not display.

I want to add my custom marker in my page and my code does not allowing me.

Please help.

 $(function() { var locations = [ ['Jersey City', 40.7178746, -74.0718356], ['Bronx', 40.8504989, -73.84934,5 ], ['Union City', 40.7667435, -74.0303289], ['Queens', 40.651018, -73.871192], ['Ridgefield', 40.8256436, -74.0153092] ]; var map = new google.maps.Map(document.getElementById('map'), { zoom: 11, center: new google.maps.LatLng(40.7590615, -73.969231), mapTypeId: google.maps.MapTypeId.ROADMAP, scrollwheel: false, mapTypeControl: false, scaleControl: false, navigationControl: true, draggable: false, zoomControlOptions: { style: google.maps.ZoomControlStyle.LARGE }, }); var infowindow = new google.maps.InfoWindow(); var marker, i; for (i = 0; i < locations.length; i++) { marker = new google.maps.Marker({ position: new google.maps.LatLng(locations[i][1], locations[i][2]), map: map, title: locations[i][0], //icon: 'http://108.163.162.202:8080/finex/img/map_marker.png', }); google.maps.event.addListener(marker, 'click', (function(marker, i) { return function() { infowindow.setContent(marker.title); infowindow.open(map, marker); } })(marker, i)); } }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> <div style="height:300px;width:500px;" id="map"></div> 

I did this in my project
<input type="hidden" value="http://108.163.162.202:8080" id="baseUrl" >
var baseUrl=$('#baseUrl').val(); 
 icon: new google.maps.MarkerImage( 
                    baseUrl+'images/marker-new.png',
                    null,
                    null,
                    // new google.maps.Point(0,0),
                    null,
                    new google.maps.Size(36, 36)
                ),

The image has limited access with .htaccess. I have to enter username and password. Perhaps this is the problem? ;) In addition you can leave the comma after the icon statement if nothing is following.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM