I have Integrated Google MAP API V2 for Android. I want to have a Custom Info Window at Onclick of My Marker. Up to that it is fine. i have integrate it.
What I want : I want to Show my Custom Info Window on Right Side of Marker Instead of Top of the Marker.
Below is the Code I am Using :
public class MainActivity extends FragmentActivity { private MainMapFragement mapFragment; private HashMap<Marker, EventInfo> eventMarkerMap; Marker ThirdMarker; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mapFragment = new MainMapFragement(); // FragmentTransaction ft = getFragmentManager().beginTransaction(); FragmentTransaction ft = getSupportFragmentManager().beginTransaction(); ft.add(R.id.map, mapFragment); ft.commit(); } @Override protected void onStart() { super.onStart(); setUpEventSpots(); } private void setUpEventSpots() { // I'm going to make 2 EventInfo objects and place them on the map EventInfo firstEventInfo = new EventInfo(new LatLng(50.154, 4.35), "Right now - event", new Date(), "Party"); EventInfo secondEventInfo = new EventInfo(new LatLng(51.25, 4.15), "Future Event", new Date(1032, 5, 25), "Convention"); EventInfo thirdEventInfo = new EventInfo(new LatLng(23.25, 72.15), "Our Next Event", new Date(), "Ahmedabad-India"); // this date constructor is deprecated but it's just to make a simple // example Marker firstMarker = mapFragment.placeMarker(firstEventInfo); Marker secondMarker = mapFragment.placeMarker(secondEventInfo); ThirdMarker = mapFragment.placeMarker(thirdEventInfo); eventMarkerMap = new HashMap<Marker, EventInfo>(); eventMarkerMap.put(firstMarker, firstEventInfo); eventMarkerMap.put(secondMarker, secondEventInfo); eventMarkerMap.put(ThirdMarker, thirdEventInfo); // add the onClickInfoWindowListener mapFragment.getMap().setOnInfoWindowClickListener( new OnInfoWindowClickListener() { @Override public void onInfoWindowClick(Marker marker) { EventInfo eventInfo = eventMarkerMap.get(marker); Toast.makeText( getBaseContext(), "The date of " + eventInfo.getName() + " is " + eventInfo.getSomeDate() .toLocaleString(), Toast.LENGTH_LONG).show(); } }); // Custom Bhavesh mapFragment.getMap().setInfoWindowAdapter(new InfoWindowAdapter() { private final View window = getLayoutInflater().inflate( R.layout.ballonoverlly, null); @Override public View getInfoWindow(Marker marker) { EventInfo eventInfo = eventMarkerMap.get(marker); String title = marker.getTitle(); TextView txtTitle = ((TextView) window .findViewById(R.id.textview_name)); if (title != null) { // Spannable string allows us to edit the formatting of the // text. SpannableString titleText = new SpannableString(title); titleText.setSpan(new ForegroundColorSpan(Color.RED), 0, titleText.length(), 0); txtTitle.setText(titleText); } else { txtTitle.setText(""); } // TextView txtType = ((TextView) window // .findViewById(R.id.textview_aboutme)); // if (eventInfo.getType() != null) // txtType.setText(eventInfo.getType()); return window; } @Override public View getInfoContents(Marker marker) { // this method is not called if getInfoWindow(Marker) does not // return null return null; } }); } }
xml file :
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/RlMain" android:layout_width="wrap_content" android:layout_height="wrap_content" > <LinearLayout android:id="@+id/imageview_comment" android:layout_width="150dp" android:layout_height="62dp" android:background="@drawable/map_comment_back" android:gravity="center_vertical" android:orientation="vertical" android:scaleType="fitXY" android:visibility="visible" > <TextView android:id="@+id/textview_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:layout_marginLeft="10dp" android:text="Bhavesh Patadiya" android:textColor="#FFFFFF" android:textStyle="bold" /> <TextView android:id="@+id/textview_aboutme" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:layout_marginLeft="10dp" android:maxLines="2" android:text="How's Going?" android:textColor="#FFFFFF" android:textStyle="normal" /> </LinearLayout> </LinearLayout>
Below is the Screen Shot of What I am getting :
Now , I want to have my custom InfoWindow to the Right Side of the Marker instead of Top.
All Helps are Appreciated.
Thanks in Advance.
You can modify the whole InfoWindow using jquery alone... var popup = new google. maps. InfoWindow({ content:'<p id="hook">Hello World!
An InfoWindow can be placed on a map at a particular position or above a marker, depending on what is specified in the options. Unless auto-pan is disabled, an InfoWindow will pan the map to make itself visible when it is opened. After constructing an InfoWindow, you must call open to display it on the map.
Call setPosition() on the info window, or. Attach the info window to a new marker using the InfoWindow. open() method. Note: If you call open() without passing a marker, the InfoWindow will use the position specified upon construction through the InfoWindowOptions object literal.
Edit 2:
Starting from September update (v12 or 3.2.65) of the Google Maps Android API v2 MarkerOptions.infoWindowAnchor was added. There are quite a few new functions, so check release notes too.
Edit 3:
Unfortunatelly this addition doesn't solve your problem yet. Added new issue for that.
This is not currently possible.
Trying to work around it by putting a View
over MapFragment
can be a good solution if users are not allowed to move the map. If they can, you will see some bad lags on repositioning when using either "push techonology" onCameraChange
or polling with Handler
and map.getCameraPosition()
.
Same problems if you try to use additional marker with transparent icon to show info window on when the visible is clicked, but it would be more fun to see it actually implemented.
If you can live without info window on the right for now, I would suggest starring this feature already requested and waiting.
Edit:
As of 3.1.36 (rev. 7) of the API v2 you can change the icon of marker. This means you can make two icons: one normal, and another that looks like you have an info window open on the right. Disabling opening default info window and using this instead might work for you.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With