карта таблиц слияния не отображается

Я сохранил этот код в виде 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>

google-fusion-tables
person Daniel Montenegro    schedule 25.04.2012    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Не хватает только кавычек вокруг закодированных идентификаторов таблиц :-)

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 + "'"
    }
  });
}

Я добавил ваш код в jsFiddle с моими исправлениями.

person Odi    schedule 25.04.2012

arrow_upward
0
arrow_downward

Насколько я понимаю, зашифрованные идентификаторы документов применяются только к API Fusion Table, но не к API GMaps для слоев Fusion Table. Посетите свою таблицу через интерфейс FT и выберите «Файл» -> «О программе», где будут отображаться как зашифрованный идентификатор, так и числовой идентификатор. Попробуйте использовать числовой идентификатор вместо зашифрованного идентификатора:

layerl0 = new google.maps.FusionTablesLayer({
        query: {
          select: "'geometry'",
      from: 1x46BzbRzLVz2S4_ml5Nx4oto2930DFrH39TM3uc  // change this to numeric id
    },
person Eric Bridger    schedule 25.04.2012
comment
Это должно работать, но я думаю, что имеет смысл переключиться на encid, если вы используете его где-то еще (например, если вы используете API Fusion Tables и GMaps API). - person Odi; 26.04.2012
comment
Спасибо. Я не знал, что encid поддерживаются в Maps API. - person Eric Bridger; 26.04.2012