Google会将样式添加到覆盖我的样式的Map容器中。
我知道如何解决这个问题,但是API(v3.8/9/exp)也加载了webfont“Roboto”,我并不真正需要/想要它。
是否有任何设置/选项/方法可供选择?
我可以阻止API添加额外的CSS吗?
这是google-maps-API添加到我的页面的<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="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700">
<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>
4条答案
按热度按时间ux6nzvsh1#
您可以在Google脚本调用insertBefore方法之前替换它:
http://jsfiddle.net/coma/7st6d9p2/
jk9hmnmh2#
2017年10月更新
Google改变了在页面上注入样式的方法。目前他们插入了一个空的
style
元素,然后用Robot字体更改了这个样式元素的内容。这里是一个新的解决方案:原始答案
感谢coma提供的解决方案!我还决定拦截那些覆盖字体家族、字体大小和字体粗细的样式。适用于敕勒浏览器和IE8+的完整解决方案:
wz8daaqr3#
我发现上面的解决方案,以防止网站与谷歌Map加载Roboto。
如果你--像我一样--使用WordPress,可能会有其他插件引用谷歌字体。
然而,我挣扎在我的一些网站与上述代码,因为它的一部分(1)也影响其他样式加载,(2)“杀死”样式,故意不仅包含gm样式,但其他样式以及(3)不影响其他谷歌字体加载,其中一个或另一个插件添加链接到fonts.googleapis.com的DOM操作以及。
下面的方法对我很有效,它只是防止其他脚本添加任何在href属性中包含https://fonts.googleapis.com的标记。
eit6fx6z4#
不幸的是,我是一个新手,我不能让其他的建议工作。所以我从DOM中删除了所有的谷歌字体。我希望这能有所帮助。