Google Maps - Set an different image for a each marker using a drawable resource image

Question

I'm looking to set an different image for a each marker using a drawable resource image.

What I have is this.

public View getInfoContents(Marker marker) {
                        View v = getLayoutInflater().inflate(R.layout.windowlayout, null);
                        TextView tv1 = (TextView) v.findViewById(R.id.tv1);
                        TextView tv2 = (TextView) v.findViewById(R.id.tv2);
                        Button btn = (Button) findViewById(R.id.button);

                        LatLng pos = marker.getPosition();
                        tv1.setText(marker.getTitle());
                        tv2.setText(marker.getSnippet());   

                        ImageView image = ((ImageView) findViewById(R.id.image42));

                        return v;
                    }

This sets the image for a marker but I want it to be a different image for each marker.

I was thinking about an if/else statement like this..

public View getInfoContents(Marker marker) {
                        View v = getLayoutInflater().inflate(R.layout.windowlayout, null);
                        TextView tv1 = (TextView) v.findViewById(R.id.tv1);
                        TextView tv2 = (TextView) v.findViewById(R.id.tv2);
                        Button btn = (Button) findViewById(R.id.button);

                        LatLng pos = marker.getPosition();
                        tv1.setText(marker.getTitle());
                        tv2.setText(marker.getSnippet());   

                        ImageView image = ((ImageView) findViewById(R.id.image42));
                        if (marker == OldMellifontAbbey){
                            image= image.setBackground(BitmapDescriptorFactory.fromResource(R.drawable.oldmellifont));
                        }

                        else{


                        }
                        return v;
                    }
                });

Any suggestions are more then welcome. Thanks.

Okay so I think I'm on to something but I still can't figure it out. My edited code is below.

    @Override
                    public View getInfoContents(Marker marker) {
                        View v = getLayoutInflater().inflate(R.layout.windowlayout, null);
                        TextView tv1 = (TextView) v.findViewById(R.id.tv1);
                        TextView tv2 = (TextView) v.findViewById(R.id.tv2);
                        Button btn = (Button) findViewById(R.id.button);

                        LatLng pos = marker.getPosition();
                        tv1.setText(marker.getTitle());
                        tv2.setText(marker.getSnippet());   

                        ImageView image = ((ImageView) findViewById(R.id.image42));
                        try{
                            Drawable drawable = getResources().getDrawable(R.drawable.oldmellifont);


                            image.setBackground(drawable);



                        }
                        catch(Exception e){
                            Toast.makeText(getApplicationContext(), "Hairy ball sack!!!", Toast.LENGTH_LONG).show();
                        }
                        return v;
                    }
                });

