將來自infowindow的數據帶入谷歌地圖上的Fusion Tables圖層

我正在構建我的第一個融合表格，並將兩個融合表格帶入Google地圖 - 其中一個多邊形和一個點。相反，顯示常規信息窗口，當你點擊一個多邊形或一個點，我想拉從融合表的一些數據，但它無法正常工作：將來自infowindow的數據帶入谷歌地圖上的Fusion Tables圖層

<script> 
    function initialize() { 
    var england = new google.maps.LatLng(53.2, -2); 
    map = new google.maps.Map(document.getElementById('map_canvas'), { 
     center: england, 
     zoom: 8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 

    layer1 = new google.maps.FusionTablesLayer({ 
     query: {select: 'geometry', from: '1HgGUc72F2Wlp6dvy4GWvLyWrl1kC6aJhnM7jPyc'}, 
     styles: [ 
     { where: "Score = 0", polygonOptions: { fillColor: "#cdcdcd", fillOpacity: 0.3 } }, 
     { where: "Score = 1", polygonOptions: { fillColor: "#FF0000", fillOpacity: 0.5 } }, 
     { where: "Score = 2", polygonOptions: { fillColor: "#FF7E00", fillOpacity: 0.5 } }, 
     { where: "Score = 3", polygonOptions: { fillColor: "#008000", fillOpacity: 0.5 } }], 
    options: {suppressInfoWindows: true}, 
    map: map, 
    }); 
    google.maps.event.addListener(layer1, 'click', function(e) {e.infoWindowHtml = "Score" + e.row['Score'].value;} 
    }); 

    layer2 = new google.maps.FusionTablesLayer({ 
    query: {select: 'postcode', from: '1bawAKwQAUGE4mzYSyw4lTbOcgp7MgIGOLROel8Y'}, 
    options: {suppressInfoWindows: true}, 
    map: map, 
    }); 
    google.maps.event.addListener(layer2, 'click', function(e) {e.infoWindowHtml = "Postcode" + e.row['Postcode'].value;} 
    }); 

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

    } 
</script> 
</head> 
<body onLoad="initialize()"> 
    <div id="map_canvas"></div> 
</body> 
</html>

It was all working well，信息窗口打壓，直到我說AddListener和addDomListeners。任何人都可以幫助我回到正軌嗎？

來源

2013-01-13 Mark Morton

你不會有你的嘗試很成功。單擊某個點時，點擊不會將點擊事件傳遞到底層多邊形圖層（並且AFAIK無法更改該點）。只要兩張表之間沒有任何關係，就不會工作，因爲如果沒有這種關係，甚至沒有機會按給定的座標請求兩個表。 –

您的「新」的代碼語法錯誤（兩個額外的「}」）

你有你的初始化函數裏面你要addDomListener調用（不應該的問題，你仍然有它的<body標籤，但你真的不應該有這兩個地方

<script> 
function initialize() { 
var england = new google.maps.LatLng(53.2, -2); 
map = new google.maps.Map(document.getElementById('map_canvas'), { 
    center: england, 
    zoom: 8, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 

layer1 = new google.maps.FusionTablesLayer({ 
    query: {select: 'geometry', from: '1HgGUc72F2Wlp6dvy4GWvLyWrl1kC6aJhnM7jPyc'}, 
    styles: [ 
    { where: "Score = 0", polygonOptions: { fillColor: "#cdcdcd", fillOpacity: 0.3 } }, 
    { where: "Score = 1", polygonOptions: { fillColor: "#FF0000", fillOpacity: 0.5 } }, 
    { where: "Score = 2", polygonOptions: { fillColor: "#FF7E00", fillOpacity: 0.5 } }, 
    { where: "Score = 3", polygonOptions: { fillColor: "#008000", fillOpacity: 0.5 } }], 
options: {suppressInfoWindows: true}, 
map: map, 
}); 
google.maps.event.addListener(layer1, 'click', function(e) {e.infoWindowHtml = "Score" + e.row['Score'].value;}); 
layer2 = new google.maps.FusionTablesLayer({ 
query: {select: 'postcode', from: '1bawAKwQAUGE4mzYSyw4lTbOcgp7MgIGOLROel8Y'}, 
options: {suppressInfoWindows: true}, 
map: map, 
}); 
google.maps.event.addListener(layer2, 'click', function(e) {e.infoWindowHtml = "Postcode" + e.row['Postcode'].value;}); 
} 
google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
</head> 
    <body> 
    <div id="map_canvas"></div> 
</body> 
</html>

working example 修改，使每個層的工作信息窗口，使用此功能：

function openIW(FTevent) { 
    // infoWindow.setContent(FTevent.infoWindowHtml); 
    // infoWindow.setPosition(FTevent.latLng); 
    infoWindow.setOptions(
    { 
    content: FTevent.infoWindowHtml, 
    position: FTevent.latLng, 
    pixelOffset: FTevent.pixelOffset 
    }); 
    infoWindow.open(map); 
}

來源

2013-01-13 19:38:24 geocodezip

非常感謝那個geocodezip。我應該在原始發帖中強調* some *這個詞。我想要做的只是從Fusion Tables中帶來一些*字段 - 顯然，這兩個層/表格有不同的字段。這就是爲什麼我爲每個圖層分開addListener/addDomListener（即使這是錯誤的！）。 –

我不明白你的評論。我不是一個心智讀者，我無法分辨你想要哪些數據，哪些不需要。你當然可以改變提供的代碼來做你想做的事情，這只是一個例子/概念驗證。 – geocodezip

感謝您的示例/概念驗證。假設我想導入一個變量（每個圖層都有一個不同的變量）並將其添加到信息窗口中。我已經爲每個圖層複製了openIW並嘗試執行以下操作： 'function openIW1（FTevent）{0} {0} {0} {infoWindow.setContent（FTevent.infoWindowHtml）; // infoWindow.setPosition（FTevent.latLng）; infoWindow.setOptions（ { 內容： '分數：' + e.row [ '得分']值，位置：FTevent.latLng， pixelOffset，用於：FTevent.pixelOffset }）; infoWindow.open（map）; }' 但我現在沒有收到任何東西，當我點擊地圖。 –

google.maps.event.addListener(layer, 'click', function(e) { 
    console.log("E.Row! : "+ e.row['name'].value); 
});

來源

2016-12-26 06:06:45

將來自infowindow的數據帶入谷歌地圖上的Fusion Tables圖層

回答

相關問題