我是 CSS 的新手,我想在 div 背景中加载谷歌地图。我当前的代码如下:
HTML
<div class="map"></div>
<script src="http://maps.googleapis.com/maps/api/js?key=mykey&sensor=false"></script>
CSS
.map{
background-image:url(https://maps.google.co.in/maps?q=new+Delhi&hl=en&sll=28.572047,77.069178&sspn=0.02348,0.039482&hnear=Delhi&t=m&z=10)
background:white;
width:1000px;
height:500px;
margin-left:20
}
最佳答案
我会使用 google 的静态 map 作为背景(没有任何 js)
我做了一些最小的例子(只有 body 上的 css):
body{
background: url("https://maps.googleapis.com/maps/api/staticmap? center=Brooklyn+Bridge,New+York,NY&zoom=13&size=600x300&maptype=roadmap&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&markers=color:green%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284&sensor=false")
}
编辑:固定宽度/高度和新德里的示例 is here
附言url 中的大小应与 div 宽度/高度成比例。对于非商业图片,最大尺寸为 640x640,但其尺寸为 1280px x 1280px,因此您可以将其拉伸(stretch)得更多。
关于javascript - 如何在 div 的背景中加载谷歌地图?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21480516/