Угловой пользовательский маркер Google Maps

Мне трудно получить значок пользовательского маркера для работы с настройками моих карт Google. Мне просто нужен один маркер для широты и долготы, которые я передаю с моей фабрикой. Мне не нужны несколько маркеров.

Внутри моего контроллера:

var mapOptions = {
    panControl    : true,
    zoomControl   : true,
    scaleControl  : true,
    mapTypeControl: true,
    mapTypeId     : google.maps.MapTypeId.ROADMAP
};
$scope.map = ($scope,{
    center: {
        latitude: $scope.lat,
        longitude: $scope.long
    },
    zoom: 13,
    options: mapOptions,
    icon: '{url:"https://vacationcandy.com/assets/images/lollipin.png"}',
});
$scope.beachMarker = new google.maps.Marker({
    position: $scope.map.center,
    map: $scope.map,
    icon: '{url:"https://vacationcandy.com/assets/images/lollipin.png"}'
});
var updateCenter = function() {
    $scope.map.center.latitude= $scope.lat;
    $scope.map.center.longitude= $scope.long;
}
$scope.$watch('lat', function() {
    updateCenter();
});

Вот мой HTML:

<ui-gmap-google-map center='map.center' zoom='map.zoom' id='map-canvas' icon='"beachMarker.icon"'></ui-gmap-google-map>

Я пробовал кучу разных вещей, даже используя указатель google-маркер в карте ui-gmap-google, но я не могу заставить его работать. Что я делаю не так?