Sencha Touch의 Ext.Map에 마커를 추가합니다.

현재 위치 마커가있는 맵과 현재 위치에서 닫힌 서버의 데이터와 관련된 여러 마커를 표시하는 애플리케이션을 만들려고합니다. 지금까지지도를 렌더링하고 현재 위치를 표시하며이 위치와 관련된 데이터를 가져올 수 있습니다. 이 데이터의 위치에 대한 표시를 추가하려고하면 문제가 발생합니다. 많은 포럼과 페이지를 읽었지만 해결책을 찾지 못했습니다. 나는 (추가하려고 ..) 마커를 추가하는 코드의 조각을 사용Sencha Touch의 Ext.Map에 마커를 추가합니다.

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

출처

2011-11-24 Joe Medina

설명 된대로하여 getMap()을지도에서지도 인스턴스를 가져온 다음 포인터를 추가 할 수 있어야 구글지도 API 문서에서 :

marker.setMap(map);

출처

2012-03-26 11:41:15

당신은 구글 맵의 인스턴스를 얻을 당신이 마커를 만들 때 사용하는 map.getMap()를 사용할 수 있습니다. 이 코드는 A 지점에서 B 지점으로 여행을 2 점으로지도를 렌더링하고 경로를 표시합니다 //

출처

2012-09-04 03:03:41

을 다음과 같은을 MarkerImage 객체를 사용하여 어떻게 마커를 만들? – nalply

나는 똑같은 것을 궁금해하고 있었다. 내가 알아 차 렸던 것, maprender 이벤트는 시작되지 않습니다. 그리고 페인트 이벤트를 사용하면 아무것도 두 번째 인수로 전달되지 않습니다. 첫 번째 arg 만 DOM 요소로 채워집니다. 이게 효과 있니? – jaffa

//지도에 렌더링

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

출처

2013-12-06 06:43:38

여기

, 직접 추가 한 아이콘 이미지 경로 대신,

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

출처

2014-04-17 18:42:28

Sencha Touch의 Ext.Map에 마커를 추가합니다.

답변

관련 문제