Изменить координату на карте

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyD83DW4cuDAMp0Zf2GkEXGFqnBAewN5qko"></script> 
     <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> 
    </head> 
    <body> 
     <div id="map" style="width: 100%; height: 400px;"></div> 

     <script type="text/javascript"> 
      function init(locations){ 
      var element = document.getElementById("map"); 

      var mapTypeIds = []; 
      for(var type in google.maps.MapTypeId) { 
       mapTypeIds.push(google.maps.MapTypeId[type]); 
      } 
      mapTypeIds.push("OSM"); 

      var map = new google.maps.Map(element, { 
       center: new google.maps.LatLng(parseInt(locations[0].lat), parseInt(locations[0].lng)), 
           zoom: 6, 
       mapTypeId: "OSM", 
       mapTypeControlOptions: { 
       mapTypeIds: mapTypeIds 
       } 
      }); 

      var infoWindow = new google.maps.InfoWindow(), marker, i; 

      for (i = 0; i < locations.length; i++) { 
       marker = new google.maps.Marker({ 
       position: new google.maps.LatLng(locations[i].lat, locations[i].lng), 
       map: map, 
       draggable:true, 
       // title: locations[i].lat 
       // icon: image 
       }); 

       google.maps.event.addListener(marker, 'click', (function(marker, i) { 
       return function() { 
        infoWindow.setContent(locations[i].infowindow); 
        infoWindow.open(map, marker); 
       } 
       })(marker, i)); 

       var mapTypeIds = []; 
       for(var type in google.maps.MapTypeId) { 
        mapTypeIds.push(google.maps.MapTypeId[type]); 
       } 
       mapTypeIds.push("OSM"); 

       map.mapTypes.set("OSM", new google.maps.ImageMapType({ 
       getTileUrl: function(coord, zoom) { 
        return "http://tile.openstreetmap.org/" + zoom + "/" + coord.x + "/" + coord.y + ".png"; 
       }, 
       tileSize: new google.maps.Size(256, 256), 
       name: "OpenStreetMap", 
       maxZoom: 18 
       })); 
      } 
      } 
      // long 77.4028193 lat 23.2243851 
      var locations = [{"lat":"21.2243851","lng":"77.4028193","infowindow":" information1 "},{"lat":"17.433282","lng":"78.426762","infowindow":" information2 "}]; 
      var locations1 = [{"lat":"24.2243851","lng":"77.4028193","infowindow":" information1 "},{"lat":"17.434282","lng":"78.426762","infowindow":" information2 "}]; 


      window.onload = init(locations); 
      window.setInterval(function(){console.log("first fn");change(locations1);}, 3500); 
      window.setInterval(function(){console.log("second fn");change(locations);}, 1500); 
      function change(locations){ 
      console.log(locations); 

      var mapTypeIds = []; 
      for(var type in google.maps.MapTypeId) { 
       mapTypeIds.push(google.maps.MapTypeId[type]); 
      } 
      mapTypeIds.push("OSM"); 
      var map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 6, 
       center: {lat: parseInt(locations[0].lat), lng: parseInt(locations[0].lng)}, 
       mapTypeId: "OSM", 
       mapTypeControlOptions: { 
       mapTypeIds: mapTypeIds 
       } 
      }); 

      // var map = google.maps.Map(document.getElementById("map")); 
      var infoWindow = new google.maps.InfoWindow(), marker, i; 
      for (i = 0; i < locations.length; i++) { 

       var marker = new google.maps.Marker({ 
       position: new google.maps.LatLng(locations[i].lat, locations[i].lng), 
       }); 
       marker.setMap(map); 
       google.maps.event.addListener(marker, 'click', (function(marker, i) { 
       return function() { 
        infoWindow.setContent(locations[i].infowindow); 
        infoWindow.open(map, marker); 
       } 
       })(marker, i)); 
       var mapTypeIds = []; 
       for(var type in google.maps.MapTypeId) { 
       mapTypeIds.push(google.maps.MapTypeId[type]); 
       } 
       mapTypeIds.push("OSM"); 

       map.mapTypes.set("OSM", new google.maps.ImageMapType({ 
       getTileUrl: function(coord, zoom) { 
        return "http://tile.openstreetmap.org/" + zoom + "/" + coord.x + "/" + coord.y + ".png"; 
       }, 
       tileSize: new google.maps.Size(256, 256), 
       name: "OpenStreetMap", 
       maxZoom: 18 
       })); 
      } 
      } 

     </script> 
    </body> 
</html>

без перезагрузки/обновления маркеров googlemap для замены. Пробовал все способы, предоставляемые google-map api и другими блогами. ничто не помогает мне, в настоящее время выставляю здесь, надеясь, что кто-то поможет мне с этой частью.Изменить координату на карте

Я скопировал полный код здесь, чтобы он помог решить проблему, которую я пытаюсь решить.

источник

2016-06-23 KJ_kaka

вы должны положить АЯКС тег в вашем вопросе –

попытался с помощью AJAX, но это din't помочь мне –

