21

Sto usando Google Map API v2 nella mia applicazione per mostrare Maps.Come mostrare più marker su MapFragment in Google Maps API v2?

Ho seguito tutti i passaggi, da seguire per abilitare Google Map nella mia applicazione.

public class PinLocationOnMapView extends FragmentActivity { 

    private double mLatitude = 0.0, mLongitude = 0.0; 

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

     SupportMapFragment fragment = SupportMapFragment.newInstance(); 
     getSupportFragmentManager().beginTransaction() 
       .add(android.R.id.content, fragment).commit(); 
    } 
} 

Se io uso questo codice, che mi mostra la mappa, ma se fornisco i miei valori di latitudine/longitudine, mappa piastrelle non caricare, e vedo le piastrelle solo bianche.

seguito è riportato il codice scritto in onCreate() della classe di cui sopra:

if (getIntent().getExtras() != null) { 
      final Bundle bundle = getIntent().getBundleExtra("LOCATION"); 
      mLatitude = bundle.getDouble("LATITUDE"); 
      mLongitude = bundle.getDouble("LONGITUDE"); 
     } else { 
      finish(); 
     } 

     GoogleMapOptions options = new GoogleMapOptions(); 
     LatLng latLng = new LatLng(mLatitude, mLongitude); 
     CameraPosition cameraPosition;// = new CameraPosition(latLng, 0, 0, 0); 
     cameraPosition = CameraPosition.fromLatLngZoom(latLng, (float) 14.0); 

     options.mapType(GoogleMap.MAP_TYPE_SATELLITE).camera(cameraPosition) 
       .zoomControlsEnabled(true).zoomGesturesEnabled(true); 

     SupportMapFragment fragment = SupportMapFragment.newInstance(options); 
     getSupportFragmentManager().beginTransaction() 
       .add(android.R.id.content, fragment).commit(); 

Inoltre, ho un elenco di valori di lat/long. Voglio mostrarli su MapFragment, come mostrare più marcatori su MapFragment?

Ho provato con MapView e ItemizedOverlay, ma non ha funzionato per me. Credo di aver correttamente creato la chiave SHA1 per ottenere la chiave API, perché se ciò non fosse, non potrei vedere la mappa usando MapFragment, ma posso vedere che se non passo il valore di lat/log.

risposta

33

lo faccio come questo per mostrare le posizioni Car sulla mappa con i marcatori di diversi colori:

private void addMarkersToMap() { 
    mMap.clear(); 
    for (int i = 0; i < Cars.size(); i++) {   
      LatLng ll = new LatLng(Cars.get(i).getPos().getLat(), Cars.get(i).getPos().getLon()); 
      BitmapDescriptor bitmapMarker; 
      switch (Cars.get(i).getState()) { 
      case 0: 
       bitmapMarker = BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_RED); 
       Log.i(TAG, "RED"); 
       break; 
      case 1: 
       bitmapMarker = BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_GREEN); 
       Log.i(TAG, "GREEN"); 
       break; 
      case 2: 
       bitmapMarker = BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_ORANGE); 
       Log.i(TAG, "ORANGE"); 
       break; 
      default: 
       bitmapMarker = BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_RED); 
       Log.i(TAG, "DEFAULT"); 
       break; 
      }    
      mMarkers.add(mMap.addMarker(new MarkerOptions().position(ll).title(Cars.get(i).getName()) 
        .snippet(getStateString(Cars.get(i).getState())).icon(bitmapMarker))); 

      Log.i(TAG,"Car number "+i+" was added " +mMarkers.get(mMarkers.size()-1).getId()); 
     } 
    } 

} 

Cars è un ArrayList di oggetti personalizzati e mMarkers è un ArrayList di marcatori.

Nota: È possibile visualizzare la mappa in frammento come questo:

private GoogleMap mMap; 
.... 

private void setUpMapIfNeeded() { 
    // Do a null check to confirm that we have not already instantiated the 
    // map. 
    if (mMap == null) { 
     // Try to obtain the map from the SupportMapFragment. 
     mMap = ((SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.map)).getMap(); 
     // Check if we were successful in obtaining the map. 
     if (mMap != null) { 
      setUpMap(); 
     } 
    } 
} 




private void setUpMap() { 
    // Hide the zoom controls as the button panel will cover it. 
    mMap.getUiSettings().setZoomControlsEnabled(false); 

    // Add lots of markers to the map. 
    addMarkersToMap(); 

    // Setting an info window adapter allows us to change the both the 
    // contents and look of the 
    // info window. 
    mMap.setInfoWindowAdapter(new CustomInfoWindowAdapter()); 

    // Set listeners for marker events. See the bottom of this class for 
    // their behavior. 
    mMap.setOnMarkerClickListener(this); 
    mMap.setOnInfoWindowClickListener(this); 
    mMap.setOnMarkerDragListener(this); 

    // Pan to see all markers in view. 
    // Cannot zoom to bounds until the map has a size. 
    final View mapView = getSupportFragmentManager().findFragmentById(R.id.map).getView(); 
    if (mapView.getViewTreeObserver().isAlive()) { 
     mapView.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() { 
      @SuppressLint("NewApi") 
      // We check which build version we are using. 
      @Override 
      public void onGlobalLayout() { 
       LatLngBounds.Builder bld = new LatLngBounds.Builder(); 
    for (int i = 0; i < mAvailableCars.size(); i++) {   
      LatLng ll = new LatLng(Cars.get(i).getPos().getLat(), Cars.get(i).getPos().getLon()); 
      bld.include(ll);    
    } 
    LatLngBounds bounds = bld.build();   
    mMap.moveCamera(CameraUpdateFactory.newLatLngBounds(bounds, 70)); 
       mapView.getViewTreeObserver().removeGlobalOnLayoutListener(this); 

      } 
     }); 
    } 
} 

