Question

我正在尝试将以下代码转换为jquery，或者只是让它工作以便为我的信息窗口内容节省大量代码。我也试图使信息窗口看起来非常像一个带有图片等的迷你html页面。所以我一直在这里搜索这个解决方案三个星期。我观看了很多视频，无法使用它们。地图工作，位置lat长期工作一切正常但信息窗口很糟糕。请帮忙！

 <div id="map" style="width:100%; height:400px;"></div>
        function myMap() {
         var contentString = ' <div class="panel panel-info" Style="width:auto; height:auto;display: block; min-height: 134px;" scrolltop="0" scrollleft="0"">' +' <div class="panel-heading text-center" >' +'Sign Information' +
        ' </div >' +'<div class="panel-body">' +' <div style="float:inherit; width: 50%;">' +' </div>' +' </div>' + ' <div style="float:right; width:50%">' + ' <div class="k-content" style="width:200px">' + ' </div>' +
        '  </div>' +' </div >'
        var myCenter = new google.maps.LatLng(33.367302, -88`enter code here`.322125);
        var mapCanvas = document.getElementById("map");
        var mapOptions = { center: myCenter, zoom: 6 };
        var map = new google.maps.Map(mapCanvas, mapOptions);
        google.maps.event.addListener(map, 'click', function (event)
         {
              placeMarker(map, event.latLng);

         });

         function placeMarker(map, location)
         {
            var marker = new google.maps.Marker(
        {
              position: location,
              map: map

         });
          var infowindow = new google.maps.InfoWindow({
           content:( 'Latitude: ' + location.lat() + '<br>Longitude: ' + location.lng() + contentString)

         });
         infowindow.open(map, marker);

         }

                    function geocode() {


                    }

                }

the info window notice the pretty blue that's where I want all the content not the big white area , cant figure out how to fix it though

Answer 1

另外，

只是看一下你的代码，我就会发现代码错误，你也忘了设置你的内容。

进行这些调整......

var infowindow = new google.maps.InfoWindow({
 content :  'Latitude: ' + location.lat() + '<br>' + 'Longitude: ' + location.lng()+ '' });

infowindow.setContent(content);
infowindow.open(map, marker);

http://jsbin.com/tixini/edit?html,css,js,console,output

自定义我的谷歌地图信息窗口内容

1 个答案: