Images tile on Google map in android

Question

I am developing an android application where I have place image tiles on Google map in android.

I can do with simple javascript but can anyone tell how I do this in android.Here is my JavaScript code.

function initialize() {
var center = new google.maps.LatLng(37.4419, -122.1419);
var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 3,
    center: center,
    mapTypeId: google.maps.MapTypeId.ROADMAP

});
var globalfoovar = new google.maps.ImageMapType({
    getTileUrl: function(tile, zoom) {
        return "http://demoserver.com";  
    },
    tileSize: new google.maps.Size(256, 256),
    opacity:0.60,
    isPng: true
});
map.overlayMapTypes.push(null); // create empty overlay entry
map.overlayMapTypes.setAt("0",globalfoovar); // set the overlay, 0 index

Can any translate the above to android Google map.

Thanks in android

Altaf

Answer 1

What you want cannot readily be "translated" "to android Google map". There is no support for alternate tile sources with the Google Maps SDK add-on.

You may wish to stick to the Web-based one (e.g., in a WebView).

Answer 2

It is now possible with the map api v2, here is an example that comes with the api :

private void setUpMap() {
    mMap.setMapType(GoogleMap.MAP_TYPE_NORMAL);

    TileProvider tileProvider = new UrlTileProvider(256, 256) {
        @Override
        public synchronized URL getTileUrl(int x, int y, int zoom) {
            // The moon tile coordinate system is reversed.  This is not normal.
            int reversedY = (1 << zoom) - y - 1;
            String s = String.format(Locale.US, "http://mw1.google.com/mw-planetary/lunar/lunarmaps_v1/clem_bw/%d/%d/%d.jpg", zoom, x, reversedY);
            URL url = null;
            try {
                url = new URL(s);
            } catch (MalformedURLException e) {
                throw new AssertionError(e);
            }
            return url;
        }
    };

    mMap.addTileOverlay(new TileOverlayOptions().tileProvider(tileProvider));
}

You'll find more info here: http://developer.android.com/reference/com/google/android/gms/maps/model/UrlTileProvider.html

and here : https://developers.google.com/maps/documentation/android/

Answer 3

MapsActivity.java

import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.OnMapReadyCallback;
import com.google.android.gms.maps.SupportMapFragment;
import com.google.android.gms.maps.model.TileOverlay;
import com.google.android.gms.maps.model.TileOverlayOptions;
import com.google.android.gms.maps.model.TileProvider;
import com.google.android.gms.maps.model.UrlTileProvider;

import android.os.Bundle;
import android.view.View;
import android.widget.CheckBox;
import android.widget.SeekBar;
import android.widget.SeekBar.OnSeekBarChangeListener;

import androidx.appcompat.app.AppCompatActivity;

import java.net.MalformedURLException;
import java.net.URL;
import java.util.Locale;


public class MapsActivity extends AppCompatActivity
        implements OnSeekBarChangeListener, OnMapReadyCallback {

    private static final int TRANSPARENCY_MAX = 100;

   
    private static final String MAP_URL_FORMAT =
          "https://maps.google.com/maps/vt?z=%d&x=%d&y=%d";


    private TileOverlay tileOverlay;
    private SeekBar transparencyBar;

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

        transparencyBar = (SeekBar) findViewById(R.id.transparencySeekBar);
        transparencyBar.setMax(TRANSPARENCY_MAX);
        transparencyBar.setProgress(0);

        SupportMapFragment mapFragment =
                (SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    @Override
    public void onMapReady(GoogleMap map) {
        map.setMapType(GoogleMap.MAP_TYPE_NONE);

        TileProvider tileProvider = new UrlTileProvider(256, 256) {
            @Override
            public synchronized URL getTileUrl(int x, int y, int zoom) {
           
                int reversedY = (1 << zoom) - y - 1;
                String s = String.format( Locale.US, MAP_URL_FORMAT,zoom,x,y);
                URL url = null;
                try {
                    url = new URL(s);
                } catch (MalformedURLException e) {
                    throw new AssertionError(e);
                }
                return url;
            }
        };

        tileOverlay = map.addTileOverlay(new TileOverlayOptions().tileProvider(tileProvider));
        transparencyBar.setOnSeekBarChangeListener(this);
    }

    public void setFadeIn(View v) {
        if (tileOverlay == null) {
            return;
        }
        tileOverlay.setFadeIn(((CheckBox) v).isChecked());
    }

    @Override
    public void onStopTrackingTouch(SeekBar seekBar) {
    }

    @Override
    public void onStartTrackingTouch(SeekBar seekBar) {
    }

    @Override
    public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
        if (tileOverlay != null) {
            tileOverlay.setTransparency((float) progress / (float) TRANSPARENCY_MAX);
        }
    }
}

main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/map_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <fragment
        android:id="@+id/map"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        class="com.google.android.gms.maps.SupportMapFragment" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:background="@color/white"
        android:orientation="vertical">

        <CheckBox
            android:id="@+id/fade_in_toggle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:checked="true"
            android:onClick="setFadeIn"
            android:text="@string/fade_in" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:text="@string/transparency"/>

        <SeekBar
            android:id="@+id/transparencySeekBar"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />

    </LinearLayout>
</RelativeLayout>