Google Maps API v3折線選項卡式InfoWindow

Question

我在使選項卡式信息窗口顯示為路徑時遇到一些困難。 我遵循了本教程 。

我有一個帶有折線的KML圖層（它們的曲線-代表地形特征），並且不知道如何在單擊路徑時顯示信息窗口。 我看過一些關於計算中點的教程（但是是直線的）。

我嘗試了兩種方法（很多方法）：

var streamPoly = google.maps.Polyline.prototype.getPosition = function() {
return this.getPath().getAt(0);}

var streamPoly = poly.getPath(); 

我的標頭中有什么：

var map;
var streamPoly;

function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(42.687984,-79.394159);

    var mapOptions = {
        zoom: 12,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    var ctaLayer = new google.maps.KmlLayer({
        url: 'paths.kml'
    });
    ctaLayer.setMap(map);
    ctaLayer.set('preserveViewport', true); 


    var  infoBubble = new InfoBubble({
        maxWidth: 300
    });

    var div = document.createElement('DIV');
    div.innerHTML = 'Hello';

    infoBubble.addTab('Tab 1', div);
    infoBubble.addTab('Tab 2', "<B>This is tab 2</B>");

    google.maps.event.addListener(streamPoly, 'click', function() {
        if (!infoBubble.isOpen()) {
            infoBubble.open(map, streamPoly);
        }
    });
}

google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

您無法將KmlLayer中的折線作為google.maps.Polyline對象訪問。 要在KmlLayer上打開InfoWindow（或InfoBubble），您需要向KmlLayer添加偵聽器：

google.maps.event.addListener(ctaLayer, 'click', function(evt) {
        if (!infoBubble.isOpen()) {
            infoBubble.setPosition(evt.latLng);
            infoBubble.open(map);
        }
    });

evt將是一個KmlLayerMouseEvent ，它將包含有關單擊的功能的信息