Question

如何增加通过地址的信息窗口的高度？它在Windows 7中使用IE8和Firefox正确显示，但在Windows XP中，地址部分位于信息窗之外。

function initialize() {
           if (GBrowserIsCompatible()) {
             var map = new GMap2(document.getElementById("map_canvas"),
                        { size: new GSize(400,300) } );
             map.setCenter(new GLatLng(23.027527,72.508223), 13);
             var point = new GLatLng(23.027527,72.508223);
             var html_text  = "<table cellspacing=0 cellpadding=0><tr><td><b><font size=-1px>hi</font></b></td></tr><tr><td><font  size=-2px>hisdf,</font></td></tr><tr><td><font size=-2px>hisdf</font></td></tr><tr><td><font  size=-2px>hisdfs</font></td></tr></table>";
             var marker = new GMarker(point, G_DEFAULT_ICON);
             map.addOverlay(marker);
             marker.openInfoWindowHtml(html_text); 
             GEvent.addListener(marker, "mouseover", function() {
                 marker.openInfoWindowHtml(html_text);
             });

             map.enableScrollWheelZoom();   

             var customUI = map.getDefaultUI();
             customUI.controls.scalecontrol = false;
             map.setUI(customUI);
           }
 }

这是我的代码，如何在函数中应用div你可以建议我吗？

Google Maps API示例

function initialize() {
               if (GBrowserIsCompatible()) {
                 var map = new GMap2(document.getElementById("map_canvas"),
      { size: new GSize(400,300) } );
                 map.setCenter(new GLatLng(23.027527,72.508223), 13);
                 var point = new GLatLng(23.027527,72.508223);
                 var html_text  = "<table cellspacing=0 cellpadding=0><tr><td><b><font size=-1px>Cadila Healthcare Ltd</font></b></td></tr><tr><td><font  size=-2px>Satellite Cross Roads, Ahmedabad,</font></td></tr><tr><td><font size=-2px>Gujarat, India, 380015</font></td></tr><tr><td><font  size=-2px>Phone : 79-26868100</font></td></tr></table>";
                var marker = new GMarker(point, G_DEFAULT_ICON);
                 map.addOverlay(marker);
                 marker.openInfoWindowHtml(html_text);
                 GEvent.addListener(marker, "mouseover", function() {
                          marker.openInfoWindowHtml(html_text);
                      });


                 map.enableScrollWheelZoom();   

                var customUI = map.getDefaultUI();
                 customUI.controls.scalecontrol = false;
                 map.setUI(customUI);

               }
     }


</script>

Answer 1

首先，我强烈建议您不要在变量中使用html。它很难阅读并可能使您暴露于XSS攻击。请改用DOM中适当的html元素。

<div id="myTemplates" style="display:none">
<table cellspacing=0 cellpadding=0>
    <tr>
        <td><b><font size=-1px>hi</font></b></td>
    </tr>
    <tr>
        <td><font  size=-2px>hisdf,</font></td>
    </tr>
    <tr>
        <td><font size=-2px>hisdf</font></td>
    </tr>
    <tr>
        <td><font  size=-2px>hisdfs</font></td>
    </tr>
</table>
</div>

和

$('#myTemplate table').clone();

获取元素。

当然，你会想要将样式从内联更改为CSS，这样可以更容易地看到它的错误，并让社区提供帮助。： - ）

然后问题：看起来生成的弹出框中的容器元素之一在元素中指定了宽度和高度。

<div style="position: relative; left: 0px; top: 0px; z-index: 10; width: 249px; height: 90px;" class="gmnoprint">

这可能是您的内容不适合的原因。 IE和FF以不同的方式处理拳击。

Answer 2

function initialize() {
           if (GBrowserIsCompatible()) {
             var map = new GMap2(document.getElementById("map_canvas"),
  { size: new GSize(400,300) } );
             map.setCenter(new GLatLng(23.027527,72.508223), 13);
             var point = new GLatLng(23.027527,72.508223);
                              var html = "<table width=\"100%\" border=\"0\" cellpadding=\"0\"cellspacing=\"0\">";
                    html += "<tr><td><b><font size=-1px>dfgd</font></b></td></tr>";
                    html += "<tr><td><font  size=-2px>dfgdg</font></td></tr>";
                    html += "<tr><td><font size=-2px>dfgdg</font></td></tr>";
                    html += "<tr><td><font  size=-2px>fdgdgd</font></td></tr>";
                    html += "</table>";
                    html = "<div style=\"position: relative; float: left; width: 225px; height: 80px; border: 0px coral solid;\">" + html + "</div>"; 
            var marker = new GMarker(point, G_DEFAULT_ICON);
             map.addOverlay(marker);
             marker.openInfoWindowHtml(html); 
             GEvent.addListener(marker, "mouseover", function() {
                      marker.openInfoWindowHtml(html);
                  });


             map.enableScrollWheelZoom();   

            var customUI = map.getDefaultUI();
             customUI.controls.scalecontrol = false;
             map.setUI(customUI);

           }
 }

你可以像这样使用html ....

如何在Google Maps API中增加信息窗口的高度？

2 个答案: