2016-05-10 71 views
1

我正在設置包含某些樹坑位置的社區地圖。地圖可以在這裏找到http://moabiter-baumscheiben.seedbomb.city/map/。我正在使用底圖和cartodb的地圖框來包含樹坑標記的圖層。Cartodb信息窗口未在地圖上顯示變量

我試圖獲得一個自定義信息窗口,但它不會顯示cartobd數據庫中的變量({{img}}{{name}})。

我找不到錯誤。如果有人能幫助我,那會很棒。

我包括所有mapbox和cartodb CSS和JS到<head>

<link href='https://api.tiles.mapbox.com/mapbox.js/v2.2.1/mapbox.css' rel='stylesheet' /> 
<link rel="stylesheet" href="https://cartodb-libs.global.ssl.fastly.net/cartodb.js/v3/3.15/themes/css/cartodb.css" /> 
<script src="https://cartodb-libs.global.ssl.fastly.net/cartodb.js/v3/3.15/cartodb.uncompressed.js"></script> 
<script src='https://api.tiles.mapbox.com/mapbox.js/v2.2.1/mapbox.standalone.js'></script> 

的是信息窗口的腳本:在地圖圖層

<script type="infowindow/html" id="infowindow_template"> 
    <div class="cartodb-popup v2"> 
     <a href="#close" class="cartodb-popup-close-button close">x</a> 
     <div class="cartodb-popup-content-wrapper"> 
      <div class="cartodb-popup-header"> 
       <h1>Baumscheibe</h1> 
      </div> 
      <div class="cartodb-popup-content"> 
       <!-- content.data contains the field info --> 
       <h3>Image:</h3> <img src="{{img}}"> 
       <h3>Gepflegt von: {{name}}</h3> 
      </div> 
     </div> 
     <div class="cartodb-popup-tip-container"></div> 
    </div> 
</script> 

而這個腳本:

<script> 
    L.mapbox.accessToken = 'My MapBox access code'; 

    var southWest = L.latLng(52.510135, 13.284534) 
     , northEast = L.latLng(52.559125, 13.400293) 
     , bounds = L.latLngBounds(southWest, northEast); 

    var map = L.map('map', { 
     center: [52.5279664, 13.32686126] 
     , maxBounds: bounds 
     , zoom: 14 
     , maxZoom: 20 
     , minZoom: 14 
    }); 

    map.fitBounds(bounds); 


    var layers = { 
     Streets: L.mapbox.tileLayer('svpvertex.ml8nijl4') 
     , Imagery: L.mapbox.tileLayer('svpvertex.m0ammo9e') 
    }; 

    layers.Streets.addTo(map); 

    //add cartoDB layer, set z-index so it shows up on top 
    cartodb.createLayer(map, 'My CartoDB access').addTo(map) 
     .on('done', function (layer) { 
      layer.setZIndex(5); 
      // get sublayer 0 and set the infowindow template 
      var sublayer = layer.getSubLayer(0); 

      sublayer.infowindow.set('template', $('#infowindow_template').html()); 
     }).on('error', function() { 
      console.log("some error occurred"); 
     }); 
</script> 

如果有人能夠幫助我,那會很棒!

回答

0

看起來您的交互存在問題。

如果您正在使用編輯器,請記得打開infowindow上需要的字段或設置自定義infowindow,以便全部可用。

如果您使用的是命名圖,請將這些字段添加到模板上的交互性定義中。

相關問題