在InfoWindow.content中插入样式化的HTML表格?

时间:2011-04-04 07:28:39

标签: javascript html css google-maps-api-3

问候花,

我正在使用Google Maps API构建一些工具 我想插入一些样式的HTML表而不是纯文本
但是我没有成功。那么,有什么想法吗?谢谢!

<style type="text/css">
    html { height: 100% }
    body { height: 100%; margin: 0px; padding: 0px }
    table.colorful {
        font-family: verdana, arial, sans-serif;
        font-size: 11px;
        color: #333333;
        border-width: 1px;
        border-color: #999999;
        border-collapse: collapse;
    }
    table.colorful th {
        background: #b5cfd2 url('blueCell.jpg');
        border-width: 1px;
        padding: 8px;
        border-style: solid;
        border-color: #999999;
    }
    table.colorful td {
        background: #dcddc0 url('greenCell.jpg');
        border-width: 1px;
        padding: 8px;
        border-style: solid;
        border-color: #999999;
    }
    #mapCanvas { height: 100% }
</style>

在这里:

var info = new google.maps.InfoWindow({
                position: dcs[i].coord,
                content: ""
            });

            info.content = "<table class=\"table.colorful\"><tr><th>Server</th><th>Site</th><th>IP</th><th>Services</th></tr>"

            for(var j in dcs[i].servers) {
                info.content += "<tr><td><b>" + dcs[i].servers[j].name + "</b></td><td>" + dcs[i].servers[j].site + "</td><td>" + dcs[i].servers[j].ip + "</td><td>" + dcs[i].servers[j].services + "</td></tr>";
            }

            info.content += "</table>";

1 个答案:

答案 0 :(得分:3)

你太近了,你需要使用info.setContent()代替。

info.setContent(element);