フュージョンテーブルマップが表示されません

このコードをhtmlファイルとして保存しましたが、マップを視覚化できません。私はFusionTablesLayer Wizard 2.0から直接コードを取得しました。コードに何か問題がありますか？私はそれが「使う準備ができている」と思った。助けが必要です！フュージョンテーブルマップが表示されません

<!DOCTYPE html> 
<html> 
    <head> 
    <style> 
    #map-canvas { width:500px; height:400px; } 
    </style> 
    <script type="text/javascript" 
    src="http://maps.google.com/maps/api/js?sensor=false"> 
    </script> 
    <script type="text/javascript"> 
    var map; 
    var layerl0; 
    function initialize() { 
     map = new google.maps.Map(document.getElementById('map-canvas'), { 
     center: new google.maps.LatLng(0, 0), 
     zoom: 1, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 
     layerl0 = new google.maps.FusionTablesLayer({ 
     query: { 
      select: "'geometry'", 
     from: 1x46BzbRzLVz2S4_ml5Nx4oto2930DFrH39TM3uc 
    }, 
    map: map 
    }); 
} 
function changeMapl0() { 
    var searchString = document.getElementById('search-string-l0').value.replace(/'/g, "\\'"); 
    layerl0.setOptions({ 
    query: { 
     select: "'geometry'", 
     from: 1x46BzbRzLVz2S4_ml5Nx4oto2930DFrH39TM3uc, 
     where: "'NOME' = '" + searchString + "'" 
    } 
    }); 
} 
google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body> 
    <div id="map-canvas"></div> 
    <div style="margin-top: 10px;"> 
     <label>Escolha a cidade</label> 
     <select id="search-string-l0" onchange="changeMapl0(this.value);"> 
     <option value="">--Select--</option> 
    <option value="ALVORADA">ALVORADA</option> 
    <option value="ARARICA">ARARICA</option> 
    <option value="ARROIO DOS RATOS">ARROIO DOS RATOS</option> 
    <option value="CACHOEIRINHA">CACHOEIRINHA</option> 
    <option value="CAMPO BOM">CAMPO BOM</option> 
    <option value="CANOAS">CANOAS</option> 
    <option value="CAPELA DE SANTANA">CAPELA DE SANTANA</option> 
    <option value="CHARQUEADAS">CHARQUEADAS</option> 
    <option value="DOIS IRMAOS">DOIS IRMAOS</option> 
    <option value="ELDORADO DO SUL">ELDORADO DO SUL</option> 
    <option value="ESTANCIA VELHA">ESTANCIA VELHA</option> 
    <option value="ESTEIO">ESTEIO</option> 
    <option value="GLORINHA">GLORINHA</option> 
    <option value="GRAVATAI">GRAVATAI</option> 
    <option value="GUAIBA">GUAIBA</option> 
    <option value="IVOTI">IVOTI</option> 
    <option value="MONTENEGRO">MONTENEGRO</option> 
    <option value="NOVA HARTZ">NOVA HARTZ</option> 
    <option value="NOVA SANTA RITA">NOVA SANTA RITA</option> 
    <option value="NOVO HAMBURGO">NOVO HAMBURGO</option> 
    <option value="PAROBE">PAROBE</option> 
    <option value="PORTAO">PORTAO</option> 
    <option value="PORTO ALEGRE">PORTO ALEGRE</option> 
    <option value="ROLANTE">ROLANTE</option> 
    <option value="SANTO ANTONIO DA PATRULHA">SANTO ANTONIO DA PATRULHA</option> 
    <option value="SAO JERONIMO">SAO JERONIMO</option> 
    <option value="SAO LEOPOLDO">SAO LEOPOLDO</option> 
    <option value="SAPIRANGA">SAPIRANGA</option> 
    <option value="SAPUCAIA DO SUL">SAPUCAIA DO SUL</option> 
    <option value="TAQUARA">TAQUARA</option> 
    <option value="TRIUNFO">TRIUNFO</option> 
    <option value="VIAMAO">VIAMAO</option> 
    </select> 
</div> 
    </body> 
    </html>

出典

2012-04-25 Daniel Montenegro

唯一欠けているものは、エンコードされたテーブルのidの前後に引用符は、私はjsFiddle with my correctionであなたのコードを入れ

function initialize() { 
     map = new google.maps.Map(document.getElementById('map-canvas'), { 
     center: new google.maps.LatLng(0, 0), 
     zoom: 1, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 
     layerl0 = new google.maps.FusionTablesLayer({ 
     query: { 
      select: "'geometry'", 
     from: "1x46BzbRzLVz2S4_ml5Nx4oto2930DFrH39TM3uc" 
    }, 
    map: map 
    }); 
} 

function changeMapl0() { 
    var searchString = document.getElementById('search-string-l0').value.replace(/'/g, "\\'"); 
    layerl0.setOptions({ 
    query: { 
     select: "'geometry'", 
     from: "1x46BzbRzLVz2S4_ml5Nx4oto2930DFrH39TM3uc", 
     where: "'NOME' = '" + searchString + "'" 
    } 
    }); 
}

:-)です。

出典

2012-04-25 23:05:29 Odi

私の理解では、暗号化されたドキュメントIDはFusion Table APIにのみ適用されますが、Fusion Tableレイヤー用のGMaps APIには適用されません。 FTのUIであなたのテーブルにアクセスし、File - > Aboutを選択すると、暗号化されたIDと数値IDの両方が表示されます。代わりに、暗号化されたIDの数値IDを使用してみてください：これは動作するはず

layerl0 = new google.maps.FusionTablesLayer({ 
     query: { 
      select: "'geometry'", 
     from: 1x46BzbRzLVz2S4_ml5Nx4oto2930DFrH39TM3uc // change this to numeric id 
    },

出典

2012-04-25 23:09:51

、私はそれはあなたがどこかにそれを使用する場合encidに切り替えることが理にかなっていると思います（つまり、あなたはフュージョンテーブルAPI _and_ GMapsのAPIを使用している場合）。 – Odi

ありがとうございます。私は、encidがMaps APIでサポートされていることを認識していませんでした –

フュージョンテーブルマップが表示されません

答えて

関連する問題