Stilli Harita Ekle

Platform seçin: Android iOS JavaScript

Bu eğiticide, Android cihazınıza özel stil özellikleri olan bir haritayı nasıl ekleyeceğiniz gösterilmektedir uygulamasını indirin. Eğitim, özel stile örnek olarak gece modu'nu kullanır.

Stil seçenekleriyle standart Google haritasının sunumunu özelleştirebilirsiniz. yollar, parklar, işletmeler, ve diğer önemli noktaları görebilirsiniz. Bu da ekip üyelerinizin haritanın belirli bileşenlerini yapabilir veya haritayı, işletmenizin tarzını tamamlayacak şekilde uygulamasını indirin.

Stil yalnızca normal harita türünde çalışır. Stil etkilemez iç mekan haritalarını kullanın.

Kodu alın

Google Haritalar Android API v2 Samples deposunu klonlama veya indirme oluşturabilirsiniz.

Geliştirme projenizi oluşturun

Android Studio'da eğitim projesini oluşturmak için aşağıdaki adımları uygulayın.

  1. Android Studio'yu indirin ve yükleyin.
  2. Android'e Google Play Hizmetleri paketini ekleyin Stüdyo'yu seçin.
  3. Google Haritalar Android API v2 Samples deposunu klonlama veya indirme bu işlemi yapmamış olmanız gerekir.

  4. Eğitim projesini içe aktarın:

    • Android Studio'da Dosya > Yeni > Projeyi İçe Aktarın.
    • Google Haritalar Android API v2 Sana Özel'i kaydettiğiniz konuma gidin depolanacağı tarihtir.
    • StyledMap projesini şu konumda bulun:
      PATH-TO-SAVED-REPO/android-samples/tutorials/StyledMap
    • Proje dizinini seçin ve OK (Tamam) seçeneğini tıklayın. Android Studio artık geliştirmenizi sağlar.

API anahtarı alın ve gerekli API'leri etkinleştirin

Bu eğiticiyi tamamlamak için, kullanım izni olan bir Google API anahtarı gerekir Google Haritalar SDK'sı.

Bir anahtar almak ve API'yi etkinleştirmek için aşağıdaki düğmeyi tıklayın.

Anahtar al

Daha fazla bilgi için API Anahtarı Alma kılavuzuna bakın.

API anahtarını uygulamanıza ekleyin

  1. Projenizin gradle.properties dosyasını düzenleyin.

  2. API anahtarınızı GOOGLE_MAPS_API_KEY özelliğinin değerine yapıştırın. Zaman uygulamanızı derlerseniz Gradle, API anahtarını uygulamanın Android cihazına kopyalar manifest'ini kullanabilirsiniz.

    GOOGLE_MAPS_API_KEY=PASTE-YOUR-API-KEY-HERE

