角谷歌地图标签重叠图标

Question

所以我创建了角谷歌地图库，其中包括markerswithlabels目录和标签覆盖的图标，所以你可以看到另一个图标上的另一个标签与标签。现在我wan't这个标签和图标背后隐藏所以它只能显示一个文本，

我创建了一个代码用笔说明我的意思： 这是我设置的标签：

options: { 
     labelContent : dist + '<br />Overlapse', 
     labelAnchor: "16 33", 
     labelClass: 'labelClass', 
     labelStyle: {opacity: 0.75}, 
     labelInBackground: true 
    }, 

这告诉标记目录用户markerswithlabels：

<google-map ng-if="showloadedmap" center="map.center" draggable="true" maxZoom="map.maxZoom" 
     minZoom="map.minZoom" zoom="map.zoom" options="map.options" events="map.events"> 
     <markers models="map.markers" 
     doCluster="true" 
     coords="'self'" 
     icon="'icon'" 
     click="'onclicked'" 
        options="'options'" 
        idkey='id' 
     clusterOptions='map.clusterOptions' 
     isLabel='true'>  
     </markers> 

    </google-map> 

这里是codepen example

Answer 1

我固定它像这样为未来的读者：

//1x1 img which is overlapsed by label 
    var iconimg = { 
     url: 'img/markers/'+value[8], // url 
     scaledSize: new google.maps.Size(1, 1), // size 
    }; 
    //icon as background image 
    var newstyle = { 
     'background-image':'url("img/markers/'+value[8]+'")', 
     'background-size': '36.5px 61px', 
     'background-position': 'top left', 
     'background-repeat': 'no-repeat' 
    } 


$scope.map.markers.push({ 
    id: value[3], 
    latitude: angular.fromJson(value[1]), 
    longitude: angular.fromJson(value[2]), 
    icon: iconimg, 
    title : value[0], 
    options: { 
     labelContent : dist + '<br />'+$filter('date')(date,'d-M'), 
     labelAnchor: "36 61", 
     labelClass: 'labelClass', 
     labelStyle: newstyle, 
     labelInBackground: false 
    } 
}); 

的labelclass CSS的内容

.labelClass { 
    padding-top:29px; 
    padding-left:2px; 
    color:#000; 
    font-family: 'open_sansregular'; 
    height:61px; 
    width:37px; 
    font-size:9px; 
    line-height: 12px; 
}