2016-07-27 5 views
1

Я хочу сделать это, когда пользователь зарегистрируется на моем портале, они могут добавить маркер в карту (карты google). Кто-нибудь может мне помочь, как я могу это сделать?Добавить маркер в карты Google при регистрации пользователя


Edit:

код я использую:

<script> 
function initialize() { 

     /* Style of the map */ 
     var styles = [ 
     { 
      stylers: [ 
      { hue: "#00ffe6" }, 
      { saturation: -20 } 
      ] 
     },{ 
      featureType: "road", 
      elementType: "geometry", 
      stylers: [ 
      { lightness: 100 }, 
      { visibility: "simplified" } 
      ] 
     },{ 
      featureType: "road", 
      elementType: "labels", 
      stylers: [ 
      { visibility: "off" } 
      ] 
     },{ 
      featureType: "poi", 
      elementType: "labels", 
      stylers: [ 
       { visibility: "off" } 
      ] 
      } 

     ]; 


     // Create a new StyledMapType object, passing it the array of styles, 
     // as well as the name to be displayed on the map type control. 
     var styledMap = new google.maps.StyledMapType(styles, {name: "Semini"}); 

     /* Lat. and Lon. of the center of the map */ 

     var myCenter = new google.maps.LatLng(45.8330653, 9.8506751,11); 

     // Create a map object, and include the MapTypeId to add 
     // to the map type control. 
     var mq = window.matchMedia("(max-width: 720px)"); 

    if (mq.matches){ 
var mapOptions = { 
     zoom: 9,    //zoom level 
     center: myCenter,  //center position 
     scrollwheel: false,  //zoom when scroll disable 
     zoomControl: true,  //show control zoom 

     mapTypeControlOptions: { 
      mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style'] 
     } 

     }; 

    } else { 
var mapOptions = { 
     zoom: 10,    //zoom level 
     center: myCenter,  //center position 
     scrollwheel: false,  //zoom when scroll disable 
     zoomControl: true,  //show control zoom 

     mapTypeControlOptions: { 
      mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style'] 
     } 

     }; 
}; 

var map = new google.maps.Map(document.getElementById('map-     canvas'),mapOptions); 

     //Associate the Semini with the MapTypeId and set it to display. 
     map.mapTypes.set('map_style', styledMap); 
     map.setMapTypeId('map_style'); 


    /* Marker example for stack */ 
     var contentString3 = 
      '<div class="popup">'+ 
      '<h2 id="example">City</h2>'+ 
         '<a href="/main.php?page=city">'+ 
      'VISIT</a> '+ 
      '</div>'; 

     var infowindow3 = new google.maps.InfoWindow({ 
      content: contentString3, 
      maxWidth: 230, 
      maxHeight: 300, 

     }); 

     var image1 = 'mappa/food.png'; 
     var myLatLng3 = new google.maps.LatLng(45.87901, 10.17745); 
     var marker3 = new google.maps.Marker({ 
      position: myLatLng3, 
      map: map, 
      icon: image1 
     }); 

     google.maps.event.addListener(marker3, 'click', function() { 
     infowindow3.open(map,marker3); 
     }); 




     /* open popup marker when map is load */ 
     new google.maps.event.trigger(marker, 'click');   

    } 

google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 

в этом сценарии я добавить статические маркер нормально? Но как может пользователь портала при регистрации добавить маркер в этот код? так и латы долго маркер По XXX

так: https://www.sofasurfer.org/blog/2011/06/27/dynamic-google-map-markers-via-simple-json-file/

+0

Используйте эту ссылку для справки https://developers.google.com/maps/documentation/javascript/examples/marker-simple –

+0

@KiranMuralee я есть карты, но я не знаю, как может пользователь добавить динамический маркер – Mill

+0

Я дал ответ на ваш вопрос, дайте мне знать, если это именно то, что вы пытаетесь сделать. –

ответ

0

Для того, чтобы использовать маркер в GMAP, вы должны сначала получить координаты места, где вы хотите поставить marker.Make уверены, что ваша карта является глобальным, так что вы можете ссылаться на него позже для динамического добавления другого маркера.

Простой пример использования маркера на карте приведен ниже.

//specify your Html element Id value here where you want to show the map 
var mapPosition=document.getElementById('myMap'); 

//Make sure map is global so that another marker can be added to the map later 
map = new google.maps.Map(mapPosition, { 
     zoom: 4, 
     center: myPosition 
    }); 

// specify your coordinates 
var myPosition={lat: -25.363, lng: 131.044}; 

var markerOptions={position: myPosition, map: map, title: 'some text'}; 

// putting a marker in the specified position in the map 
var marker = new google.maps.Marker(markerOptions); 

Если вы хотите добавить еще один маркер, динамически скажите по нажатию кнопки. Вы можете сделать это следующим образом.

//assuming this function gets called on some button click 
function onButtonClick() 
{ 
    //create your maker here 
    var anotherPosition={lat: -29.363, lng: 150.044}; 
    var newMarkerOptions={position: anotherPosition, map: map, title: 'some text'}; 
    var newMarker = new google.maps.Marker(newMarkerOptions); 
} 
+0

в функции onbottunclick lat и lng является статичным, как пользователь может выбирать на карте или с адресом lat и long? – Mill

+0

Извините, я не получаю вас –

+0

dat my english ^^ попробуйте с gtraslate: когда пользователь регистрируется, я бы хотел, чтобы вы могли выбрать, где разместить маркер на карте. например: Если компания «X» Выберите город Нью-Йорк, появится в качестве маркера на карте в Нью-Йорке с его именем – Mill

 Смежные вопросы

  • Нет связанных вопросов^_^