Uygulamanızı derleyip çalıştırma

  1. Bilgisayarınıza bir Android cihaz bağlayın. Şunu izleyin: Android cihazınızda geliştirici seçeneklerini etkinleştirme talimatları açın ve sisteminizi cihazı algılayacak şekilde yapılandırın. (Alternatif olarak her bir arama terimi için Android Sanal Cihaz (AVD) Yöneticisi kullanarak sanal bir olanak tanır. Emülatör seçerken, emülatör olarak Google API'leri. Daha fazla bilgi için başlangıç kılavuzuna bakın.)
  2. Android Studio'da Çalıştır menü seçeneğini (veya oynat düğmesi simgesini) tıklayın. İstendiği şekilde bir cihaz seçin.

Android Studio, uygulamayı derlemek için Gradle'ı çağırır ve ardından uygulamayı cihaz üzerinde veya emülatörde. Koyu renk (gece modu) olan bir harita göreceksiniz stilini de değiştirebilirsiniz.

Sorun Giderme:

Kodu anlama

Eğiticinin bu bölümünde, çevrimiçi görüntülü reklam kampanyalarınızın StyledMap uygulaması, benzer bir uygulamayı nasıl oluşturacağınızı anlamanıza yardımcı olur.

JSON stili nesne içeren bir kaynak ekleyin

Geliştirme projenize stil beyanlarınızı içeren bir kaynak ekleyin JSON biçiminde dışa aktarabilirsiniz. Örneklerde gösterildiği gibi ham kaynak veya dize kullanabilirsiniz. bölümüne göz atın.

Ham kaynak

/res/raw/style_json.json öğesinde şunu içeren bir ham kaynak tanımlayın: gece modu stili için JSON stil beyanı:

Dize kaynağı

/res/values/style_strings.xml içinde bir dize kaynağı tanımlayın, içerir. Bu eğiticide style_json dize adı kullanılmaktadır. İçinde bu dosyada, tırnak işaretlerinden kurtulmak için ters eğik çizgi kullanmanız gerekir:

Haritanıza JSON stilinde bir nesne iletin

Haritanızın stilini belirlemek için GoogleMap.setMapStyle() numaralı telefonu arayarak Stilinizi içeren MapStyleOptions nesne bildirimleri JSON biçiminde dışa aktarılır.

Ham kaynak

Aşağıdaki kod örneğinde, projenizin ham kaynak içerdiği varsayılır style_json adlı:

// Copyright 2020 Google LLC
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//      http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

package com.example.styledmap;

import android.content.res.Resources;
import android.os.Bundle;
import android.util.Log;
import androidx.appcompat.app.AppCompatActivity;

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.LatLng;
import com.google.android.gms.maps.model.MapStyleOptions;

/**
 * A styled map using JSON styles from a raw resource.
 */
public class MapsActivityRaw extends AppCompatActivity
        implements OnMapReadyCallback {

    private static final String TAG = MapsActivityRaw.class.getSimpleName();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Retrieve the content view that renders the map.
        setContentView(R.layout.activity_maps_raw);

        // Get the SupportMapFragment and register for the callback
        // when the map is ready for use.
        SupportMapFragment mapFragment =
                (SupportMapFragment) getSupportFragmentManager()
                        .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    /**
     * Manipulates the map when it's available.
     * The API invokes this callback when the map is ready for use.
     */
    @Override
    public void onMapReady(GoogleMap googleMap) {

        try {
            // Customise the styling of the base map using a JSON object defined
            // in a raw resource file.
            boolean success = googleMap.setMapStyle(
                    MapStyleOptions.loadRawResourceStyle(
                            this, R.raw.style_json));

            if (!success) {
                Log.e(TAG, "Style parsing failed.");
            }
        } catch (Resources.NotFoundException e) {
            Log.e(TAG, "Can't find style. Error: ", e);
        }
        // Position the map's camera near Sydney, Australia.
        googleMap.moveCamera(CameraUpdateFactory.newLatLng(new LatLng(-34, 151)));
    }
}

Düzen (activity_maps_raw.xml) şuna benzer:

Dize kaynağı

Aşağıdaki kod örneğinde, projenizin bir dize kaynağı içerdiği varsayılır style_json adlı:

package com.example.styledmap;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;

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.LatLng;
import com.google.android.gms.maps.model.MapStyleOptions;

/**
 * A styled map using JSON styles from a string resource.
 */
public class MapsActivityString extends AppCompatActivity
        implements OnMapReadyCallback {

    private static final String TAG = MapsActivityString.class.getSimpleName();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Retrieve the content view that renders the map.
        setContentView(R.layout.activity_maps_string);

        // Get the SupportMapFragment and register for the callback
        // when the map is ready for use.
        SupportMapFragment mapFragment =
                (SupportMapFragment) getSupportFragmentManager()
                        .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    /**
     * Manipulates the map when it's available.
     * The API invokes this callback when the map is ready for use.
     */
    @Override
    public void onMapReady(GoogleMap googleMap) {

        // Customise the styling of the base map using a JSON object defined
        // in a string resource file. First create a MapStyleOptions object
        // from the JSON styles string, then pass this to the setMapStyle
        // method of the GoogleMap object.
        boolean success = googleMap.setMapStyle(new MapStyleOptions(getResources()
                .getString(R.string.style_json)));

        if (!success) {
            Log.e(TAG, "Style parsing failed.");
        }
        // Position the map's camera near Sydney, Australia.
        googleMap.moveCamera(CameraUpdateFactory.newLatLng(new LatLng(-34, 151)));
    }
}

Düzen (activity_maps_string.xml) şuna benzer:

JSON stili bildirimleri hakkında daha fazla bilgi

Stil özellikleri ayarlanmış haritalar, bir tarayıcıya renk ve diğer stil değişikliklerini uygulamak için harita:

  • Seçiciler, oluşturabileceğiniz coğrafi bileşenleri belirtir. stilini de değiştirebilirsiniz. Bunlar yollar, parklar, su kütleleri yanı sıra etiketleri de dahil. Seçiciler özellikler içerir ve öğeler, featureType ve elementType mülk.
  • Stilciler, kullanabileceğiniz renk ve görünürlük özellikleridir. eşleme öğelerine uygulanır. Görüntülenen rengi renk tonu, renk ve açıklık/gama değerlerinin birleşiminden oluşur.

Ayrıntılı açıklama için stil referansına JSON stil seçenekleri.

Haritalar Platformu Stil Sihirbazı

Oluştur Google Haritalar Platformu API'leri için özel stiller

Aşağıdakileri oluşturmak için hızlı bir yol olarak Haritalar Platformu Stil Sihirbazı'nı kullanın: JSON stil nesnesi. Android için Haritalar SDK'sı aynı stili destekler Maps JavaScript API olarak bildirin.

Sonraki adım

Stil ile haritadaki özellikleri nasıl gizleyebileceğinizi öğrenin.