Форум

Seliarn · #1 (**permalink**) 31.01.2013, 20:10

Доброго времени суток!
Есть задание: сделать карту с поиском по адресам.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>1111</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

<script type="text/javascript">
 function initialize() {
    var center_map = new google.maps.LatLng(46.459856,30.731506);
    var myOptions = {
      zoom: 13,
      center: center_map,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
   var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var geocoder = new google.maps.Geocoder(); // геокодер
 }
function codeAddress(){
     var address = document.getElementById('adr').value;
     geocoder.geocode( { 'address':'Одесса,'+address}, function(results, status) {
         if (status == google.maps.GeocoderStatus.OK) {
             map.setCenter(results[0].geometry.location);
             var marker = new google.maps.Marker({ // маркер
                 position: results[0].geometry.location,
                 map: map
             });
         } else {  
            alert('Geocode was not successful for the following reason: ' + status); 
     });
 }
 </script>
 </head>
  <body onload="initialize()">
    <p>
        <input type="text" id="adr" value="Греческая 19" />
        <input type="button" value="Geocode" onclick="codeAddress()">
      </p>
      <div id="map_canvas" style="width: 800px; height: 600px"></div>
  </body>
</html>

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

geocoder.geocode( { 'address': 'Одесса,Греческая 19'}, function(results, status)

Так все работает, а вот почему не считывает я не понимаю, помогите, пожалуйста.

devote · #2 (**permalink**) 31.01.2013, 20:13

наверное потому что не закрыто условие:

} else {  
            alert('Geocode was not successful for the following reason: ' + status);

добавь скобку } ниже

Seliarn · #3 (**permalink**) 31.01.2013, 20:25

Нет, его я прямо в теме и добавил (и на всякий только что проверил со скобкой, все равно нет...)

Seliarn · #4 (**permalink**) 01.02.2013, 11:13

Спасибо devoteза ответ.
Проблема решилась, переменные во второй функции geocoder и map не доступны, т.к. созданы были в первой функции.

ultracomp · #5 (**permalink**) 22.06.2013, 16:41

Очень полезная вещь, вовремя нашел. У себя сделал так:

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

<script type="text/javascript">
var map;
var geocoder;
var marker;
//https://developers.google.com/maps/documentation/javascript/reference?hl=ru#MarkerOptions

 function initialize() {
    var center_map = new google.maps.LatLng(46.459856,30.731506);
    var myOptions = {
      zoom: 13,
      //center: center_map,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	geocoder = new google.maps.Geocoder(); // геокодер
	marker = new google.maps.Marker({ // маркер
                 visible: false,
                 map: map
             });
 }
function codeAddress(){
     var address = document.getElementById('adr').value;
     geocoder.geocode( { 'address':'Днепропетровск,'+address}, function(results, status) {
         if (status == google.maps.GeocoderStatus.OK) {
             map.setCenter(results[0].geometry.location);
             marker.setOptions({
             	visible: true,
             	title: address,
             	position: results[0].geometry.location
             });
             map.setZoom(17);
         } else {  
            alert('Geocode was not successful for the following reason: ' + status); 
        }
     });
 }
 </script>

<p>
        <input type="text" id="adr" value="Коцюбинского 2/4" />
        <input type="button" value="Geocode" onclick="codeAddress()">
      </p>
      <div id="map_canvas" style="width: 400px; height: 300px"></div>

Форум

Справочник

Discord чат

Курсы javascript