10

请看一下这个例子。

http://jsfiddle.net/Lscxuyhe/

代码如下所示:

<iframe src="https://www.google.com/maps/d/u/0/embed?mid=zUN79N8r2n1E.kLstghIFzhKU" width="640" height="480"></iframe>

我创建了自定义谷歌地图。现在无法从地图 iframe 顶部删除黑色标题(未命名地图写入)。谷歌了很多。什么都没找到。

有什么建议么?

4

3 回答 3

11

您可以使用 css 隐藏所有按钮。在隐藏和您需要的大小上创建一个容器 div 宽度溢出。将新的 google maps iframe/embed 放入更大尺寸的内部。要定位地图 iframe,请使用负边距..

100% 宽度的示例:

<div style="width: 100%; overflow: hidden; height: 300px;">
  <iframe 
     src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d39797.07748547086!2d5.46683904751879!3d51.433965676849986!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c6d90575ca5e3d%3A0x55989f5f344b006!2sPrins+Hendrikstraat+5!5e0!3m2!1snl!2snl!4v1392716144537"
     width="100%"
     height="600"
     frameborder="0"
     style="border:0; margin-top: -150px;">
  </iframe>
</div>

使 iframe 比您的容器 div 高 300 像素。150px 隐藏在下面,150px 隐藏在上面。要将这 150 隐藏在 iframe 的顶部,请使用:

边距顶部:-150px;

于 2015-08-24T15:47:59.500 回答
-2

根据文档,您会使用frameborder="0" style="border:0",但这似乎不适用于您的地图。一个花哨的替代方法是稍微扩展地图的高度并用一些 CSS 覆盖边界。

于 2015-01-14T18:34:22.163 回答
-2

添加负边距就足够了: - px; 到你的 iframe 作为内联 CSS

<iframe src="https://www.google.com/maps/d/embed?mid=xxxxxxxx" 
width="100%" 
height="500"  
style="margin-top: -46px;">
</iframe>

这会将整个地图在 iframe 内向上移动 -46px,在我的例子中,这是那个丑陋的 gmaps 顶部边框的高度......

您还可以在 CSS 文件中使用该 iframe 的类和其他 CSS

工作示例

<iframe src="https://www.google.com/maps/d/embed?mid=1y4xAXW83GJO9OfXK1oDwAfqYDZQKIVBH" width="100%" height="500"  frameborder="0" style="border:0; margin-top: -55px;"></iframe>

于 2018-04-13T12:47:49.417 回答