[Android] Google Map ズームとアイコン画像貼り付け

Google Mapに標準のマーカーとは別のアイコンを使うとか、あるいはズームでマップ表示させるにはどうするかやってみました。

Android Studio
2021.2.1

Google Maps Activity

project の新規作成にて Google Maps Activity を選択することで、すぐにmapを表示できるコードが生成されKeyを入れればすぐにできます。Google Mapプロジェクトの作成はこちらを参考にしてください。

x13.4 gmap 00 100x100 - [Android] Google Map ズームとアイコン画像貼り付け

Google Mapアプリを作る場合には、プロジェクトの新規作成でMAPアプリを選択すると簡単に出来上がります。

作成したプロジェクトに、OnMapReadyCallbackに緯度経度を入れれば、そのロケーションをマーカーを付けて表示できます。

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

        // Add a marker in Sydney and move the camera
        LatLng sydney = new LatLng(-34, 151);
        mMap.addMarker(new MarkerOptions().position(sydney).title("Marker in Sydney"));
        mMap.moveCamera(CameraUpdateFactory.newLatLng(sydney));
    }

@Override

public void onMapReady(GoogleMap googleMap) {

mMap = googleMap;

// Add a marker in Sydney and move the camera

LatLng sydney = new LatLng(-34, 151);

mMap.addMarker(new MarkerOptions().position(sydney).title("Marker in Sydney"));

mMap.moveCamera(CameraUpdateFactory.newLatLng(sydney));

}

シドニーにマークされたマップが表示されますが、皇居付近に緯度経度を変えて、更にズームアップしてみます。

また標準のマーカーをアイコン画像に変更するとこうなります。
マーカーアイコンはbitmapの画像を作ってdrawableに入れておきます。

MapsActivity.java

//package your.package.name;

import androidx.fragment.app.FragmentActivity;
import android.os.Bundle;
import com.google.android.gms.maps.CameraUpdateFactory;
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.BitmapDescriptor;
import com.google.android.gms.maps.model.BitmapDescriptorFactory;
import com.google.android.gms.maps.model.GroundOverlay;
import com.google.android.gms.maps.model.GroundOverlayOptions;
import com.google.android.gms.maps.model.LatLng;
import com.google.android.gms.maps.model.LatLngBounds;
import com.google.android.gms.maps.model.MarkerOptions;
import com.example.testgooglemapzoom.databinding.ActivityMapsBinding;

public class MapsActivity extends FragmentActivity implements OnMapReadyCallback {

    private GoogleMap mMap;
    private ActivityMapsBinding binding;
    private LatLng latlng;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        binding = ActivityMapsBinding.inflate(getLayoutInflater());
        setContentView(binding.getRoot());

