Google map with number markers from server

Question

I want to show multiple markers on Google map. I want to show marker as number in round area. As below image :

For adding multiple markers i have gone through :

Adding multiple markers in Google Maps API v2 Android

How to show multiple markers on MapFragment in Google Map API v2?

And I have achieved multiple markers by this code :

public class ComplaintsMapActivity extends FragmentActivity implements OnMapReadyCallback  {

    private GoogleMap mMap;
    private NetworkManager networkManager = null;
    private int reqIdComplaintList = -1;
    private ArrayList<ComplaintData> complaintList = new ArrayList<>();

    private static final int ZOOM_LEVEL = 15;
    private static final int TILT_LEVEL = 0;
    private static final int BEARING_LEVEL = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_complaints_map);
        // Obtain the SupportMapFragment and get notified when the map is ready to be used.
        SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
                .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);

        networkManager = NetworkManager.getInstance();

    }

    @Override
    public void onMapReady(GoogleMap googleMap) {
        mMap = googleMap;

        complaintList = (ArrayList<ComplaintData>)getIntent().getSerializableExtra("list");


        for (int i = 0; i < complaintList.size(); i++) {
            ComplaintData location = complaintList.get(i);
            LatLng position = new LatLng(Double.parseDouble(location.getLat()), Double.parseDouble(location.getLng()));
            mMap.addMarker(new MarkerOptions().position(position));
            
            if (i == 0) {
                CameraPosition camPos = new CameraPosition(position, ZOOM_LEVEL, TILT_LEVEL, BEARING_LEVEL);
                mMap.moveCamera(CameraUpdateFactory.newCameraPosition(camPos));
            }
        }

    }

}

And my result is :

I know how to set custom markers. But this data is dynamic any number of data will be there. So I want to ask if is there any way to generate this numbers by any loop something. because setting marker to each location i would need hundreds of markers which is not much preferable. So is there any option for this?

Note : I don't want clustering. I just want to show 1 on one marker, 2 on second marker, ... and 100 on hundred marker and so on.

Any help will be appreciated.

Thank you :)

But as per your first image description, it definitely implies clustering! — Sreehari, May 09 '18 at 06:55
@Sreehari Yes that's why i have clarified that i don't want clustering. It is just a reference image which i want to achieve — Annie, May 09 '18 at 06:59

Nikunj Peerbits · Accepted Answer · 2018-05-09T06:41:02.670

First You need to create a custom layout for you marker :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content">

<ImageView
   android:layout_width="@dimen/_35sdp"
   android:layout_height="@dimen/_45sdp"
   android:src="@drawable/ic_marker" />

<TextView
   android:id="@+id/num_txt"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_centerInParent="true"
   android:paddingBottom="@dimen/_10sdp"
   android:text="20"
   android:textColor="@color/white"
   android:textSize="@dimen/font_title"
   android:textStyle="bold" />

</RelativeLayout>

Your Image can be a drawable. You can take an imageview or a background to your textview. Both works

View marker = ((LayoutInflater) getActivity().getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout.custom_marker_layout, null);
   TextView numTxt = (TextView) marker.findViewById(R.id.num_txt);
Marker myMarker = googleMap.addMarker(new MarkerOptions().position(latLng).title(arrPostList.get(i).getRestaurant_name()).icon(BitmapDescriptorFactory.fromBitmap(Utils.createDrawableFromView(getActivity(), marker))));

Create Bitmap From Drawable method :

// Convert a view to bitmap
 public static Bitmap createDrawableFromView(Context context, View view) {
   DisplayMetrics displayMetrics = new DisplayMetrics();
   ((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
   view.setLayoutParams(new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT));
   view.measure(displayMetrics.widthPixels, displayMetrics.heightPixels);
   view.layout(0, 0, displayMetrics.widthPixels, displayMetrics.heightPixels);
   view.buildDrawingCache();
   Bitmap bitmap = Bitmap.createBitmap(view.getMeasuredWidth(), view.getMeasuredHeight(), Bitmap.Config.ARGB_8888);

   Canvas canvas = new Canvas(bitmap);
   view.draw(canvas);

   return bitmap;
}

Google map with number markers from server

1 Answers1