Я настраиваю карту сообщества, которая включает в себя расположение некоторых дров. Карту можно найти здесь http://moabiter-baumscheiben.seedbomb.city/map/. Я использую mapbox для basemap и cartodb для включения слоя с метками древовидной ямы.Информационное окно Cartodb, не отображающее переменные на карте
Мне удалось создать пользовательское информационное окно, но оно не отображает переменные ({{img}}
и {{name}}
) из моей базы данных cartobd.
Я не могу найти ошибку. Было бы здорово, если бы кто-нибудь мог мне помочь.
Я включил все 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>
Было бы здорово, если бы кто-нибудь мог мне помочь!