1

Вот сайт, на котором проблема. Как исправить?

Код вставки карты:

// google api maps
  var map;
  function initialize_map() {
    if ($('#map').length) {
      var myLatLng = new google.maps.LatLng(50.377268, 30.379576);

      var mapOptions = {
        zoom: 10,
        center: myLatLng,
        scrollwheel: false,
        panControl: true,
        zoomControl: true,
        scaleControl: true,
        mapTypeControl: true,
        streetViewControl: true,
        styles: [{...};
      var image = new google.maps.MarkerImage('images/1-06.svg',
            new google.maps.Size(95, 40),
            new google.maps.Point(0, 0),
            new google.maps.Point(10,50),
        );
      map = new google.maps.Map(document.getElementById('map'), mapOptions);
      var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        icon: image, 
        position: new google.maps.LatLng(50.377268, 30.379576),
      });
      } else {
      return false;
    }
    return false;
  }
  google.maps.event.addDomListener(window, 'load', initialize_map);
6
  • Покажите js код, которым вы ставите иконку на карту 22 мая 2017 в 3:57
  • (jsfiddle.net/4qdabq2n) 22 мая 2017 в 5:20
  • 1
    Эй, закрыватели! Вопрос совершенно правильный, проблема в svg. Я на таком всю голову себе сломал когда-то. Сейчас отвечу. 22 мая 2017 в 6:46
  • 1
    @KAGGDesign, только вот код должен быть в вопорсе, а не на каком-то сайте, который скоро исправят...
    – Qwertiy
    22 мая 2017 в 7:22
  • 1
    Четвертый закрыватель пришел. Вы что, люди, белены объелись? С какой стати вопрос не демонстрирует "желательное поведение"? Все ясно - иконка обрезана. Вопрос "почему" выводит на глубинную проблему с svg в gmap -смотрите мой ответ. Закроете вопрос - сам задам его снова, и приложу свой ответ. Потому что считаю, что именно такого уровня вопросы достойны обсуждения на SO, а не примитив типа почему у меня блоки не так встают в разметке. Здесь конкретный косяк то ли Google, то ли Adobe. Уверен, куча народу сломала себе голову. А они вопрос закрывают... 22 мая 2017 в 18:07

1 ответ 1

3

Как я и думал, проблема в svg файле иконки. Дело в том, что некоторые редакторы (например, Adobe Illustrator) svg создают файл без явного указания его размеров.

svg - это обычный текстовый файл в формате xml.

У вас в файле

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 73 99" style="enable-background:new 0 0 73 99;" xml:space="preserve">

Откройте его текстовым редактором и добавьте туда в явном виде width и height, вот так:

<svg width="73" height="99" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 73 99" style="enable-background:new 0 0 73 99;" xml:space="preserve">

Вот такой svg карты google выводят без обрезания.

Иконку маркера я бы создавал так:

var image = {
    size: new google.maps.Size(37, 50),
    scaledSize: new google.maps.Size(37, 50)
};
2
  • Эм.. Обычно размеры наоборот вредны, а не полезны...
    – Qwertiy
    22 мая 2017 в 7:19
  • Я не знаю, это баг или фича в gmap. Бился об стену дня два когда-то. 22 мая 2017 в 7:20

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.