set `Marker title` as per your text and check `if(marker.getTitle().equals("your text"))` then set particular image — M D, Feb 16 '15 at 12:54
Thanks man. Any suggestions on how to I set the image from the drawable resources? — Derek MC, Feb 16 '15 at 12:56
[http://stackoverflow.com/questions/8642823/using-setimagedrawable-dynamically-to-set-image-in-an-imageview](http://stackoverflow.com/questions/8642823/using-setimagedrawable-dynamically-to-set-image-in-an-imageview) — M D, Feb 16 '15 at 13:01
Thanks man but this either doesn't work or cause the map to close. — Derek MC, Feb 16 '15 at 13:32
In the line "ImageView image = ((ImageView) findViewById(R.id.image42))" I think you need to use "v.findViewById" for it to work. — dev.bmax, Feb 25 '15 at 10:28

score 1 · Answer 1 · answered Feb 25 '15 at 10:54

The getInfoContents method belongs to the InfoWindowAdapter, so I guess by saying "different image for a each marker" you really mean each InfoWindow. If this is the case then my suggestion is:

Each time you create and add a marker, you can call it's getId() method and use this unique id as the key in a HashMap<String, Drawable>or HashMap<String, Integer> (later to store the resource IDs). And then in your InfoWindowAdapter you would call marker.getId() again and map it to the right drawable.

And if you are trying to set the marker's own image, then you should use one of the BitmapDescriptorFactory's methods as in:

private Marker melbourne = mMap.addMarker(new MarkerOptions()
    .icon(BitmapDescriptorFactory.fromResource(R.drawable.arrow)));

AniV · Answer 2 · 2015-02-17T22:59:00.227

You have to use the BitmapDescriptor class in order to set image from the drawable resources as a marker.

Try this code:

@Override
protected void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    // Initialize the HashMap for Markers and MyMarker object
    mMarkersHashMap = new HashMap<Marker, MyMarker>();

    mMyMarkersArray.add(new MyMarker("Brasil", "icon1", Double.parseDouble("-28.5971788"), Double.parseDouble("-52.7309824")));
    mMyMarkersArray.add(new MyMarker("United States", "icon2", Double.parseDouble("33.7266622"), Double.parseDouble("-87.1469829")));
    mMyMarkersArray.add(new MyMarker("Canada", "icon3", Double.parseDouble("51.8917773"), Double.parseDouble("-86.0922954")));
    mMyMarkersArray.add(new MyMarker("England", "icon4", Double.parseDouble("52.4435047"), Double.parseDouble("-3.4199249")));
    mMyMarkersArray.add(new MyMarker("España", "icon5", Double.parseDouble("41.8728262"), Double.parseDouble("-0.2375882")));
    mMyMarkersArray.add(new MyMarker("Portugal", "icon6", Double.parseDouble("40.8316649"), Double.parseDouble("-4.936009")));
    mMyMarkersArray.add(new MyMarker("Deutschland", "icon7", Double.parseDouble("51.1642292"), Double.parseDouble("10.4541194")));
    mMyMarkersArray.add(new MyMarker("Atlantic Ocean", "icondefault", Double.parseDouble("-13.1294607"), Double.parseDouble("-19.9602353")));

    setUpMap();

    plotMarkers(mMyMarkersArray);
}

private void plotMarkers(ArrayList<MyMarker> markers)
{
    if(markers.size() > 0)
    {
        for (MyMarker myMarker : markers)
        {

            // Create user marker with custom icon and other options
            MarkerOptions markerOption = new MarkerOptions().position(new LatLng(myMarker.getmLatitude(), myMarker.getmLongitude()));
            markerOption.icon(BitmapDescriptorFactory.fromResource(R.drawable.currentlocation_icon));

            Marker currentMarker = mMap.addMarker(markerOption);
            mMarkersHashMap.put(currentMarker, myMarker);

            mMap.setInfoWindowAdapter(new MarkerInfoWindowAdapter());
        }
    }
}

private int manageMarkerIcon(String markerIcon)
{
    if (markerIcon.equals("icon1"))
        return R.drawable.icon1;
    else if(markerIcon.equals("icon2"))
        return R.drawable.icon2;
    else if(markerIcon.equals("icon3"))
        return R.drawable.icon3;
    else if(markerIcon.equals("icon4"))
        return R.drawable.icon4;
    else if(markerIcon.equals("icon5"))
        return R.drawable.icon5;
    else if(markerIcon.equals("icon6"))
        return R.drawable.icon6;
    else if(markerIcon.equals("icon7"))
        return R.drawable.icon7;
    else
        return R.drawable.icondefault;
}

private void setUpMap()
{
    // Do a null check to confirm that we have not already instantiated the map.
    if (mMap == null)
    {
        // Try to obtain the map from the SupportMapFragment.
        mMap = ((MapFragment) getFragmentManager().findFragmentById(R.id.map)).getMap();

        // Check if we were successful in obtaining the map.

        if (mMap != null)
        {
            mMap.setOnMarkerClickListener(new GoogleMap.OnMarkerClickListener()
            {
                @Override
                public boolean onMarkerClick(com.google.android.gms.maps.model.Marker marker)
                {
                    marker.showInfoWindow();
                    return true;
                }
            });
        }
        else
            Toast.makeText(getApplicationContext(), "Unable to create Maps", Toast.LENGTH_SHORT).show();
    }
}

public class MarkerInfoWindowAdapter implements GoogleMap.InfoWindowAdapter
{
    public MarkerInfoWindowAdapter()
    {
    }

