使用FusionTablesLayerOptions的查詢參數不起作用的Google Fusion Table查詢

Question

我的目標是根據Fusion Table的查詢結果創建google.maps.FusionTablesLayer。我有一個公開的Google Fusion Table已被「啓用下載」。我可以使用Google Fusion Tables REST API成功查詢表格（我會提供一個指向API的鏈接，但沒有足夠的信譽）。以下查詢適用於瀏覽器：

https://www.googleapis.com/fusiontables/v2/query?sql=SELECT+start_lat+,+dir+FROM+1JUAkUL5H7IhU4QrmLuVQ65Tg2SNyI5Xqm3A7Nk1g+WHERE+dir=%27Northbound%27&key=AIzaSyBCjde_rx_Fe0v4G_vD-uI33M1o9toMF2A。

我真正想要的是能夠使用查詢結果創建Google Fusion Tables圖層對象。看起來最簡單的方法是在初始化Google Fusion Tables圖層對象期間將上述查詢作爲參數提供（如JavaScript FusionTablesLayer API中所示）。然而，FusionTablesLayer會失敗時初始化過程中查詢如下露面：

northbound_hikers_start_layer = new google.maps.FusionTablesLayer({ 
 
    query: { 
 
    select: 'start_lat', 
 
    from: '1JUAkUL5H7IhU4QrmLuVQ65Tg2SNyI5Xqm3A7Nk1g', 
 
    where: "dir = 'Northbound'" 
 
    }, 
 
    heatmap: { 
 
    enabled: true 
 
    }, 
 
    suppressInfoWindows: false 
 
});

我無法理解爲什麼「其中」子句傳遞查詢作爲參數傳遞給FusionTablesLayer會對象時失敗，但Fusion Tables REST API查詢在瀏覽器中正常工作。我已經閱讀了API，但關於這個特定主題的頁面卻令人驚訝地不完整。有任何想法嗎？我希望我可以包含更多指向我正在使用的特定API的鏈接，但是我的StackOverflow聲譽不夠高，無法發佈超過2個網址。最終目標是隻有通過查詢獲得的數據的FusionTablesLayer。

編輯：當我刪除'where'子句（這導致我相信查詢是問題）時知道地圖正確顯示可能會有幫助。我忘了提，我做分配層的地圖如下：

$("button").click(function() { 
 
    console.log(this.id + " button was pressed."); 
 
    if (this.id == "toggle-at-centerline-button") { 
 
    //Toggle AT Centerline Layer 
 
    if (!toggle_at_centerline_button_pressed) { 
 
     centerline_layer.setMap(map); 
 
     toggle_at_centerline_button_pressed = true; 
 
    } else { 
 
     centerline_layer.setMap(null); 
 
     toggle_at_centerline_button_pressed = false; 
 
    } 
 
    } else if (this.id == "toggle-at-shelter-button") { 
 
    //Toggle AT Shelters Layer 
 
    if (!toggle_at_shelter_button_pressed) { 
 
     shelterLayer.setMap(map); 
 
     toggle_at_shelter_button_pressed = true; 
 
    } else { 
 
     shelterLayer.setMap(null); 
 
     toggle_at_shelter_button_pressed = false; 
 
    } etc... 
 
});

Answer 1

你需要設置的FusionTablesLayerOptions（或至少在某些時候將其設置）的map屬性：

var northbound_hikers_start_layer = new google.maps.FusionTablesLayer({ 
    query: { 
    select: 'start_lat', 
    from: '1JUAkUL5H7IhU4QrmLuVQ65Tg2SNyI5Xqm3A7Nk1g', 
    where: "dir = 'Northbound'" 
    }, 
    heatmap: { 
    enabled: true 
    }, 
    suppressInfoWindows: false, 
    map: map 
}); 

proof of concept fiddle

代碼片段：

function initialize() { 
 
    var map = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     center: new google.maps.LatLng(39.232253, -76.640625), 
 
     zoom: 4, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    var northbound_hikers_start_layer = new google.maps.FusionTablesLayer({ 
 
    query: { 
 
     select: 'start_lat', 
 
     from: '1JUAkUL5H7IhU4QrmLuVQ65Tg2SNyI5Xqm3A7Nk1g', 
 
     where: "dir = 'Northbound'" 
 
    }, 
 
    heatmap: { 
 
     enabled: true 
 
    }, 
 
    suppressInfoWindows: false, 
 
    map: map 
 
    }); 
 
} 
 
google.maps.event.addDomListener(window, "load", initialize);

html, 
 
body, 
 
#map_canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map_canvas"></div>