Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Set Image from drawable as marker in Google Map version 2

I am using this part of code to add a marker in a MapFragment in Google Map Version 2.

MarkerOptions op = new MarkerOptions();
op.position(point)
    .title(Location_ArrayList.get(j).getCity_name())
    .snippet(Location_ArrayList.get(j).getVenue_name())
    .draggable(true);
m = map.addMarker(op); 
markers.add(m);

I want to use different images from my drawable.

like image 892
NRahman Avatar asked Aug 05 '13 07:08

NRahman


People also ask

How do I start a custom image on Google Maps marker for mobile app?

For adding a custom marker to Google Maps navigate to the app > res > drawable > Right-Click on it > New > Vector Assets and select the icon which we have to show on your Map. You can change the color according to our requirements. After creating this icon now we will move towards adding this marker to our Map.


4 Answers

This is how you can set a Drawable as a Marker.

BitmapDescriptor icon = BitmapDescriptorFactory.fromResource(R.drawable.current_position_tennis_ball)

MarkerOptions markerOptions = new MarkerOptions().position(latLng)
         .title("Current Location")
         .snippet("Thinking of finding some thing...")
         .icon(icon);

mMarker = googleMap.addMarker(markerOptions);

VectorDrawables and XML based Drawables do not work with this.

like image 73
Muhammad Babar Avatar answered Sep 20 '22 23:09

Muhammad Babar


@Lukas Novak answer is not showing anything because you also have to set the bounds on Drawable.
This works for any drawable. Here is a fully working example:

public void drawMarker() {
    Drawable circleDrawable = getResources().getDrawable(R.drawable.circle_shape);
    BitmapDescriptor markerIcon = getMarkerIconFromDrawable(circleDrawable);

    googleMap.addMarker(new MarkerOptions()
            .position(new LatLng(41.906991, 12.453360))
            .title("My Marker")
            .icon(markerIcon)
    );
}

private BitmapDescriptor getMarkerIconFromDrawable(Drawable drawable) {
    Canvas canvas = new Canvas();
    Bitmap bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
    canvas.setBitmap(bitmap);
    drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
    drawable.draw(canvas);
    return BitmapDescriptorFactory.fromBitmap(bitmap);
}


circle_shape.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
    <size android:width="20dp" android:height="20dp"/>
    <solid android:color="#ff00ff"/>
</shape>
like image 33
vovahost Avatar answered Sep 23 '22 23:09

vovahost


If you have Drawable created programatically (so you have no resource for it), you can use this:

Drawable d = ... // programatically create drawable
Canvas canvas = new Canvas();
Bitmap bitmap = Bitmap.createBitmap(d.getIntrinsicWidth(), d.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
canvas.setBitmap(bitmap);
d.draw(canvas);
BitmapDescriptor bd = BitmapDescriptorFactory.fromBitmap(bitmap);

Then you have BitmapDescriptor, which you can pass into MarkerOptions.

like image 10
Lukas Novak Avatar answered Sep 22 '22 23:09

Lukas Novak


If you are using vector drawable use this extension:

fun  Context.bitmapDescriptorFromVector(vectorResId:Int): BitmapDescriptor {
    val vectorDrawable = ContextCompat.getDrawable(this, vectorResId)
    vectorDrawable!!.setBounds(0, 0, vectorDrawable.intrinsicWidth, vectorDrawable.intrinsicHeight)
    val bitmap = Bitmap.createBitmap(vectorDrawable.intrinsicWidth, vectorDrawable.intrinsicHeight, Bitmap.Config.ARGB_8888)
    vectorDrawable.draw(Canvas(bitmap))
    return BitmapDescriptorFactory.fromBitmap(bitmap)
}

And set to the marker icon:

val markerOptions = MarkerOptions().position(latLng)
         .title("Current Location")
         .snippet("Thinking of finding some thing...")
         .icon(bitmapDescriptorFromVector("Your icon resource id"))// call extension here

mMarker = googleMap.addMarker(markerOptions)
like image 4
Krishna Sony Avatar answered Sep 24 '22 23:09

Krishna Sony