1

在这里,我创建了一个代码,它将在地图和侧边栏中显示来自 google places api 的地点。

但我不知道如何在侧边栏中显示没有照片的地方并显示有关此的信息

看这个: http: //jsbin.com/umaruq/1,所以当我在地图上输入“bars”时会显示所有的条形图,但是在侧边栏中我无法得到没有照片的条形图

源代码: http: //jsbin.com/umaruq/1/edit演示:http: //jsbin.com/umaruq/1

我认为这是这段代码中的问题:

 $("#side_bar").empty();
      for (var i = 0, place; place = places[i]; i++) {
        if (place.photos) {
          markers.push(new PhotoMarker(place, map, modalWindow));
          setLink(i);              
        bounds.extend(place.geometry.location);
        } else {
          markers.push(new google.maps.Marker({
            position: place.geometry.location,
            map: map,
            icon: new google.maps.MarkerImage(
                'http://carsedia.com/code/voyage/icons/7.png',
                null, null, new google.maps.Point(3.5,3.5)),
            clickable: false
          }));
        } 
      }

我尝试过: if (place.name)但有错误

有没有办法解决这个问题并在侧边栏中显示所有地方(有照片和没有照片)?

4

1 回答 1

1

仅当您有照片时才放置链接。您可以尝试以下方法:

  for (var i = 0, place; place = places[i]; i++) {
    if (place.photos) {
      markers.push(new PhotoMarker(place, map, modalWindow));
      setLink(i, true);              
    bounds.extend(place.geometry.location);
    } else {
      markers.push(new google.maps.Marker({
        position: place.geometry.location,
        map: map,
        icon: new google.maps.MarkerImage(
            'http://carsedia.com/code/voyage/icons/7.png',
            null, null, new google.maps.Point(3.5,3.5)),
        clickable: false
      }));
      /* if no photo, put false as 2nd argument */
      setLink(i, false);              
    } 
  }

并编辑您的“setLink”功能:

function setLink(i, has_photo) {
    var photo = has_photo ? place.photos[0].getUrl({ 'maxWidth': 50, 'maxHeight': 50 }) : 'http://carsedia.com/code/voyage/icons/7.png';
    var sideClick = jQuery("<a class=side_click href='#'></a>");
    $(sideClick).html(place.name+place.opening_hours);
    $("#side_bar").append(sideClick).append("<br>").append("<div class='draggable'><img src="+photo+" style='width:50px'></img></div><br><p></p>");
    $(sideClick).on("click", function() {
        markers[i].modalWindow_.getDetails(markers[i].place_);
    });
 }

看:http: //jsbin.com/umaruq/3

于 2013-08-12T12:44:51.593 回答