Пытаюсь заставить API google проложить маршрут из Чикаго в Лос Анделес. Вот код на яве: Код (Text): <!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0; padding: 0 } #map_canvas { height: 100% } </style> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDvwfxY1AM4IlRFEBY3RZe4C6vcKRsx_Vo&sensor=true"> </script> <script type="text/javascript"> function initialize() { var mapOptions = { center: new google.maps.LatLng(41.880809,-87.631073), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); } function calcRoute() { var request = { origin: "Chicago, IL", destination: "Los Angeles, CA", travelMode: google.maps.TravelMode.DRIVING }; directionsService.route(request, function(result, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(result); } }); } google.maps.event.addDomListener(window, 'load', initialize); </script> </head> <body onload="calcRoute()"> <div id="map_canvas" style="width:100%; height:100%"></div> </body> </html> В яве я вообще нибельмеса, понимаю, только отдельные моменты. В принципе содрать готовый код возможность есть, но в предложенных образцах используются элементы формы, а мне надо что бы карта загружалась сразу с заранее забитыми городами (без предоставленных инных вариантов). Результат - карта грузится, маршрут не рисуется. Помогите устранить ошибку. Буду признателен за помощь.
ява и ява-скрипт разные вещи, которые не следует путать в первую очередь. Изучить тебе поможет техническая документация. Прочитайте про маршруты в API-документации.
от туда код и скопировал, и попытался исправить под свои нужды. жестко прописал: origin: "Chicago, IL", destination: "Los Angeles, CA", (раньше города выбирались select-ом) и поставил <body onload="calcRoute()"> что бы маршрут прорисовывался при загрузке страницы. (раньше маршрут прорисовывался при изменения в селекте <select id="start" onchange="calcRoute();">) результат - не работает (карта есть, маршрута нет)! хэлп!
А вы верните все на место и посмотрите как сделано. Внимательно! Толи вы убираете? Объясните задачу подробнее, что пытаетесь сделать. И найдутся те кто поможет. Нет всей задачи, оторвано как-то. Что вы хотите из стандартного скрипта маршрута сделать? Чтобы как работало?
Вот весь код который был изначально: Код (Text): <!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="utf-8"> <title>Directions service</title> <link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet"> <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> <script> var directionsDisplay; var directionsService = new google.maps.DirectionsService(); var map; function initialize() { directionsDisplay = new google.maps.DirectionsRenderer(); var chicago = new google.maps.LatLng(41.850033, -87.6500523); var mapOptions = { zoom:7, mapTypeId: google.maps.MapTypeId.ROADMAP, center: chicago } map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); directionsDisplay.setMap(map); } function calcRoute() { var start = document.getElementById('start').value; var end = document.getElementById('end').value; var request = { origin:start, destination:end, travelMode: google.maps.DirectionsTravelMode.DRIVING }; directionsService.route(request, function(response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); } }); } google.maps.event.addDomListener(window, 'load', initialize); </script> </head> <body> <div id="panel"> <b>Start: </b> <select id="start" onchange="calcRoute();"> <option value="chicago, il">Chicago</option> <option value="st louis, mo">St Louis</option> <option value="joplin, mo">Joplin, MO</option> <option value="oklahoma city, ok">Oklahoma City</option> <option value="amarillo, tx">Amarillo</option> <option value="gallup, nm">Gallup, NM</option> <option value="flagstaff, az">Flagstaff, AZ</option> <option value="winona, az">Winona</option> <option value="kingman, az">Kingman</option> <option value="barstow, ca">Barstow</option> <option value="san bernardino, ca">San Bernardino</option> <option value="los angeles, ca">Los Angeles</option> </select> <b>End: </b> <select id="end" onchange="calcRoute();"> <option value="chicago, il">Chicago</option> <option value="st louis, mo">St Louis</option> <option value="joplin, mo">Joplin, MO</option> <option value="oklahoma city, ok">Oklahoma City</option> <option value="amarillo, tx">Amarillo</option> <option value="gallup, nm">Gallup, NM</option> <option value="flagstaff, az">Flagstaff, AZ</option> <option value="winona, az">Winona</option> <option value="kingman, az">Kingman</option> <option value="barstow, ca">Barstow</option> <option value="san bernardino, ca">San Bernardino</option> <option value="los angeles, ca">Los Angeles</option> </select> </div> <div id="map-canvas"></div> </body> </html> Задача 1) убрать поля формы select 2) сделать так, что бы при загрузке страницы отображалась карта с маршрутом между вышеуказанными городами (или любыми другими)
Я так и подумал, что вы убрали сами маршруты без указания, замены на другие... Ну подумайте еще хорошенько и у вас все получится...
да я уже себе мозг вывихнул!!! еще немного и ява-скрипт выучу! Хотя он мне нужен раз в год! Ну подскажите код. Работа стоит из-за этого!
Замените селекты на массивы или еще на чего-нибудь, на строки как меню... Я не понимаю, что вам надо, что бы как было?
Вы заходите на страницу сайта, а на ней отображается карта и маршрут между Чикаго и Лос Анделесом. Все! Никаких альтернатив, никаких селектов, никаких массивов! Пользователь не должен иметь возможность менять города. Только карта и маршрут Чикаго и Лос Анделес. Вот это должно быть результатом работы скрипта.
Сделайте аналогична селектам... Тут еще проще, раз чтобы пользователи не могли менять. У вас уже почти получилось =)) Еще чучуть и у вас точно все получится =)))
ё-моё!!! все свое умение и понимание выложил в первом коде! что там не так? где ошибка? почему не работает? ну хорош уже издеваться, очень нужна помощь! или вы сами не знаете????