从谷歌地图API获取照片

Question

我想取回谷歌地图 api 的照片并将它们插入 DOM 中。在文档中，根据谁进行编码，可以取回几个地方的照片并将其用作标记

function createPhotoMarker(place) {
var photos = place.photos;
if (!photos) {
return;
}
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location,
title: place.name,
icon: photos[0].getUrl({'maxWidth': 35, 'maxHeight': 35})
});
}

效果很好，你能告诉我如何找到照片并将其插入 DOM 吗？ 我尝试过这样的事情，但他不是好方法：我的测试。对不起，我的英语不好

function callback(results, status) {
if (status === google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
createMarker(results[i]);
restos.push(results[i].name);
// console.log(results[i]);
var btnSuite = document.createElement('button');
createPhoto(results[i]); //photos test !!??
btnSuite.innerHTML = '<b>' + results[i].name +      '</b><br>' + results[i].vicinity + '<br>' + '<img src=' + createPhoto(results[i]) + '/>';
btnSuite.id = 'droiteBtns';
droite2.appendChild(btnSuite);

}
}
}
function createPhoto(place) {
var photos = place.photos;
if (!photos) {
return;
}
var photo = photos[0].getUrl({
'maxWidth': 150,
'maxHeight': 150
})
}

感谢您的帮助

Answer 1

你可以试试这个： http://jsfiddle.net/mervinsamy/m1ejzt7j/

我所做的是创建一个img对象，将图像存储在那里，然后将其添加到现有的div中。

相关网页：

<div class="photos-section" id="img-container"></div>

相关JS：

var img = document.createElement("img") //Create object
img.src = photos[0].getUrl({'maxWidth': 100, 'maxHeight': 100}); //store image url as src attribute
document.getElementById("img-container").appendChild(img);  //add to existing div