E basta chiamare setUpMapIfNeeded() in onCreate()

+0

Grazie slezadav! Ci proverò e ti farò sapere. :) – Shrikant

+0

come mostrare questo mMarkers su MapFragment? – Shrikant

+1

Modificata la mia risposta, quindi mostra come aggiungere l'intera mappa con i marcatori a MapFragment. Il metodo addMarkersToMap() è nel metodo setUpMap(). – slezadav

0

Prova questo codice che chiama a un file xml in voi directory principale del sito web -

Un modo per aggiungere marcatori è caricando un file xml che risiede nella directory principale (vedere il codice sottostante), che contiene l'indicatore html.

Il codice qui imposta lo spazio della mappa e una colonna della barra laterale per contenere la mappa e i collegamenti per i marcatori. Si noti che sia un tag div con un ID sia un ID td della barra laterale per gli elementi html e mappa.

È possibile impostare i marcatori, ma si noti la necessità di utilizzare caratteri speciali che devono essere codificati correttamente; per esempio la e commerciale (&) dovrebbe essere codificata come "&" + "amp" + ";" (senza virgolette). Lo stesso vale per caratteri maggiori e minori dei caratteri e così via. È una seccatura se hai diversi marcatori, ma una volta sul posto è facile da modificare in quanto non richiede l'assemblaggio o la codifica all'interno dell'app. Nello script che legge il file, l'uso del tag CDATA tecnicamente dovrebbe rendere superfluo l'uso della rappresentazione di caratteri speciali, ma per Gmaps API v2, li uso comunque. Per il mio esempio il nome del file xml è example3.xml.

È possibile formattare il xml in questo modo:

<Markers> 
<marker lat="47.881389" lng="-122.242222" 
html='&lt;div style="background-color:#FFFF88;font-family:Tahoma; font-size:12px;padding:6px; border:solid 1px black;"&gt;&lt;b&gt;SiteLines Park &#38; Playground Products&lt;/b&gt; &lt;br&gt;626 128th Street SW&lt;br&gt;Suite 104-A&lt;br&gt;Everett&#8218;&#160;WA 98204&lt;br&gt;Phone&#58; &#40;425&#41; 355-5655&lt;br&gt;&lt;b&gt;Toll&#160;Free&#58;&#160;&#40;800&#41;&#160;541-0869&lt;/b&gt;&lt;br&gt;Fax&#58;&#160;&#40;425&#41;&#160;347-3056&lt;br&gt;Email&#58;&#160;&lt;a href="mailto:[email protected]" target="blank"&gt;emailus&#64;sitelines.com&lt;/a&gt;&lt;br&gt;Web&#58;&#160;&lt;a href="http://www.sitelines.com" target="blank"&gt;www.sitelines.com&lt;/a&gt; &lt;/div&gt;'label="SiteLines Park &#38; Playground Products" /> 
</Markers> 

