Google Maps API Проложить маршрут от м.Берестейка (Киев) к заданному адресу / Google API

[ataman]

Привет всем!

 

Такая проблема, как по нажатию кнопки сделать построение маршрута от метро Берестейка к определенному адресу (адрес известен) ?.

 

<button class="route btn btn-primary" id="travelMode1" data-travelmode="WALKING">Пешком</button>

<button class="route btn btn-primary" id="travelMode2" data-travelmode="DRIVING">На авто</button>

function initialize() {


    var settings = {

        zoom: 17,

        center: new google.maps.LatLng(50.445068, 30.420486),

        mapTypeControl: true,

        mapTypeControlOptions: {

            style: google.maps.MapTypeControlStyle.DROPDOWN_MENU

        },

        navigationControl: true,

        navigationControlOptions: {

            style: google.maps.NavigationControlStyle.SMALL

        },

        mapTypeId: google.maps.MapTypeId.ROADMAP

    };

    var map = new google.maps.Map(document.getElementById("map_canvas"), settings);

//—————————————————

    var travelMode;

   // var travelMode = "google.maps.DirectionsTravelMode.WALKING";


    var modeButton1 = document.getElementById('travelMode1');

    var modeButton2 = document.getElementById('travelMode2');


    modeButton1.onclick = function() {

        travelMode = "google.maps.DirectionsTravelMode."+this.getAttribute('data-travelmode');

        modeButton2.className = '';

        this.className = 'active';

        setRoutetype ();

    }


    modeButton2.onclick = function() {

        travelMode = "google.maps.DirectionsTravelMode."+this.getAttribute('data-travelmode');

        modeButton1.className = '';

        this.className = 'active';

        setRoutetype ();

    }



//——————————————--

    var balloon = new google.maps.InfoWindow();

    var service = new google.maps.DirectionsService();

    var direction = new google.maps.DirectionsRenderer({map: map});

    var position = new google.maps.LatLng(50.448238, 30.491260);

    var request = {

    origin:      position,

    destination: latlng,

    travelMode:  travelMode

  };


    var companyImage = new google.maps.MarkerImage('design/images/contacts/pin-jaya.png',

        new google.maps.Size(154, 133),

        new google.maps.Point(0, 0),

        new google.maps.Point(60, 120)

    );


    var companyPos = new google.maps.LatLng(50.448238, 30.491260);


    var companyMarker = new google.maps.Marker({

        position: companyPos,

        map: map,

        icon: companyImage,

        title: "JayaDigital",

        zIndex: 3

    });


        function setRoutetype () { 

        navigator.geolocation.getCurrentPosition(function(position) {

        showRouteService(position);

      });


    }

    function showRouteService(position) {


        var request = {

        origin:      new google.maps.LatLng(position.coords.latitude, position.coords.longitude),

        destination: latlng,

        travelMode: google.maps.DirectionsTravelMode.DRIVING

        };


      service.route(request, function(response, status) {

        if (status == google.maps.DirectionsStatus.OK) {

          direction.setDirections(response);

        }

      });


    }


}

[Yazon_Nile]

В каком виде нужен маршрут? Маршрут на карте или указатели маршрута, вроде такого "2 км на север по 20й трассе, потом направо..."?

[ataman]

В каком виде нужен маршрут? Маршрут на карте или указатели маршрута, вроде такого "2 км на север по 20й трассе, потом направо..."?

 

Маршрут на карте, что б появилась линия маршрута...

[Yazon_Nile]

рабочий код

статья

 

В коде пишешь, к примеру Kyiv, Moskow - рисует маршрут

Edited June 12, 2014 by Yazon_Nile

[ataman]

рабочий код

статья

 

В коде пишешь, к примеру Kyiv, Moskow - рисует маршрут

 

Спасибо, сейчас проверю

 

И еще такой вопрос, когда отображается информационный блок на карте, при первом щелчке плывет его верстка http://joxi.ru/TJ-ZU_3JTJBDYwonXeE (СКРИН)

 

Когда второй раз щелкаешь по той же иконки, верстка выравнивается: http://joxi.ru/vJ-ZU_3JTJAjEz5fPys

 

В чем это проблема?

Edited June 12, 2014 by ataman

[Yazon_Nile]

картинка не загрузилась сначала. А там высота может проставляется..

[ataman]

картинка не загрузилась сначала. А там высота может проставляется..

 

Так дело в том что это скрип изначально в первый раз неправильно выдает высоту. Сотрите по скрину: http://joxi.ru/arqZUxjKTJAVH4XnQoo

[Yazon_Nile]

а я о чем? Высоту проставил исходя из того, что картинка не загрузилась. Но она загружается и ломает все.

[ataman]

 

картинка не загрузилась сначала. А там высота может проставляется..

 

Как можно сделать, что б картинка загружалась сразу ?