Добавление маркеров в Ext.Map в Sencha Touch

Question

Я пытаюсь создать приложение, которое отображает карту с вашим текущим маркером местоположения и несколькими маркерами, относящимися к данным с сервера, местоположение которого закрыто для вашего текущего местоположения. Пока что я могу отобразить карту, показать текущее местоположение и получить данные, связанные с этим местоположением. Проблема возникает, когда я пытаюсь добавить маркеры о местонахождении этих данных. Я прочитал много форумов и страниц, но не нашел решения. Я использую этот кусок кода для добавления маркеров (чтобы попытаться добавить их ..):

var marker = new google.maps.Marker({
                    map: map._map,
                    position: new google.maps.LatLng(bookletMarker[i].location[1],bookletMarker[i].location[0]),
                    title : bookletMarker[i].title,
                    draggable:false,
                    icon: "point.png"
                });

Answer 1

// Этот код отображает карту с 2 точками и отображает маршрут для перемещения из точки A в точку B

// При отображении карты

onMapMaprender: function(map, gmap, eOpts) {



    var record = Ext.getCmp('Panel').getData();
    var map = Ext.ComponentQuery.query('#LocationMap')[0].getMap();
    var polyline = new google.maps.Polyline();
    var markerImage = new google.maps.MarkerImage(
    'marker.png',
    new google.maps.Size(32, 31),
    new google.maps.Point(0, 0),
    new google.maps.Point(16, 31)
    );


    var lat = record.data.latitude;
    var lon = record.data.longitude;
    console.log(lat,lon);

    var destinationMarker = new google.maps.Marker({
        icon: markerImage,
        position: new google.maps.LatLng(lat,lon),
        title : 'destination',
        map: map,
    })
    var latSrc = localStorage.getItem('lat');
    var lonSrc = localStorage.getItem('lon');
    var sourceMarker = new google.maps.Marker({
        icon: markerImage,
        position: new google.maps.LatLng(latSrc,lonSrc),
        title : 'source',
        map: map,
    })


    function dir_callback(a,b){
        g=a;
        route_no=0;
        if(b=="OK"){
            var polyarr = a.routes[route_no].overview_path;
            polyline.setPath(polyarr);
            polyline.setMap(map);
        }
    }

    var dirS = new google.maps.DirectionsService();

    var req = {
        origin: sourceMarker.getPosition(),
        destination: destinationMarker.getPosition(),
        travelMode: google.maps.DirectionsTravelMode.DRIVING,
        provideRouteAlternatives : true
    };
    dirS.route(req,dir_callback);

},

// Настройка карты

var cr = new google.maps.LatLng (lat, lon);Ext.getCmp ( 'LocationMap') setMapCenter (кр).

Answer 2

Вы можете использовать map.getMap(), чтобы получить экземпляр карты Google и использовать его при создании маркеров.

Answer 3

Вы должны быть в состоянии получить экземпляр карты с вашей карты с помощью getMap (), а затем добавить указатель, как описано в документах API Google Maps:

marker.setMap(map);

Answer 4

Здесь вы непосредственно добавили путь к значку изображения, вместо этого используйте объект MarkerImage, как показано ниже,

var imageIcon = new google.maps.MarkerImage(
            "point.png",
            new google.maps.Size(32, 32),
            new google.maps.Point(0, 0),
            new google.maps.Point(16, 31)
        );

var marker = new google.maps.Marker({
                map: map._map,
                position: new google.maps.LatLng(bookletMarker[i].location[1],bookletMarker[i].location[0]),
                title : bookletMarker[i].title,
                draggable:false,
                icon: imageIcon 
            });