2011-05-11 4 views
0

Je fais une application dans laquelle je dois montrer la carte dans mon application. Je suis capable de montrer la carte et d'ajouter des marqueurs en utilisant l'annotation sur Mapview. Le problème est 1> Je ne suis pas en mesure d'afficher plusieurs marqueurs sur la carte.Affichage de plusieurs marqueurs sur la carte: Titanium

Alors tout le monde peut m'aider comment je peux ajouter plusieurs marqueurs sur la carte.

Merci,

Rakesh

Répondre

2

Voici une classe carte que je l'utilise. Vous devez inclure ce fichier map.js dans votre fenêtre et appeler map.init et transmettre un tableau d'annotations de carte pour ajouter, le centre lat/long, les positions supérieure et inférieure de la carte, et éventuellement le lat/long delta. Si vous souhaitez ajouter dynamiquement des annotations après que la map a déjà été créée, vous pouvez appeler les autres fonctions de la classe pour le faire:

var path = Ti.Platform.name == 'android' ? Ti.Filesystem.resourcesDirectory : "../../"; 

var map = { 

    top: 0, 
    bottom: 0, 
    latitude: 0, 
    longitude: 0, 
    latitudeDelta: 0.1, 
    longitudeDelta: 0.1, 
    display: "map", 

    init: function (annotations, latitude, longitude, top, bottom, delta) { 

     if (top) 
      map.top = top; 
     if (bottom) 
      map.bottom = bottom; 
     if (delta) { 
      map.latitudeDelta = delta; 
      map.longitudeDelta = delta; 
     } 

     map.createMap(annotations, latitude, longitude); 
     map.createOptions(); 
     map.getLocation(); 

    }, 

    createMap: function (annotations, latitude, longitude) { 

     map.mapView = Ti.Map.createView({ 
      mapType: Ti.Map.STANDARD_TYPE, animate: true, regionFit: false, userLocation: true, 
      region: { latitude: latitude, longitude: longitude, latitudeDelta: map.latitudeDelta, longitudeDelta: map.longitudeDelta }, 
      annotations: annotations, bottom: map.bottom, top: map.top, borderWidth: 1 
     }); 
     if (!isAndroid) { 
      map.mapView.addAnnotation(annotations[0]); 
     } 
     map.mapView.selectAnnotation(annotations[0]); 
     win.add(map.mapView); 

    }, 

    createOptions: function() { 

     //map/satellite displays. 
     var mapDisplay = new ImageView({ image: path + 'images/map/satellite-view.png', width: 70, height: 49, zIndex: 2, top: map.top + 5, right: 5 }); 
     mapDisplay.addEventListener('click', function() { 
      if (map.display == "map") { 
       map.mapView.setMapType(Titanium.Map.SATELLITE_TYPE); 
       mapDisplay.image = path + "images/map/map-view.png"; 
       map.display = "satellite"; 
      } 
      else { 
       map.mapView.setMapType(Titanium.Map.STANDARD_TYPE); 
       mapDisplay.image = path + "images/map/satellite-view.png"; 
       map.display = "map"; 
      } 
     }); 
     win.add(mapDisplay); 

     //crosshairs. 
     if(Ti.Geolocation.locationServicesEnabled) { 
      var centerDisplay = new ImageView({ image: path + 'images/map/crosshairs.png', width: 49, height: 49, zIndex: 2, top: map.top + 5, right: 80 }); 
      centerDisplay.addEventListener('click', function() { 
       if(map.latitude != 0 && map.longitude != 0) { 
        info("setting user location to " + map.latitude + "/" + map.longitude); 
        //center map. 
        var userLocation = { 
         latitude: map.latitude, 
         longitude: map.longitude, 
         latitudeDelta: map.latitudeDelta, 
         longitudeDelta: map.longitudeDelta, 
         animate: true 
        }; 
        map.mapView.setLocation(userLocation); 
       } 
       else { 
        info("Can't get user location, lat and long is 0!"); 
       } 
      }); 
      win.add(centerDisplay); 
     } 

    }, 

    createAnnotation: function (title, subtitle, latitude, longitude, isLocation, addToMap) { 

     var mapAnnotation = Ti.Map.createAnnotation({ 
      latitude: latitude, longitude: longitude, 
      title: title, 
      subtitle: subtitle, 
      animate: true 
     }); 
     if (isAndroid) { 
      mapAnnotation.pinImage = path + (isLocation ? "images/map/blue-pin.png" : "images/map/purple-pin.png"); 
     } 
     else { 
      mapAnnotation.pincolor = isLocation ? Ti.Map.ANNOTATION_PURPLE : Ti.Map.ANNOTATION_RED; 
     } 

     if (addToMap) 
      map.mapView.addAnnotation(mapAnnotation); 

     return mapAnnotation; 

    }, 

    updateAnnotation: function (mapAnnotation, title, subtitle, latitude, longitude, isLocation) { 

     if (mapAnnotation) { 
      map.mapView.removeAnnotation(mapAnnotation); 
      mapAnnotation = map.createAnnotation(title, subtitle, latitude, longitude, isLocation); 
      map.mapView.addAnnotation(mapAnnotation); 
      map.mapView.selectAnnotation(mapAnnotation); 
     } 

    }, 

    addAnnotation: function (mapAnnotation) { 

     map.mapView.addAnnotation(mapAnnotation); 

    }, 

    removeAnnotation: function (mapAnnotation) { 

     map.mapView.removeAnnotation(mapAnnotation); 

    }, 

    selectAnnotation: function (mapAnnotation) { 

     map.mapView.selectAnnotation(mapAnnotation); 

    }, 

    createRoute: function (name, points) { 

     var route = { 
      name: name, points: points, color: "#7c74d4", width: 4 
     }; 
     map.mapView.addRoute(route); 
     setTimeout(function() { map.mapView.regionFit = true; }, 700); 

    }, 

    getLocation: function() { 

     Ti.Geolocation.preferredProvider = Ti.Geolocation.PROVIDER_GPS; 
     Ti.Geolocation.purpose = "testing"; 
     Ti.Geolocation.accuracy = Ti.Geolocation.ACCURACY_BEST; 
     Ti.Geolocation.distanceFilter = 10; 

     if(!Ti.Geolocation.locationServicesEnabled) { 
      //alert('Your device has GPS turned off. Please turn it on.'); 
      return; 
     } 

     function updatePosition(e) { 
      if(!e.success || e.error) { 
       info("Unable to get your location - " + e.error); 
       return; 
      } 
      info(JSON.stringify(e.coords)); 
      map.latitude = e.coords.latitude; 
      map.longitude = e.coords.longitude; 
      Ti.Geolocation.removeEventListener('location', updatePosition); 
     }; 

     Ti.Geolocation.getCurrentPosition(updatePosition);  
     Ti.Geolocation.addEventListener('location', updatePosition); 

    } 

}; 
Questions connexes