Подтвердить что ты не робот

Google Maps v3 - запрет API загружать шрифт Roboto

Google добавляет стили в контейнер карт, которые переопределяют мои стили.
Я знаю, как это исправить. Но API (v3.8/9/exp) также загружает webfont "Roboto", который мне действительно не нужен/нужен.

Есть ли параметр/параметр/способ вокруг этого?
Могу ли я запретить API добавлять дополнительный CSS?

Это код, который API-интерфейс google-maps добавляет к <head> моей страницы:

<style type="text/css">
  .gm-style .gm-style-cc span,
  .gm-style .gm-style-cc a,
  .gm-style .gm-style-mtc div {
    font-size:10px
  }
</style>

<link type="text/css" 
      rel="stylesheet" 
      href="#" onclick="location.href='https://fonts.googleapis.com/css?family=Roboto:300,400,500,700'; return false;">

<style type="text/css">
  @media print {
    .gm-style .gmnoprint,
    .gmnoprint {
      display:none
    }
  }
  @media screen {
   .gm-style .gmnoscreen,
   .gmnoscreen {
     display:none
   }
  }
</style>
<style type="text/css">
  .gm-style {
    font-family: Roboto,Arial,sans-serif;
    font-size: 11px;
    font-weight: 400;
    text-decoration: none
  }
</style>
4b9b3361

Ответ 1

Вы можете заменить метод insertBefore до того, как Google script вызывает его:

http://jsfiddle.net/coma/7st6d9p2/

var head = document.getElementsByTagName('head')[0];

// Save the original method
var insertBefore = head.insertBefore;

// Replace it!
head.insertBefore = function (newElement, referenceElement) {

    if (newElement.href && newElement.href.indexOf('//fonts.googleapis.com/css?family=Roboto') > -1) {

        console.info('Prevented Roboto from loading!');
        return;
    }

    insertBefore.call(head, newElement, referenceElement);
};

// Check it!
new google.maps.Map(document.getElementById('map'), {
    center           : new google.maps.LatLng(51.508742,-0.120850),
    zoom             : 16,
    mapTypeId        : google.maps.MapTypeId.ROADMAP,
    streetViewControl: false,
    zoomControl      : false,
    panControl       : false,
    mapTypeControl   : false
});

Ответ 2

ОБНОВЛЕНИЕ 10/2017

Google изменил подход, как они вводят стили на странице. В настоящее время они вставляют пустой элемент style, а затем изменяют содержимое этого элемента стиля шрифтом Robot. Вот новое решение:

// Preventing the Google Maps libary from downloading an extra font
(function() {
    var isRobotoStyle = function (element) {

        // roboto font download
        if (element.href
            && element.href.indexOf('https://fonts.googleapis.com/css?family=Roboto') === 0) {
            return true;
        }
        // roboto style elements
        if (element.tagName.toLowerCase() === 'style'
            && element.styleSheet
            && element.styleSheet.cssText
            && element.styleSheet.cssText.replace('\r\n', '').indexOf('.gm-style') === 0) {
            element.styleSheet.cssText = '';
            return true;
        }
        // roboto style elements for other browsers
        if (element.tagName.toLowerCase() === 'style'
            && element.innerHTML
            && element.innerHTML.replace('\r\n', '').indexOf('.gm-style') === 0) {
            element.innerHTML = '';
            return true;
        }
        // when google tries to add empty style
        if (element.tagName.toLowerCase() === 'style'
            && !element.styleSheet && !element.innerHTML) {
            return true;
        }

        return false;
    }

    // we override these methods only for one particular head element
    // default methods for other elements are not affected
    var head = $('head')[0];

    var insertBefore = head.insertBefore;
    head.insertBefore = function (newElement, referenceElement) {
        if (!isRobotoStyle(newElement)) {
            insertBefore.call(head, newElement, referenceElement);
        }
    };

    var appendChild = head.appendChild;
    head.appendChild = function (textNode) {
        if (!isRobotoStyle($(textNode)[0])) {
            appendChild.call(head, textNode);
        }
    };
})();

ОРИГИНАЛЬНЫЙ ОТВЕТ

Благодаря коме для решения! Я также решил перехватить стили, которые переопределяют семейство шрифтов, размер шрифта и размер шрифта. Полное решение для современных браузеров и IE8 +:

// Preventing the Google Maps libary from downloading an extra font
var head = $('head')[0];
var insertBefore = head.insertBefore;
head.insertBefore = function (newElement, referenceElement) {
    // intercept font download
    if (newElement.href
        && newElement.href.indexOf('https://fonts.googleapis.com/css?family=Roboto') === 0) {
        return;
    }
    // intercept style elements for IEs
    if (newElement.tagName.toLowerCase() === 'style'
        && newElement.styleSheet
        && newElement.styleSheet.cssText
        && newElement.styleSheet.cssText.replace('\r\n', '').indexOf('.gm-style') === 0) {
        return;
    }
    // intercept style elements for other browsers
    if (newElement.tagName.toLowerCase() === 'style'
        && newElement.innerHTML
        && newElement.innerHTML.replace('\r\n', '').indexOf('.gm-style') === 0) {
        return;
    }
    insertBefore.call(head, newElement, referenceElement);
};