如果没有在Leaflet中填写文本,如何在弹出窗口中显示文本?

时间:2016-07-26 13:12:30

标签: dictionary popup leaflet

如果变量不可用,我不想在弹出窗口中显示变量。例如,有时"大学"或" title"或" city"或"州"并不总是被填满。因此,我希望找到一种方法,在弹出窗口时不显示丢失的变量。谢谢你的帮助。

var a = addressPoints[i];
        var title = a[2];
        var univ = a[3];
        var city = a[4];
        var state = a[5];

       var marker = new L.Marker(new L.LatLng(a[0], a[1]), { title: title } );

        var content = "<ul><li>title: "+title+"</li> <li>University: "+ univ +"  <li>City: " + direct +"<li></li></ul>";                
        marker.bindPopup(content);
        markers.addLayer(marker);
    }

2 个答案:

答案 0 :(得分:1)

这是在不使用jQuery库的情况下重写Muzzafar的答案。而只需使用Leaflet自己的create类中包含的DomUtil方法:

create( <String> tagName, <String> className, <HTMLElement> container? )
  

使用tagName创建一个元素,设置className,并可选择将其附加到容器元素。

http://leafletjs.com/reference.html#domutil-create

var map = new L.Map('leaflet', {
    'center': [0, 0],
    'zoom': 0,
    'layers': [
        new L.TileLayer('//{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
            'attribution': '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
        })
    ]
});

// Create ul
var content = L.DomUtil.create('ul', 'my-list');

var title = 'My Title';

var university = 'My University';

// Check if title is set
if (title != '') {

    // Is set so create li and append to content ul
    var titleItem = L.DomUtil.create('li', 'my-list-item', content);

    // Add text to li node
    titleItem.textContent = 'Title: ' + title;
}

// Check if university is set
if (university != '') {

    // Is set so create li and append to content ul
    var universityItem = L.DomUtil.create('li', 'my-list-item', content);

    // Add text to li node
    universityItem.textContent = 'University: ' + university;
}

// Create marker
var marker = new L.Marker([0,0]).addTo(map);

// Bind popup with content
marker.bindPopup(content);
body {
    margin: 0;
}

html, body, #leaflet {
    height: 100%;
}
<!DOCTYPE html>
<html>

  <head>
    <title>Leaflet 0.7.7</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link type="text/css" rel="stylesheet" href="//npmcdn.com/leaflet@0.7.7/dist/leaflet.css" />
  </head>

  <body>
    <div id="leaflet"></div>
    <script type="application/javascript" src="//npmcdn.com/leaflet@0.7.7/dist/leaflet.js"></script>
</script>
  </body>

</html>

答案 1 :(得分:0)

您可以像这样填充_, err2 := NewConfig(os.Open, testDecoderFact) if err2 != nil { fmt.Fprintf(os.Stderr, "something bad happened: %v\n", err2) } 变量

content