Code Monkey home page Code Monkey logo

Comments (10)

houqp avatar houqp commented on July 16, 2024

are you referring to the marker cluster plugin?
https://github.com/Leaflet/Leaflet.markercluster

from angular-leaflet-directive.

wpoosanguansit avatar wpoosanguansit commented on July 16, 2024

yes it is.

On Jun 7, 2013, at 2:19 AM, "{Qingping,Dave} Hou" [email protected] wrote:

are you referring to the marker cluster plugin?
https://github.com/Leaflet/Leaflet.markercluster


Reply to this email directly or view it on GitHub.

from angular-leaflet-directive.

houqp avatar houqp commented on July 16, 2024

I see. You take a look at how markers are supported in directive as a reference. Basically you may want to add a new property (maybe markercluster) to directive's scope and bind it to an point array. It should be pretty similar to how marker support is implemented.

from angular-leaflet-directive.

 avatar commented on July 16, 2024

I've done this but my code is too old can't merge:

if (attrs.clustermarkers !== undefined) {
                scope.showuser=function(id){
                    console.log(id);
                }
                var cluster_markers_dict = [];
                var cluster = new L.MarkerClusterGroup();

                var createAndLinkCluster = function(mkey, scope) {
                    var markerData = scope.clustermarkers[mkey];
                    var marker = new L.marker(
                        [markerData.lat, markerData.lng],
                        {
                        }
                    );

                    if (markerData.message) {
                        scope.$watch("clustermarkers." + mkey + ".message", function(newValue) { 
                            marker.bindPopup(markerData.message);
                        });

                        scope.$watch("clustermarkers." + mkey + ".focus", function(newValue) {
                            if (newValue) {
                                marker.openPopup();
                            }
                        });
                    }

                    return marker;
                }; // end of create and link marker

                scope.$watch("clustermarkers", function(newMarkerList) {
                    // find deleted markers

                    for (var delkey in cluster_markers_dict) {
                        if (!scope.clustermarkers[delkey]) {
                            cluster.removeLayer(cluster_markers_dict[delkey]);
                            delete cluster_markers_dict[delkey];
                        }
                    }
                    // add new markers
                    for (var mkey in scope.clustermarkers) {
                        if (cluster_markers_dict[mkey] === undefined) {
                            var marker = createAndLinkCluster(mkey, scope);
                            cluster_markers_dict[mkey] = marker;
                            cluster.addLayer(marker);
                        }
                    } // for mkey in markers
                    if(cluster_markers_dict.length>4)
                    {
                        map.addLayer(cluster);
                    }

                }, true); // watch markers
            } // if attrs.markers

from angular-leaflet-directive.

houqp avatar houqp commented on July 16, 2024

nice! @wpoosanguansit , you can adjust @Steffel 's code and port it to current version of the directive :)

from angular-leaflet-directive.

wpoosanguansit avatar wpoosanguansit commented on July 16, 2024

thank you for your help.

On Jun 8, 2013, at 2:22 AM, "{Qingping,Dave} Hou" [email protected] wrote:

nice! @wpoosanguansit , you can adjust @Steffel 's code and port it to current version of the directive :)


Reply to this email directly or view it on GitHub.

from angular-leaflet-directive.

samcfc avatar samcfc commented on July 16, 2024

does this issue ends up in the master-code?

why just scope and $scope? the sign was escaped or I am not getting a point?

Trying to get it working with a cluster in a service but not yet accomplished :( for the moment.
Watcher on "clustermarkers" is triggered but new markerList stays empty...

from angular-leaflet-directive.

houqp avatar houqp commented on July 16, 2024

it's not in master because no one sent us a pull request yet.

the name is scope because that's the argument name of the call back function. it's just defined in that way, nothing special.

can you show us the code so we can look at it?

from angular-leaflet-directive.

JaumeFigueras avatar JaumeFigueras commented on July 16, 2024

I will send a pull request in a couple of days.
Also there is a problem in the cluster if a marker is moved and has to be removed and added again.

from angular-leaflet-directive.

houqp avatar houqp commented on July 16, 2024

nice, looking forward to your pr, we can look at the problem together afterwards :)

from angular-leaflet-directive.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.