如何从谷歌地图信息框中删除边框？

Question

I have tried with several guides and stackoverflow questions to find out a solution for remove the extra space from info windows. My map looks like below. Help me to get rid of this. I just need to show the image with a small border on the map.

---

Here is the js for adding those info windows.

function addBasicInfoWindow(map, marker, contentStr) {
    var infoWindowOptions = {
            content: contentStr,
            pixelOffset: new google.maps.Size(0, 15),
            disableAutoPan: false,
            zIndex: 50,
        };
    try {
        basicInfowindow = new google.maps.InfoWindow(infoWindowOptions);
        basicInfowindow.open(map,marker);
    } catch (ex) {
        alert(ex);
    }
}

tried with closeBoxMargin: "10px 20px 2px 2px", closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif", but not working for me.

Thanks in advance.

Answer 1

Try the infobubble js here http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobubble/src/infobubble.js

Live demo : http://google-maps-utility-libraryv3.googlecode.com/svn/trunk/infobubble/examples/example.html

You can use

// Close button


var close = this.close_ = document.createElement('IMG');
  close.style['position'] = 'absolute';
  close.style['width'] = this.px(12);
  close.style['height'] = this.px(12);
  close.style['border'] = 0;
  close.style['zIndex'] = this.baseZIndex_ + 1;
  close.style['cursor'] = 'pointer';
  close.src = 'http://maps.gstatic.com/intl/en_us/mapfiles/iw_close.gif';

Answer 2

In InfoWindowAdapter change to

@Override
    public View getInfoWindow(Marker marker) {
        View view = ((Activity)context).getLayoutInflater()
                .inflate(R.layout.map_custom_infowindow, null);
        return view;
    }

    @Override
    public View getInfoContents(Marker marker) {

        return null;
    }