And for the html and script: 
<form style="background-color: #ffffff;" id="form1" runat="server"> 
<div style="text-align: center;"> 
<table style="border: 1px currentColor; vertical-align: middle;"> 
<tbody> 
<tr> 
<td style="background-color: #bbcae3; vertical-align: top;"> 
<div style="background-color: #e4e4e4; font-family: Tahoma; font-size: 12px; line-height: 22px; padding: 5px; text-decoration: underline; width: 210px; color: #000000; text-align: left;" id="side_bar"></div> 
</td> 
<td> 
<div style="height: 600px; width: 600px;" id="map"></div> 
</td> 
</tr> 
</tbody> 
</table> 
</div> 
</form> 
<script type="text/javascript" src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAyUoL7QQqyBn6qU653XJGLxSjEdRKL8ahnZ9z8zIKzjlyzNOP2RRCsKP_vlAEzWT8jzEKS0_9RrXOAg"></script> 
<script type="text/javascript">// <![CDATA[ 
if (GBrowserIsCompatible()) { 
     // this variable will collect the html which will eventualy be placed in the side_bar 
     var side_bar_html = ""; 

     // arrays to hold copies of the markers and html used by the side_bar 
     // because the function closure trick doesnt work there 
     var gmarkers = []; 
     var htmls = []; 
     var i = 0; 

     // A function to create the marker and set up the event window 
     function createMarker(point, name, html) { 
      var marker = new GMarker(point); 
      GEvent.addListener(marker, "click", function() { 
       marker.openInfoWindowHtml(html); 
      }); 

      // save the info we need to use later for the side_bar 
      gmarkers[i] = marker; 
      htmls[i] = html; 
      // add a line to the side_bar html 
      side_bar_html += '<a href="javascript:myclick(' + (gmarkers.length-1) + ')">' + name + '<\/a><br>'; 
      i++; 
      return marker; 
     } 

     // This function picks up the click and opens the corresponding info window 
     function myclick(i) { 
      gmarkers[i].openInfoWindowHtml(htmls[i]); 
     } 

     // create the map 
     var map = new GMap2(document.getElementById("map")); 
     map.addControl(new GLargeMapControl()); 
     map.addControl(new GMapTypeControl()); 
     map.setCenter(new GLatLng(0, 0), 0); 
     // 
     // ===== Start with an empty GLatLngBounds object ===== 
     var bounds = new GLatLngBounds(); 

     // Read the data from example3.xml 
     GDownloadUrl("/testStore/example3.xml", function(doc) { 
      var xmlDoc = GXml.parse(doc); 
      var markers = xmlDoc.documentElement.getElementsByTagName("marker"); 

      for (var i = 0; i < markers.length; i++) { 
       // obtain the attribues of each marker 
       var lat = parseFloat(markers[i].getAttribute("lat")); 
       var lng = parseFloat(markers[i].getAttribute("lng")); 
       var point = new GLatLng(lat, lng); 
       var html = markers[i].getAttribute("html"); 
       var label = markers[i].getAttribute("label"); 
       // create the marker 
       var marker = createMarker(point, label, html); 
       map.addOverlay(marker); 
      } 
      // put the assembled side_bar_html contents into the side_bar div 
      document.getElementById("side_bar").innerHTML = side_bar_html; 
     }); 
    } 

    else { 
     alert("Sorry, the Google Maps API is not compatible with this browser"); 
    } 
    // This Javascript is based on code provided by the 
    // Blackpool Community Church Javascript Team 
    // http://www.commchurch.freeserve.co.uk/ 
    // http://econym.googlepages.com/index.htm 

//]]>

2

non so forse u fissa il codice e ora è ok, ma nel onCreate()

il secondo mLatitude Penso che debba essere mLongitude proprio come si chiama nelle righe successive.

Scusate se sono in ritardo con la risposta ed è inutile.

+0

Beh, grazie..che era un errore di battitura .. :) – Shrikant

4

Per aggiungere più indicatori da mappare durante la conversione dell'indirizzo (ad esempio 123 Testing Street Lodi ca) su LatLng utilizzando geoCoder, il codice di esempio riportato di seguito funzionerà.

// convert address to lng lat and add markers to map 
public void addMarkersToMap() { 
    mMap.clear(); 
    Double[] latitude = new Double[addressArrayList.size()]; 
    Double[] longitude = new Double[addressArrayList.size()]; 
    String[] addrs = new String[addressArrayList.size()]; 
    addrs = addressArrayList.toArray(addrs); 
    List<Address> addressList; 
    if (addrs != null && addrs.length > 0) { 
     for (int i = 0; i < addrs.length; i++) { 
      try { 
       addressList = geoCoder.getFromLocationName(addrs[i], 1); 
       if (addressList == null || addressList.isEmpty() || addressList.equals("")) { 
        addressList = geoCoder.getFromLocationName("san francisco", 1); 
       } 
       latitude[i] = addressList.get(0).getLatitude(); 
       longitude[i] = addressList.get(0).getLongitude(); 
       System.out.println("latitude = " + latitude[i] + " longitude = " + longitude[i]); 
       mMap.addMarker(new MarkerOptions() 
          .position(new LatLng(latitude[i], longitude[i])) 
          .title(namesArrayList.get(i)) 
          .snippet(addressArrayList.get(i)) 
          .icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_AZURE)) 
          .alpha(0.7f) 
       ); 
      } catch (Exception e) { 
       e.printStackTrace(); 
      } // end catch 
     } 
    } 
} //end addMarkersToMap 
0

primo craete Metodo setupDestationLocation

public void setupDestationLocation(double longlat, double latitue, String title) { 
      LatLng Shop = new LatLng(longlat, latitue); 
    /* if (DestinationMarker != null) { 
     DestinationMarker.remove(); 
    }*/ 
    DestinationMarker = mMap.addMarker(new MarkerOptions() 
     .position(Shop) 
     .title(market_n) 
     .title(title) 
     .icon(BitmapDescriptorFactory.fromResource(R.mipmap.ic_marker_shop))); 
    CameraUpdate cameraUpdate = CameraUpdateFactory.newLatLngZoom(Shop, 14); 
    mMap.animateCamera(cameraUpdate); 

    } 

Ora basta chiamare in metodo metodo (onMapReady) all'interno

String title = "market"; 
    for(int i = 0 ; i < 8 ; i++) { 
     double offset = i/08d; 

     setupDestationLocation(longlat+offset,latitue,title+i); 
    }