开发者

Change Google map marker

How i change my marker in 开发者_StackOverflow社区google map.is possible to add our custome image to map?

Thanks, Companion


it is really simple - see http://code.google.com/intl/en-US/apis/maps/documentation/javascript/overlays.html#SimpleIcons

example straight from the google docs

var image = 'beachflag.png';
var myLatLng = new google.maps.LatLng(-33.890542, 151.274856);
var beachMarker = new google.maps.Marker({
  position: myLatLng,
  map: map,
  icon: image
});

if you want to do more complex stuff, you can also extend googles overlay classes and perform custom rendering ...


Here is a the way I use to use my own custom-designed markers in place of Google’s default markers.

Add this line of code:

 var icon = new GIcon();
      icon.image = "http://yourwebsite.com/logo.png";
      icon.shadow = "http://youwebsite.com/shadow.png";
      icon.iconSize = new GSize(50, 28);
      icon.shadowSize = new GSize(68, 28);
      icon.iconAnchor = new GPoint(37, 59);
      icon.infoWindowAnchor = new GPoint(31, 8);

Adjust the GSize for both iconSize and shadowSize if necessary. The first number in parentheses defines the width of your marker and the second number defines the height (both in pixels).

Now, add this line of code:

var marker = new GMarker(point, icon);

Just after this line:

function createMarker(point, name, address)

Hope that helps! You can see a blog post I wrote about this at http://icode4you.net/developing-a-custom-store-locator-map-using-your-own-custom-markers-instead-of-googles-default-markers, just leave a comment if you have any questions or problems.


Yes you most definitely can:

Try this

var map = new GMap2(document.getElementById("YOUR MAP ID"));

var icon = new GIcon();
icon.image = "IMAGE PATH - RELETIVE OR ABSOLUTE";
icon.iconSize = new GSize(25, 30);
icon.iconAnchor = new GPoint(6, 20);

var marker = new GMarker(new GLatLng(Latitude, Longitude), { draggable: false, title: YOURTITLEHERE, icon: icon });
map.addOverlay(marker);


From Google Map API V2, this could also be don easily with the object MarkerOptions:

map.addMarker(new MarkerOptions()
       .position(new LatLng( ...your_lat...  ,  ...your_long... ))
       .title( "marker title" )
       .icon( BitmapDescriptorFactory
           .fromResource( R.drawable.custom_icon )));

Hope this helps!


Or you can

marker.setIcon('http://maps.google.com/mapfiles/ms/icons/green-dot.png')

Or as part of marker init:

marker = new google.maps.Marker({
    icon: 'http://...'
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