在地图上显示多个标记：Titanium

Question

我正在制作一个应用程序，其中我必须在我的应用程序中显示地图。 我能够显示地图，并能够使用Mapview上的注释添加标记。

问题是 1>我无法在地图上显示多个标记。

所以任何机构都可以帮助我如何在地图上添加多个标记。

感谢，

拉克什

Answer 1

这里是我使用的地图类。你可以在你的窗口中包含这个map.js文件，然后调用map.init并传入一个地图注释数组，以便添加地图的中心纬度/经度，顶部和底部位置以及可选的纬度/经度增量。如果要在地图创建完成后动态添加注释，则可以调用该类中的其他函数来执行此操作：

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

    } 

};