Itinéraire sur Google Maps

orangedevcenter 1,553 views 21 slides Apr 16, 2014
Slide 1
Slide 1 of 21
Slide 1
1
Slide 2
2
Slide 3
3
Slide 4
4
Slide 5
5
Slide 6
6
Slide 7
7
Slide 8
8
Slide 9
9
Slide 10
10
Slide 11
11
Slide 12
12
Slide 13
13
Slide 14
14
Slide 15
15
Slide 16
16
Slide 17
17
Slide 18
18
Slide 19
19
Slide 20
20
Slide 21
21

About This Presentation

Présentation élaborée par Mlle. Sarah Chrigui dans le cadre des sessions de Lightning Talks à l'Orange Developer Center.


Slide Content

Itinéraire sur Google Maps
Lightning Talks
Chrigui Sarah

2
Plan
Introduction
API Google Maps v2
Exemple
Conclusion
Lightning Talks: Itinéraire sur Google Maps

3
Introduction
Intégration des Maps dans la majorité des applications Mobiles.
Besoin de précision, de guidage.
Utilisation des APIs proposés par Google .
Lightning Talks: Itinéraire sur Google Maps

4
API Google Maps v2
L’API Google Maps v2 fournit des méthodes et des classes
permettant de créer :
La map
Des évènements sur la map
Les fonctions infowindow
Les polylignes
Les classes qu’on va utiliser sont :
LatLng // créer des points a partir de leur longitude et latitude
Marker // créer un point géographique sur une carte
PolylineOptions // créer un lien graphique entre deux points sur la
carte
Lightning Talks: Itinéraire sur Google Maps

5
Exemple
Etapes
1.Afficher la carte (Google Maps).
2.Ajouter des marqueurs.
3.Récupérer de l’itinéraire.
4.Ajouter l’itinéraire à la carte.
Lightning Talks: Itinéraire sur Google Maps

6
Exemple
Etape1: Afficher la carte (Google Maps).
Lightning Talks: Itinéraire sur Google Maps
Installer le package de Google Play Services

7
Exemple
Etape1: Afficher la carte (Google Maps).
Lightning Talks: Itinéraire sur Google Maps
Importer Google Play Services sous Eclipse

8
Exemple
Etape1: Afficher la carte (Google Maps).
Lightning Talks: Itinéraire sur Google Maps
Récupérer la clé Google Maps API

9
Exemple
Etape1: Afficher la carte (Google Maps).
Lightning Talks: Itinéraire sur Google Maps
Récupérer la clé Google Maps API

10
Exemple
Etape1: Afficher la carte (Google Maps).
Lightning Talks: Itinéraire sur Google Maps
Résultat Etape 1

11
Exemple
Etape 2: Ajouter des marqueurs
Lightning Talks: Itinéraire sur Google Maps
Il faut activer le GPS pour pouvoir déterminer votre
position et par la suite y mettre un marqueur
// Recuperer la map
private GoogleMap mMap=mMap = ((SupportMapFragment)
getSupportFragmentManager().findFragmentById(R.id.map)).getMap();
// Déterminer ma position
public void onLocationChanged(Location location) {
myLocation=location;
}
LatLng mapos=new LatLng(myLocation. latitude,myLocation. longitude);

12
Exemple
Etape 2: Ajouter des marqueurs
Lightning Talks: Itinéraire sur Google Maps
// Définir le marqueur de ma position et de la destination et l’ajouter à la carte
Marker m1;
m1 = mMap.addMarker(new MarkerOptions()
.position(mapos)
.title("Ma position")
.icon(BitmapDescriptorFactory.fromResource(R.drawable.ici)));
// Faire de même pour la destination
Marker m2;
m2 = mMap.addMarker(new MarkerOptions()
.position(destination) // destionation de type LatLng
.title(« Lake Club")
.icon(BitmapDescriptorFactory.fromResource(R.drawable.laba));

13
Exemple
Etape 2: Ajouter des marqueurs
Lightning Talks: Itinéraire sur Google Maps
Résultat Etape 2

14
Exemple
Etape 3: Récupérer l’itinéraire
Lightning Talks: Itinéraire sur Google Maps
// Voici l’url avec laquelle on peut récupérer la route entre deux points
http://maps.google.com/maps/api/directions/xml?origin=
latitude_point1,longitude_point1&destination=latitude_point2,
longitude_point2&sensor=true&mode=driving

15
Exemple
Etape 3: Récupérer l’itinéraire
Lightning Talks: Itinéraire sur Google Maps
// Résultat de l’url

16
Exemple
Etape 3: Récupérer l’itinéraire
Lightning Talks: Itinéraire sur Google Maps
// Dans notre activité :
// 1) On construit l’url
StringBuilder urlString = new StringBuilder();
urlString.append("http://maps.google.com/maps/api/directions/xml?origin=");
// Ajouter des long et lat de la source
urlString.append(myLocation.getLatitude());
urlString.append(",");
urlString.append(myLocation.getLongitude());
// Ajouter des long et lat de la destination
urlString.append("&destination=");
urlString.append(dest_lat);
urlString.append(",");
urlString.append(dest_long);
urlString.append("&sensor=true&mode=driving");
Log.d("url","::"+urlString.toString());

17
Exemple
Etape 3: Récupérer l’itinéraire
Lightning Talks: Itinéraire sur Google Maps
// 2) On établit la connexion
HttpURLConnection urlConnection= null;
URL url = null;
url = new URL(urlString.toString());
urlConnection=(HttpURLConnection)url.openConnection();
urlConnection.setRequestMethod("GET");
urlConnection.setDoOutput(true);
urlConnection.setDoInput(true);
urlConnection.connect();
DocumentBuilderFactory dbf = DocumentBuilderFactory.newInstance();
DocumentBuilder db = dbf.newDocumentBuilder();
// Recuperation du resultat dans "doc"
Document doc = (Document) db.parse(urlConnection.getInputStream());

18
Exemple
Etape 4: Ajouter l’ itinéraire
Lightning Talks: Itinéraire sur Google Maps
// Retourner tous les points LatLong sur la route du point 1 vers le point 2
NodeList _nodelist_path =
doc.getElementsByTagName("overview_polyline");
private ArrayList<LatLng> decodePoly(String encoded) {…}
List<LatLng> directionPoint = decodePoly(_path);
//_path : resultat de recuperation de données du nœud overview_polyline
// Definir la couleur
PolylineOptions rectLine = new PolylineOptions().width(3).color(Color.CYAN);
for (int i = 0; i < directionPoint.size(); i++)
{
rectLine.add(directionPoint.get(i));
}
// Ajouter la route à la map
mMap.addPolyline(rectLine);

19 Lightning Talks: Itinéraire sur Google Maps

20
Conclusion
Lightning Talks: Itinéraire sur Google Maps

Autres informations peuvent être récupérées via l’url présentée (distance,
estimation de temps,..)
Profiter des API disponibles (Google Earth API, Places API ,..)
Améliorer vos applications

Merci pour votre attention