Leaflet / Leaflet.draw

Vector drawing and editing plugin for Leaflet
https://leaflet.github.io/Leaflet.draw/docs/leaflet-draw-latest.html
MIT License
1.98k stars 994 forks source link

Hi. I am facing a problem here. When I try to include a new method for L.Draw.Polyline as so below: the event marker.on('move', ...) cant trigger. Anyone face the same problem.? #877

Open tmh12345 opened 6 years ago

tmh12345 commented 6 years ago

How to reproduce

What behaviour I'm expecting and which behaviour I'm seeing

Minimal example reproducing the issue

Using jsfiddle or another example site.

tmh12345 commented 6 years ago
// Auto enable pin handler for drawing if pin option is enabled
L.Draw.Polyline.Pin = {
//L.Draw.Feature.Pin = {
    _pin_initialize: function () {
        if( this.type == 'polyline' ){
            this.on('enabled', this._pin_on_enabled, this);
            this.on('disabled', this._pin_on_disabled, this);
        }
    },

    _pin_on_enabled: function () {
        var mymarker = this._mouseMarker;
        if (!this._pinning) {
            console.log("I am in this_pinnning");
            this._pinning = new L.Handler.MarkerPin(this._map);
        }

        if (this.options.vertices) {
            console.log("I am in vertices");
            this._pinning.options.vertices = this.options.vertices;
        }
        if (this.options.distance) {
            console.log("I am in distance");
            this._pinning.options.distance = this.options.distance;
        }
        this._pinning.enable(mymarker);

        this._mouseClick(mymarker);
        //console.log("done set onclick");
    },
    _mouseClick: function(mymarker){
        mymarker.on('click', this._pin_on_click, this);
    },
    _pin_on_mouse_down: function () {
        //console.log("_pin_on_mouse_down");
        if (this._pinning._closestCircle) {
            this._startLatLng = this._pinning._closestCircle;
        } else if (this._pinning._closest) {
            this._startLatLng = this._pinning._closest.latlng;
        }
    },

    _pin_on_mouse_move: function (e) {
        //console.log("_pin_on_mouse_move");
        var latlng = e.latlng,
            pinLatLng = this._pinning._closest,
            pinCircleLatLng = this._pinning._closestCircle;

        if (pinCircleLatLng) {
            pinLatLng = pinLatLng || {};
            pinLatLng.latlng = pinCircleLatLng;
        }
        if (this._shape) {
            if (this._shape instanceof L.Circle) {
                this._shape.setRadius(this._startLatLng.distanceTo(pinLatLng ? pinLatLng.latlng : latlng));
            } else if (this._shape instanceof L.Rectangle) {
                this._shape.setBounds(new L.LatLngBounds(this._startLatLng, pinLatLng ? pinLatLng.latlng : latlng));
            }
        }

        this._mouseMarker.setLatLng(latlng);
    },

    _pin_on_click: function (e) {
        //console.log("_pin_on_click");
        if (this._markers) {
            var markerAmount = this._markers.length,
                marker = this._markers[markerAmount - 1];
            if (e) {
                marker.setLatLng(e.target._latlng);
                if (this._poly) {
                    var polyPointsAmount = this._poly._latlngs.length;
                    this._poly._latlngs[polyPointsAmount - 1] = e.target._latlng;
                    this._poly.redraw();
                }
            }
        }
    },

    _pin_on_disabled: function () {
        //console.log("_pin_on_disabled");
        if (this.type == 'circle' || this.type == 'rectangle') {
            this._map.off('mousemove', this._pin_on_mouse_move, this);
            this._map.off('mousedown', this._pin_on_mouse_down, this);
            this._map.removeLayer(this._mouseMarker);
        }
        delete this._pinning;
    }
};
L.Draw.Polyline.include( L.Draw.Polyline.Pin );
L.Draw.Polyline.addInitHook( '_pin_initialize' );
tmh12345 commented 6 years ago

When I try to command this statement It work fine for me. This method under L.Draw.Polyline _onTouch: function (t) { var e, i, o = t.originalEvent; //!o.touches || !o.touches[0] || this._clickHandled || this._touchHandled || this._disableMarkers || (e = o.touches[0].clientX, i = o.touches[0].clientY, this._disableNewMarkers(), this._touchHandled = !0, this._startPoint.call(this, e, i), this._endPoint.call(this, e, i, t), this._touchHandled = null), //this._clickHandled = null },