У нас была аналогичная проблема с тем, что вы испытываете. Способ, которым мы его решали, состоял в том, чтобы пересчитать границы и повторно разместить карту каждый раз при добавлении нового местоположения. Поэтому в основном мы имеем функцию createMarker, которая имеет этот бит кода в конце:

const map_center = bounds.getCenter(); 
     resultsMap.setCenter(map_center); 
     resultsMap.panToBounds(bounds); 
     resultsMap.fitBounds(bounds);

Где bounds здесь ваши карты границы, которые могут быть найдены с помощью метода google.maps.LatLngBounds().

EDIT: Я вижу, что вы хотите сделать это, не обновляя карту, я не думаю, что сброс границ обновляет карту, но я мог ошибаться в этом.

источник

2016-06-23 18:46:35

Место на карте не проблема здесь. Если вы запустите код, вы поймете, что я пытаюсь изменить координату, с которой вся карта повторно загружается. который я не хочу .. Я просто хочу, чтобы карта заменила координаты широты и долготы без перезагрузки/обновления googlemap –

Если бы вы могли запустить мой код, вы заметите, что координаты на карте меняются, а карта перезагружается которого я не хочу. номер строки 80, который является var map = new google.maps.Map (document.getElementById ('map'), который перегружает карту. ** Я чувствую, что мне нужно изменить или изменить на строку номер 80 ** –

Здесь я делаю. Это правильно. Я изменил некоторые из вашего кода, чтобы убедиться, что это все, что вы пожелаете. Я думаю, вы просто пропустите некоторые детали. Если это то, что вы хотите, пожалуйста, дайте мне знать. PS: Много forloop в изменении функции -> не хороший example.XD

<script type="text/javascript"> 
var map; 
var markersArray=[];//put all markers into this 
     function init(locations){ 
     var element = document.getElementById("map"); 

     var mapTypeIds = []; 
     for(var type in google.maps.MapTypeId) { 
      mapTypeIds.push(google.maps.MapTypeId[type]); 
     } 
     mapTypeIds.push("OSM"); 

     map = new google.maps.Map(element, { 
      center: new google.maps.LatLng(parseInt(locations[0].lat), parseInt(locations[0].lng)), 
          zoom: 6, 
      mapTypeId: "OSM", 
      mapTypeControlOptions: { 
      mapTypeIds: mapTypeIds 
      } 
     }); 

     var infoWindow = new google.maps.InfoWindow(), marker, i; 

     for (i = 0; i < locations.length; i++) {    
      var mapTypeIds = []; 
      for(var type in google.maps.MapTypeId) { 
       mapTypeIds.push(google.maps.MapTypeId[type]); 
      } 
      mapTypeIds.push("OSM"); 

      map.mapTypes.set("OSM", new google.maps.ImageMapType({ 
      getTileUrl: function(coord, zoom) { 
       return "http://tile.openstreetmap.org/" + zoom + "/" + coord.x + "/" + coord.y + ".png"; 
      }, 
      tileSize: new google.maps.Size(256, 256), 
      name: "OpenStreetMap", 
      maxZoom: 18 
      })); 
     } 
     } 

     var locations = [{"lat":"21.2243851","lng":"77.4028193","infowindow":" information1 "},{"lat":"20.433282","lng":"78.426762","infowindow":" information2 "}]; 
     var locations1 = [{"lat":"24.2243851","lng":"77.4028193","infowindow":" information1 "},{"lat":"22.434282","lng":"78.426762","infowindow":" information2 "}]; 

     var counter=0; 
     window.onload = init(locations); 
     window.setInterval(function(){ 
     if(counter%2==0) 
     { 
     change(locations1); 
     } 
     else 
     { 
     change(locations); 
     } 
     counter++; 
    }, 2000); 


     function change(locations){ 

      for (i = 0; i < locations.length; i++) 
      { 
      if(markersArray[i]!=null) 
      { 
       markersArray[i].setMap(null); 
       if (i == locations.length - 1) { 
        markersArray = []; 
       } 
      } 
      } 

      for (i = 0; i < locations.length; i++) 
      {  
      var marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(locations[i].lat, locations[i].lng) }); 
      markersArray.push(marker);  

      } 
      for (i = 0; i < markersArray.length; i++) 
     { 
       markersArray[i].setMap(map); 
     } 

     } 

    </script>

источник

2016-06-24 02:04:54

спасибо за ответ. Если вы можете запустить мой код, вы увидите, что координаты на карте меняются, а ** карта перезагружается, и я не хочу **. номер строки 80, которая равна var map = new google .maps.Map (document.getElementById ('map') , который загружает карту. ** Я чувствую, что мне нужно изменить или изменить на строку номер 80 ** –

var map = new google.maps.Map (docum var map = new google.maps.Map (document.getElementById ('map') ent.getElementById ('map') -> Для чего? Вы воссоздаете карту, чтобы она очистила все и перезагрузила. хотите? Если вы просто хотите изменить координату, вам не нужно это делать. –

Чтобы получить элемент googlemap Dom, я trie так, что я чувствую, не так. Поиск этого ответа –

ответ

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