Question

这是我在这里的第一篇文章，所以如果我做一个新手的失礼，我会道歉。

我在地图上有一个Google Fusion Table layer。我是通过导入KML文件创建的。一切都很好，但上周我意识到InfoWindow现在显示几何字段中相关多边形的所有顶点。

奇怪的是，这些顶点不会显示在实际的Fusion表中，而只会显示在地图顶部的图层上。我怀疑JavaScript代码可能会发生一些事情，我很陌生，或者可能是Fusion Tables的新API。

我删除了正文部分，以解决此页面上的一些格式问题，但这里是代码：

<!DOCTYPE html>
<html>
                <head>
                <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
                <meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
                <title>Georgia Areas</title>

                <link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />

                <script type="text/javascript" src="http://www.google.com/jsapi"></script> 


                <style type="text/css">
                                html { height: 100% }
                                body { height: 100%; margin: 0; padding: 0 }
                                #map_canvas { height: 100%; weight: 100% }
                                #search-panel {
                                                position: absolute;
                `                               top: 10px;
                                                left: 50%;
                                                margin-left: -180px;
                                                width: 350px;
                                                z-index: 5;
                                                background-color: #fff;
                                                padding: 5px;
                                                border: 1px solid #999;
                                }
                                #address {
                                                width: 345px;
                                }
                                #instruction {
                                                position:  fixed;
                                                float:  right;
                                                bottom:  10px;
                                                right:  20px;
                                                width: 375px;
                                                z-index: 4;
                                                background-color: #fff;
                                                padding: 7px;
                                                border: 1px solid #999;
                                                font-family:"Arial";
                                }
                                p.small {font-size: small}
                </style>

                <script type="text/javascript"
                src="http://maps.googleapis.com/maps/api/js?key=AIzaSyARy6zbLmjvq3uaPjI--s45afA0LA-ynnA&amp;sensor=false">
                </script>


                <script type="text/javascript">

                var infoWindow = new google.maps.InfoWindow();

                var input = document.getElementById('address');

                var geocoder;
                var gaCentroid;
                var gaBounds;
                var myMap;


                function myclick(num) {
                                google.maps.event.trigger(markers[num], "click");
                }


                function initialize() {

                                geocoder = new google.maps.Geocoder();                          

                                gaCentroid = new google.maps.LatLng(32.900000, -83.22671);

                                gaBounds = new google.maps.LatLngBounds(
                                                new google.maps.LatLng(30.34,-85.652),
                                                new google.maps.LatLng(35.01,-80.85)
                                );

                                var mapOptions = {
                                                center: gaCentroid,
                                                zoom: 8,
                                                mapTypeId: google.maps.MapTypeId.ROADMAP
                                };

                                myMap = new google.maps.Map(document.getElementById("map_canvas"), 
                                                mapOptions);

                                var lyr = new google.maps.FusionTablesLayer({
                                                query: {
                                                                select: 'geometry',
                                                                from: '1Bgo94POIxKwQOOltuFbaAW6CpjQqPvYLVSqXuLk'
                                                },
                                                styles: [{
                                                                polygonOptions: {
                                                                                fillColor: '0xDEEBF7',
                                                                                fillOpacity: 0.1
                                                                }
                                                }]
                                });

                                lyr.setMap(myMap);  

                }


                function codeAddress() {
                                var address = document.getElementById('address').value;
                                geocoder.geocode({'address':address}, function(results, status) {
                                                if (status == google.maps.GeocoderStatus.OK) {
                                                                myMap.setCenter(results[0].geometry.location);
                                                                myMap.fitBounds(results[0].geometry.viewport)
                                                                var marker = new google.maps.Marker({
                                                                                map: myMap,
                                                                                position: results[0].geometry.location
                                                                });
                                                } else {
                                                                alert('Geocode was not successful for the following reason: ' + status);
                                                }
                                });
                }

                function reCenter() {
                                var currentCenter = myMap.getCenter();
                                google.maps.event.trigger(myMap, 'resize');
                                myMap.setCenter(currentCenter);
                }


</script>
</head>
</html>

任何人都可以对此有所了解吗？

谢谢，

赖安

Answer 1

您可以配置信息窗口中显示的内容。

请参阅Fusion Tables帮助中的this page

Answer 2

您必须将templateId定义为具有与infoWindow相同的内容。

将此添加到传递给图层的选项：

templateId:2

Answer 3

我最终更改了代码以引用另一个Fusion Tables Layer。我改变的只是身份证。这似乎适用于新图层，但我仍然不知道在InfoWindow中显示几何图形的情况。

如果它再次发生，我将大部分尝试Dr.Molle的建议。

Fusion Table图层InfoWindow显示几何字段中的所有顶点

3 个答案: