Метка на Google картах

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем vlad7777, 11 апр 2016.

Метки:
  1. vlad7777

    vlad7777

    Регистрация:
    6 апр 2013
    Сообщения:
    13
    Симпатии:
    0
    Друзья. Подскажите пожалуйста как на сайте http://rodnik.moscow/ на гугл-карте поставить метку с адресом и потом еще такие метки добавлять по желанию. Сейчас там просто шаблон стоит для выяснения этого вопроса. Благодарю.
     
  2. alex_storm

    alex_storm дизайн, CSS Команда форума

    Регистрация:
    11 дек 2012
    Сообщения:
    1.121
    Симпатии:
    560
    Ну из простого
    Код:
    <script>
    var latlngbounds = new google.maps.LatLngBounds();
    for ( var i=0; i<points.length; i++ ){
         latlngbounds.extend(points[i]);
    }
    map.setCenter( latlngbounds.getCenter(), map.fitBounds(latlngbounds));
    </script>
    
    Где points это массив координат меток на карте гугла, содержит (долготу, широту)

    Если нужна только одна метка с уже раскрытым описанием, то можно сделать так.
    Код:
    <script>
    var infoWindow = new google.maps.InfoWindow;
    
    var onMarkerClick = function() {
    var marker = this;
    var latLng = marker.getPosition();
    infoWindow.setContent(marker.title);
    
    infoWindow.open(map, marker);
    };
    google.maps.event.addListener(map, 'click', function() {
    infoWindow.close();
    });
    
    var marker1 = new google.maps.Marker({
    map: map,
    title: 'Кинотеатр КАРО ФИЛЬМ в ТЦ Шоколад',
    position: new google.maps.LatLng(56.31927,44.026297)
    });
    
    google.maps.event.addListener(marker1, 'click', onMarkerClick);
    </script>
    
     
    vlad7777 нравится это.
  3. vlad7777

    vlad7777

    Регистрация:
    6 апр 2013
    Сообщения:
    13
    Симпатии:
    0
    Благодарю! Но в первом случае я недопонял в каком формате нужно вводить массив координат меток на карте гугла. А во втором случае карта вообще не отразилась. Изначальный код находится прям на странице index внизу и выглядит так:
    <script>
    function initialize()
    {
    var mapProp = {
    center: new google.maps.LatLng(55.6033289,37.321493),
    zoom: 10,
    scrollwheel: false,
    mapTypeId:google.maps.MapTypeId.ROADMAP
    };
    var map=new google.maps.Map(document.getElementById("templatemo-map")
    ,mapProp);
    }

    google.maps.event.addDomListener(window, 'load', initialize);
    google.maps.event.addDomListener(window, 'resize', function()
    {
    map.setCenter(center);
    });
    </script>
    Этот код карту показывает.
    Исходя из этого вопрос как внедрить в этот код скрипт с меткой?
    Хотя в идеале хорошо бы было что бы карта показывала созданную в "Моих картах" карту гугл допустим такую https://www.google.com/maps/d/edit?mid=zviXuKpSFV5s.kGDPTOfHf4m0&usp=sharing . Для сайта гуглы предлагают такой код: <iframe src="https://www.google.com/maps/d/u/0/embed?mid=zviXuKpSFV5s.kGDPTOfHf4m0" width="640" height="480"></iframe>