Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.12.2019, 22:24
Новичок на форуме
Отправить личное сообщение для Tankonaft Посмотреть профиль Найти все сообщения от Tankonaft
 
Регистрация: 11.12.2019
Сообщений: 2

Переменные из json в скрипт Google Maps API
Доброго времени суток.
В сети нашел скрипт который ставит маркеры на карте, и есть сервер с которого нужно взять координаты и поставить эти значения.
Это из сети:
<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <style>
	#map {width:100%; height:600px;}
</style>
  </head>
  <body>
    

<div id="map"></div>

<script>
	function initMap() {
		var element = document.getElementById('map');
		var options = {
			zoom: 5,
			center: {lat: 55.7558, lng: 37.6173},
		};

		var myMap = new google.maps.Map(element, options);

		var markers = [
			{
				coordinates: {lat: 55.751956, lng: 37.622634},
				info: '<h3>Москва</h3><br><img src="https://placehold.it/200x150"><br><p>Описание</p>'
			},
			{
				coordinates: {lat: 59.940208, lng: 30.328092},
				info: '<h3>Санкт-Петербург</h3><br> <img src="https://placehold.it/200x150"><br><p>Описание</p>'
			},
			{
				coordinates: {lat: 50.449973, lng: 30.524911},
				
			}
		];

		for(var i = 0; i < markers.length; i++) {
			addMarker(markers[i]);
		}

		function addMarker(properties) {
			var marker = new google.maps.Marker({
				position: properties.coordinates,
				map: myMap
			});

			if(properties.image) {
				marker.setIcon(properties.image);
			}

			if(properties.info) {
				var InfoWindow = new google.maps.InfoWindow({
					content: properties.info
				});

				marker.addListener('click', function(){
					InfoWindow.open(myMap, marker);
				});
			}
		}
	}
</script>

<script async defer
	src="https://maps.googleapis.com/maps/api/js?key=API_KEY&callback=initMap">
</script>
  </body>
</html>

Это то что я пробовал:
<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <style>
	#map {width:100%; height:600px;}
</style>
<script type='text/javascript'>
var lat;
var lng;
function start(){  
   xhttp=new XMLHttpRequest();
   xhttp.open('GET','gps.json',true);
   xhttp.send();
   xhttp.onreadystatechange=function(){
      if (xhttp.readyState==4){
         //Принятое содержимое json файла должно быть вначале обработано функцией eval 
         var json=eval( '('+xhttp.responseText+')' );
         //Далее мы можем спокойно использовать данные
         lat_g=json.Latitude;
         lng_g=json.Longitude;
      }
   }
}
</script>
  </head>
  <body>
    

<div id="map"></div>

<script>
	function initMap() {
		var element = document.getElementById('map');
		var options = {
			zoom: 5,
			center: {lat: lat_g, lng: lng_g},
		};
		var myMap = new google.maps.Map(element, options);
		var markers = [
			{
				coordinates: {lat: lat_g, lng: lng_g},
				info: '<h3>Москва</h3><br><img src="https://placehold.it/200x150"><br><p>Описание</p>'
			},
		];
		for(var i = 0; i < markers.length; i++) {
			addMarker(markers[i]);
		}
		function addMarker(properties) {
			var marker = new google.maps.Marker({
				position: properties.coordinates,
				map: myMap
			});
			if(properties.image) {
				marker.setIcon(properties.image);
			}
			if(properties.info) {
				var InfoWindow = new google.maps.InfoWindow({
					content: properties.info
				});
				marker.addListener('click', function(){
					InfoWindow.open(myMap, marker);
				});
			}
		}
	}
</script>

<script async defer
	src="https://maps.googleapis.com/maps/api/js?key=API_KEY&callback=initMap">
</script>
  </body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 11.12.2019, 22:27
Новичок на форуме
Отправить личное сообщение для Tankonaft Посмотреть профиль Найти все сообщения от Tankonaft
 
Регистрация: 11.12.2019
Сообщений: 2

В JS не понимаю практически ничего.
Нужно еще чтобы json запрашивался каждую секунду или две.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Google maps markers удаление маркеров удаляет всю карту Ducol Events/DOM/Window 2 02.09.2016 12:06
Google Maps API включение и отключение labels birst Общие вопросы Javascript 4 21.12.2013 01:48
Google maps - проблема с подключением Иззет Общие вопросы Javascript 0 29.11.2013 17:14
google maps api поиск места freemanf Библиотеки/Тулкиты/Фреймворки 0 16.08.2013 15:42