【问题标题】:Angular google maps: put image in Info windowAngular 谷歌地图:将图像放在信息窗口中
【发布时间】:2016-07-20 16:33:04
【问题描述】:

我使用 google maps api angular (https://angular-ui.github.io/angular-google-maps/#!/api/windows) 来显示带有标记的地图。标记点的标签带有几段和一张图片。

段落内容正确显示,但图像不正确。它的网址是正确的。可以加图片吗?

一些代码: HTML

    <ui-gmap-google-map center='datos.mapa.center' options="datos.mapa.opciones" zoom='datos.mapa.zoom'>
        <ui-gmap-marker coords="datos.marker_club.coords" 
                        options="datos.marker_club.options" 
                        idkey="datos.marker_club.id"
                        click="markerClick" >
            <ui-gmap-window show="datos.marker_club.show"  
                closeClick="markerClose(marker)" >
                <div><img class="mapa_escudo" scr="{{datos.escudo}}" width="32" height="32" />{{datos.club}}<br />Sede {{datos.sede}}</div>
            </ui-gmap-windows>
        </ui-gmap-marker>
    </ui-gmap-google-map>

JS

    $scope.datos.club               = 'Club';
    $scope.datos.sede               = 'Sede';
    $scope.datos.escudo             = 'http://www.server.com/image.png';
      uiGmapGoogleMapApi.then(function(maps) {
              $scope.datos.mapa           = { center: { latitude: latitud, longitude: longitud }, zoom: zoom };
              $scope.datos.mapa.opciones  = { scrollwheel: true };        

              var icon = "http://maps.google.com/mapfiles/ms/icons/orange-dot.png";
          $scope.datos.marker_club = {    id: 1,
                                          coords: { latitude: latitud, longitude: longitud},
                                          options:{ 
                                                  draggable: false, 
                                                  icon: new google.maps.MarkerImage(icon),
                                          },
              };      $scope.markerClick = function(marker, eventName, model) {
    $scope.datos.marker_club.show = !$scope.datos.marker_club.show;
};

$scope.markerClose = function(marker) {
   $scope.datos.marker.show = false;
};

【问题讨论】:

    标签: javascript angularjs google-maps google-maps-api-3


    【解决方案1】:

    抱歉,只是图片定义中缺少“ng-src”!

    【讨论】:

      猜你喜欢
      • 2015-04-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-07-10
      • 2013-05-18
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多