Неправильный URL-адрес при добавлении изображений в mapbox Popup

Question

Сегодня я пытаюсь найти способ вставить свойство изображения во всплывающее окно mapbox.Поэтому, выполнив поиск по сайту, я нашел способ добавить это свойство во всплывающее окно, но по неизвестной причине получился результат:

http://2.bp.blogspot.com/-uitX7ROPtTU/Tyv-G4NA_uI/AAAAAAAAFBY/NcWLPVnYEnU/s1600/no+image.jpg/

вместо http://2.bp.blogspot.com/-uitX7ROPtTU/Tyv-G4NA_uI/AAAAAAAAFBY/NcWLPVnYEnU/s1600/no+image.jpg.

Таким образом, / в конце URL-адреса изображения является причиной для создания не найденного изображения.Знаете почему?

<script>
mapboxgl.accessToken = &#39;........&#39;;

var map = new mapboxgl.Map({
container: &#39;map&#39;,
style: &#39;mapbox://styles/mapbox/streets-v11&#39;,
center: [25.147437, 37.548452],
zoom: 9.5
});

// Add zoom and rotation controls to the map.
map.addControl(new mapboxgl.NavigationControl());


map.on(&#39;load&#39;, function () {

var location = document.getElementById(&quot;1234&quot;).innerText;
var locations= eval(&#39;[&#39;+location+&#39;];&#39;);
// Add a layer showing the places.
map.addLayer({
&quot;id&quot;: &quot;places&quot;,
&quot;type&quot;: &quot;symbol&quot;,
&quot;source&quot;: {&quot;type&quot;: &quot;geojson&quot;,&quot;data&quot;: {&quot;type&quot;: &quot;FeatureCollection&quot;,&quot;features&quot;: locations}},&quot;layout&quot;: {&quot;icon-image&quot;: &quot;{icon}-15&quot;,&quot;icon-allow-overlap&quot;: true}});

// When a click event occurs on a feature in the places layer, open a popup at the
// location of the feature, with description HTML from its properties.
map.on(&#39;click&#39;, &#39;places&#39;, function (e) {
var coordinates = e.features[0].geometry.coordinates.slice();

// Ensure that if the map is zoomed out such that multiple
// copies of the feature are visible, the popup appears
// over the copy being pointed to.
while (Math.abs(e.lngLat.lng - coordinates[0]) &gt; 180) {
coordinates[0] += e.lngLat.lng &gt; coordinates[0] ? 360 : -360;
}

new mapboxgl.Popup()
.setLngLat(coordinates)
.setHTML('<b>'+ e.features[0].properties.title + '</b>' + e.features[0].properties.description + '<p><img src='+e.features[0].properties.image+'></img></p>')
.addTo(map);

});

// Change the cursor to a pointer when the mouse is over the places layer.
map.on(&#39;mouseenter&#39;, &#39;places&#39;, function () {
map.getCanvas().style.cursor = &#39;pointer&#39;;
});

// Change it back to a pointer when it leaves.
map.on(&#39;mouseleave&#39;, &#39;places&#39;, function () {
map.getCanvas().style.cursor = &#39;&#39;;
});
});

</script>

Answer 1

Хорошо, я должен был изменить

<img src='+e.features[0].properties.image+'></img>

со следующим кодом:

<img src="'+e.features[0].properties.image+'"/>