    @Override
    public View getInfoWindow(Marker marker)
    {
        return null;
    }

    @Override
    public View getInfoContents(Marker marker)
    {
        View v  = getLayoutInflater().inflate(R.layout.infowindow_layout, null);

        MyMarker myMarker = mMarkersHashMap.get(marker);

        ImageView markerIcon = (ImageView) v.findViewById(R.id.marker_icon);

        TextView markerLabel = (TextView)v.findViewById(R.id.marker_label);

        markerIcon.setImageResource(manageMarkerIcon(myMarker.getmIcon()));

        markerLabel.setText(myMarker.getmLabel());

        return v;
    }
}

}

You never add BitmapDescriptor icon = BitmapDescriptorFactory.fromResource(R.drawable.oldmellifont) to ImageView image = ((ImageView) findViewById(R.id.image42)); — Derek MC, Feb 17 '15 at 22:35
I think I misinterpreted your question. Check out the edited answer! — AniV, Feb 17 '15 at 22:59
Thanks man. I'll try work with it tomorrow and let you now how I get on. :-) — Derek MC, Feb 17 '15 at 23:51
Sorry man this didn't work for me. I've offered a bounty of 50 rep points for the answer. — Derek MC, Feb 19 '15 at 20:58

score 0 · Answer 3 · answered Feb 24 '15 at 08:41

0

In your getInfoContents method, get Icon from marker:

public View getInfoContents(Marker marker) {

     ... ...

     ImageView image = ((ImageView) findViewById(R.id.image42));
     image.setImageDrawable(marker.getIcon()); 

     return v;
}

for each Marker you should have set specific icon for it. Then when you call:

marker.showInfoWindow();

each marker should show its own image/icon.

answered Feb 24 '15 at 08:41

Xcihnegn

11,579
10
33
33

Hi @Derek MC, have you try my solution? work or not? – Xcihnegn Feb 25 '15 at 12:24
@Derek MC If my solution wrong, please tell, if correct please tell, is that right? – Xcihnegn Feb 27 '15 at 07:50

score 0 · Answer 4 · answered Feb 24 '15 at 09:05

0

try this to set the image resource

image.setBackgroundResource(drawable);

answered Feb 24 '15 at 09:05

zeisuke

192
8

score 0 · Answer 5 · answered Feb 26 '15 at 17:45

It looks like you are trying to add change images in infowindow not change your marker icon. For this what you can do is while adding your marker create a Marker type reference, suppose create this reference as field of the class so that it can accessible to all the inner functions, for that marker create a corresponding Drawable refrence as

marker1 = myMap.addMarker(new MarkerOptions().position(yourLatLng1).icon(BitmapDescriptorFactory.fromResource(R.drawable.yourmarkericon)));
drawable1 = getResources().getDrawable(R.drawable.drawable1);

marker2 = myMap.addMarker(new MarkerOptions().position(yourLatLng2).icon(BitmapDescriptorFactory.fromResource(R.drawable.yourmarkericon)));
drawable2 = getResources().getDrawable(R.drawable.drawable2);
//and so on

Make sure that marker1 and drawable1 can be accessed by all required methods, so make them feilds of the class and on you getInfoContents method do like this

Override
                public View getInfoContents(Marker marker) {
                    View v = getLayoutInflater().inflate(R.layout.windowlayout, null);
                    TextView tv1 = (TextView) v.findViewById(R.id.tv1);
                    TextView tv2 = (TextView) v.findViewById(R.id.tv2);
                    Button btn = (Button) findViewById(R.id.button);

                    LatLng pos = marker.getPosition();
                    tv1.setText(marker.getTitle());
                    tv2.setText(marker.getSnippet());   

                    ImageView image = ((ImageView) findViewById(R.id.image42));
                    if(marker.equals(marker1){
                        image= image.setBackground(drawable1);
                    } else if((marker.equals(marker2)){
                        image= image.setBackground(drawable2);
                    } //and so on
                    return v;
                }
            });

Google Maps - Set an different image for a each marker using a drawable resource image

5 Answers5