angular-google-maps labels overlapse icons
I fixed it like this for future readers:
//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 } });
Content of the 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;}