angularjs-google-maps icon indicating copy to clipboard operation
angularjs-google-maps copied to clipboard

Integration with Spiderfy doesn't work for custom-marker

Open ericjames opened this issue 9 years ago • 4 comments

https://github.com/jawj/OverlappingMarkerSpiderfier Spiderfy requires me to tell it anytime I add a marker into the app.

I tried the following but it doesn't seem to listen:

   $cope.stops = []; // some array of objects
    NgMap.getMap({
        id: 'map'
    }).then(function(map) {
        $scope.map = map;
        $scope.markers = map.customMarkers;
        $scope.oms = new OverlappingMarkerSpiderfier(map);
        var infoWindow = $scope.map.infoWindows.infoWindow;
        $scope.oms.addListener('click', function(marker, event) {
            console.log("YES?");
          infoWindow.setContent("OMG");
          infoWindow.open(map, marker);
        });

    });

    $scope.$watch('markers', function(old,newMarkers) {
        for (var k in newMarkers) {
            var marker = newMarkers[k];
            $scope.oms.addMarker(marker);
        }
    });

Pretend I'm loading into this directive

                <custom-marker ng-repeat="stop in stops track by stop.id"
                        position="{{::stop.latitude}}, {{::stop.longitude}}">
                </custom-marker>

ericjames avatar Aug 09 '16 17:08 ericjames

Update: I was able to watch the markers, but now Spiderfy doesn't seem to be working, it is passing addMarker to $scope.oms however, clicking on the map doesn't do anything, like the event is not really set.

ericjames avatar Aug 09 '16 18:08 ericjames

It works with regular marker directive!!!!! Looks like custom-marker doesn't seem to separate.

ericjames avatar Aug 09 '16 19:08 ericjames

I see custom-marker is actually an overlay, not a marker https://github.com/allenhwkim/angularjs-google-maps/issues/531

Is it possible to pass class and style. I am trying to put a "label" onto the marker with a number. If I can pass style="content:'{{myvar}}'" to the marker, I can insert it with css using .marker::after { content: inherit; }

ericjames avatar Aug 10 '16 20:08 ericjames

I don't know what Spiderfy is.

I have to say "nice finding about css". All I know custom-marker already has css and it's also dependent on css to show pointer to the position

https://rawgit.com/allenhwkim/angularjs-google-maps/master/testapp/custom-marker.css

You can modify css easily. You can play around here http://plnkr.co/edit/tJ9kBX?p=preview

allenhwkim avatar Aug 11 '16 00:08 allenhwkim