        // 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);
    }

    /**
     * Manipulates the map once available.
     * This callback is triggered when the map is ready to be used.
     * This is where we can add markers or lines, add listeners or move the camera. In this case,
     * we just add a marker near Sydney, Australia.
     * If Google Play services is not installed on the device, the user will be prompted to install
     * it inside the SupportMapFragment. This method will only be triggered once the user has
     * installed Google Play services and returned to the app.
     */
    @Override
    public void onMapReady(GoogleMap googleMap) {
        mMap = googleMap;

        // 皇居近辺の緯度経度
        double latitude = 35.68;
        double longitude = 139.76;

        latlng = new LatLng(latitude, longitude);

        // 標準のマーカー
        //setMarker(latitude, longitude);

        // アイコン画像をマーカーに設定
        setIcon(latitude, longitude);
    }

    private void setMarker(double latitude, double longitude){

        MarkerOptions markerOptions = new MarkerOptions();
        markerOptions.position(latlng);
        markerOptions.title("Marker");
        mMap.addMarker(markerOptions);

        // ズーム
        zoomMap(latitude, longitude);

    }

    private void setIcon(double latitude, double longitude){

        // マップに貼り付ける BitmapDescriptor生成
        // 画像は自分で適当に用意します。ここではmipmapから持ってきましたが
        BitmapDescriptor descriptor =
                BitmapDescriptorFactory.fromResource(R.drawable.droid_round);

        // 貼り付設定
        GroundOverlayOptions overlayOptions = new GroundOverlayOptions();
        overlayOptions.image(descriptor);

        //　public GroundOverlayOptions anchor (float u, float v)
        // (0,0):top-left, (0,1):bottom-left, (1,0):top-right, (1,1):bottom-right
        overlayOptions.anchor(0.5f, 0.5f);

        // 張り付け画像の大きさ メートル単位
        // public GroundOverlayOptions	position(LatLng location, float width, float height)
        overlayOptions.position(latlng, 300f, 300f);

        // マップに貼り付け・アルファを設定
        GroundOverlay overlay = mMap.addGroundOverlay(overlayOptions);
        // ズーム
        zoomMap(latitude, longitude);

        // 透明度
        assert overlay != null;
        overlay.setTransparency(0.0F);
    }

    private void zoomMap(double latitude, double longitude){
        // 表示する東西南北の緯度経度を設定
        double south = latitude * (1-0.00005);
        double west = longitude * (1-0.00005);
        double north = latitude * (1+0.00005);
        double east = longitude * (1+0.00005);

        // LatLngBounds (LatLng southwest, LatLng northeast)
        LatLngBounds bounds = LatLngBounds.builder()
                .include(new LatLng(south , west))
                .include(new LatLng(north, east))
                .build();

        int width = getResources().getDisplayMetrics().widthPixels;
        int height = getResources().getDisplayMetrics().heightPixels;

        // static CameraUpdate.newLatLngBounds(LatLngBounds bounds, int width, int height, int padding)
        mMap.moveCamera(CameraUpdateFactory.
                newLatLngBounds(bounds, width, height, 0));

    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

//package your.package.name;

import androidx.fragment.app.FragmentActivity;

import android.os.Bundle;

import com.google.android.gms.maps.CameraUpdateFactory;

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.BitmapDescriptor;

import com.google.android.gms.maps.model.BitmapDescriptorFactory;

import com.google.android.gms.maps.model.GroundOverlay;

import com.google.android.gms.maps.model.GroundOverlayOptions;

import com.google.android.gms.maps.model.LatLng;

import com.google.android.gms.maps.model.LatLngBounds;

import com.google.android.gms.maps.model.MarkerOptions;

import com.example.testgooglemapzoom.databinding.ActivityMapsBinding;

public class MapsActivity extends FragmentActivity implements OnMapReadyCallback {

private GoogleMap mMap;

private ActivityMapsBinding binding;

private LatLng latlng;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

binding = ActivityMapsBinding.inflate(getLayoutInflater());

setContentView(binding.getRoot());

// 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);

}

/**

* Manipulates the map once available.

* This callback is triggered when the map is ready to be used.

* This is where we can add markers or lines, add listeners or move the camera. In this case,

* we just add a marker near Sydney, Australia.

* If Google Play services is not installed on the device, the user will be prompted to install

* it inside the SupportMapFragment. This method will only be triggered once the user has

* installed Google Play services and returned to the app.

@Override

public void onMapReady(GoogleMap googleMap) {

mMap = googleMap;

// 皇居近辺の緯度経度

double latitude = 35.68;

double longitude = 139.76;

latlng = new LatLng(latitude, longitude);

// 標準のマーカー

//setMarker(latitude, longitude);

// アイコン画像をマーカーに設定

setIcon(latitude, longitude);

}

private void setMarker(double latitude, double longitude){

MarkerOptions markerOptions = new MarkerOptions();

markerOptions.position(latlng);

markerOptions.title("Marker");

mMap.addMarker(markerOptions);

// ズーム

zoomMap(latitude, longitude);

}

private void setIcon(double latitude, double longitude){

// マップに貼り付ける BitmapDescriptor生成

// 画像は自分で適当に用意します。ここではmipmapから持ってきましたが

BitmapDescriptor descriptor =

BitmapDescriptorFactory.fromResource(R.drawable.droid_round);

// 貼り付設定

GroundOverlayOptions overlayOptions = new GroundOverlayOptions();

overlayOptions.image(descriptor);

//　public GroundOverlayOptions anchor (float u, float v)

// (0,0):top-left, (0,1):bottom-left, (1,0):top-right, (1,1):bottom-right

overlayOptions.anchor(0.5f, 0.5f);

// 張り付け画像の大きさメートル単位

// public GroundOverlayOptions position(LatLng location, float width, float height)

overlayOptions.position(latlng, 300f, 300f);

// マップに貼り付け・アルファを設定

GroundOverlay overlay = mMap.addGroundOverlay(overlayOptions);

// ズーム

zoomMap(latitude, longitude);

// 透明度

assert overlay != null;

overlay.setTransparency(0.0F);

}

private void zoomMap(double latitude, double longitude){

// 表示する東西南北の緯度経度を設定

double south = latitude * (1-0.00005);

double west = longitude * (1-0.00005);

double north = latitude * (1+0.00005);

double east = longitude * (1+0.00005);

// LatLngBounds (LatLng southwest, LatLng northeast)

LatLngBounds bounds = LatLngBounds.builder()

.include(new LatLng(south , west))

.include(new LatLng(north, east))

.build();

int width = getResources().getDisplayMetrics().widthPixels;

int height = getResources().getDisplayMetrics().heightPixels;

// static CameraUpdate.newLatLngBounds(LatLngBounds bounds, int width, int height, int padding)

mMap.moveCamera(CameraUpdateFactory.

newLatLngBounds(bounds, width, height, 0));

}

local.propertiesに記述

## This file is automatically generated by Android Studio.
...
sdk.dir=C\:\\Users\\akira\\AppData\\Local\\Android\\Sdk

MAPS_API_KEY=AIzaISyBC4N47_xxxxxxxxxxxxxxxxxxxHiRwU

## This file is automatically generated by Android Studio.

...

sdk.dir=C\:\\Users\\akira\\AppData\\Local\\Android\\Sdk

MAPS_API_KEY=AIzaISyBC4N47_xxxxxxxxxxxxxxxxxxxHiRwU

AndroidManifest.xml のYOUR_API_KEY を{MAPS_API_KEY}に置き換え

<meta-data
            android:name="com.google.android.geo.API_KEY"
            android:value="${MAPS_API_KEY}" />

<meta-data

android:name="com.google.android.geo.API_KEY"

android:value="${MAPS_API_KEY}" />

ズームさせマーカーをアイコンに変更すると

ズームとしてはnewLatLngZoomを使えます

mMap.moveCamera(CameraUpdateFactory.newLatLngZoom(latlng, 15f));

1	mMap.moveCamera(CameraUpdateFactory.newLatLngZoom(latlng, 15f));