Google Maps JavaScript API與Fusion Tables - 如何獲得自定義信息窗口

我有一個類似的問題this post，但我不知道他們從哪裏得到templateId。我還沒有設法抑制默認的信息窗口（即使我認爲我把正確的代碼），我不知道如何讓我的自定義信息窗口從我的融合表顯示出來。從這個其他人的代碼，它看起來像我需要指定一個templateId，所以API知道如何格式化窗口。現在我有以下代碼來初始化地圖。Google Maps JavaScript API與Fusion Tables - 如何獲得自定義信息窗口

 //CREATE AN INSTANCE OF A GOOGLE MAP 
     map = new google.maps.Map(document.getElementById('map'), { 
      //MAP BASED ON FOLLOWING CONTROLS AND THEIR OPTIONS 
      center: {lat:33.746828, lng:-118.299448}, 
      zoom: 13, 
      rotateControl: true, 
      scaleControl: true, 
      mapTypeControl: true, 
      mapTypeControlOptions: { 
      style: google.maps.MapTypeControlStyle.DROPDOWN_MENU, 
      position: google.maps.ControlPosition.TOP_LEFT, 
      mapTypeIds: ['roadmap', 'satellite', 'hybrid', 'terrain', 
        'styled_map'] 
      }, 
      streetViewControl: true, 
       streetViewControlOptions: { 
       position: google.maps.ControlPosition.LEFT_TOP}, 
      zoomControl: true, 
       zoomControlOptions: { 
       position: google.maps.ControlPosition.LEFT_TOP}, 
      fullscreenControl: true, 
       fullscreenControlOptions: { 
       position: google.maps.ControlPosition.TOP_LEFT} 
    }); 
    var infoWindow = new google.maps.InfoWindow(); 
    //CALL INSTANCE OF NEW LAYER ADDING IN MY FUSION TABLE 
     var layer = new google.maps.FusionTablesLayer({ 
    //BASED ON A QUERY TO THE FUSION DATA AND DEFINING COORDINATES 
    query: { 
     select: "Location", 
     from: '1h7ZlgimMOBfutZ2dLspShafWRnNE2TlNmQgVPb1T' 
    }, 
      styles: [{ 
    markerOptions: { 
    iconName: "measle_turquoise"}} 
        ], 
suppressInfoWindows: true 

    }); 
    google.maps.event.addListener(layer, 'click', function(e) {windowControl(e, infoWindow, map); 
      }); 
    function windowControl(e, infoWindow, map) { 
      infoWindow.setOptions({ 
       content: e.infoWindowHtml, 
       position: e.latLng, 
       pixelOffset: e.pixelOffset 
      }); 
      infoWindow.open(map); 
     } 
    layer.setMap(map); 

     //ADD MY CUSTOM STYLE TO THE LIST OF MAP TYPES AND SET IT TO ACTIVE 
     map.mapTypes.set('styled_map', styledMapType); 
     map.setMapTypeId('styled_map');

對不起，它的很多代碼。我的主要問題是我如何找到這個templateId，我是否缺少其他的東西，我需要讓我的自定義信息窗口顯示在點擊標記上？謝謝。

來源

2017-06-12 benjaminadk

我發現它，但我會留下它，因爲它不是那麼明顯。可在您的Fusion Table內找到templateId和styleId值。從Fusion Tables內部進入工具 - >發佈。現在激活下拉式爲「Get Html and Javascript」。在這裏你會找到它們。我爲我的媽媽製作了不同風格的自定義地圖，並且我使用了各種服務，所以它提供的代碼與我的代碼不同，但templateId和styleId仍然有效。現在我只需要讓我的自定義樣式不那麼難看....我也想知道它爲什麼不默認顯示自定義樣式。如果您要在FusionTableLayer中引入自定義數據，爲什麼不在信息窗口中呢？我確定有一個簡單的答案，可能與我的更復雜的地圖（包含更多圖層）有關，但我不太明白。

太讓你自定義信息窗口只需插入你在圖層中找到的值。對於我的地圖，我把它們放在

iconName: "measle_turquoise"}} 
        ],

和繁榮我有我的自定義信息窗口！希望這可以幫助。 my ugly info windows 我試圖嵌入圖像，但沒有足夠的slackoverflow點，但我猜

來源

2017-06-13 00:05:37 benjaminadk

Google Maps JavaScript API與Fusion Tables - 如何獲得自定義信息窗口

回答

相關問題