Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Different rotation origin #53

Open
aczopekkontaktio opened this issue Jul 23, 2019 · 3 comments
Open

Different rotation origin #53

aczopekkontaktio opened this issue Jul 23, 2019 · 3 comments

Comments

@aczopekkontaktio
Copy link

Hello, I very like your profile. However, I have case when I need to rotate my polygon where pivot is not center of polygon but bottom-left corner. So, I have overriden _getRotationOrigin method. Looks like this

_getRotationOrigin: function() { return this._rect._latlngs[0][0]; },

For me this is perfect. However, when I am rotating then preview matrix looks perfect. Unfortunately, after finishing rotation (_onrotateend) my polygon has been rotated but pivot is around mid again, looks different than on preview. What should I change yet to make this rotation origin adequate at the end? I was figthing with it around 2 days and still can do nothing...

@torx85
Copy link

torx85 commented Feb 18, 2020

I ran into the same issue. After some debugging, it seems there are 2 variables set to determine the origin: _rotationOriginPt and _rotationOrigin. The latter one is set in _createRotationHandlers() to the center again. If instead you assign the result of this._getRotationOrigin() to this variable, the polygon would stay at the correct position (with some minor deviations).

@mRamzii
Copy link

mRamzii commented Jun 24, 2020

As mentionned by @torx85, when replacing the _rotationOrigin also in the this._getRotationOrigin() function, it works !

@av-jeroen
Copy link

Just providing a quick code example here for other people who would like to rotate around a different point. This code transforms a given rectangle around it's bottom left point. It is a hack, but workable.

      const crds = [
        [52, 5],
        [52.1, 5.1],
      ]
      const polygon = L.rectangle(crds, { transform: true }).addTo(this.missionLayer)
      polygon.transform.enable({ rotation: true, scaling: false })
      // Override center of rotation https://github.com/w8r/Leaflet.Path.Transform/issues/53
      polygon.transform._rotationOrigin = new L.LatLng(crds[0][0], crds[0][1])
      polygon.transform._rotationOriginPt = new L.LatLng(crds[0][0], crds[0][1])
      polygon.transform._getRotationOrigin = function () {
        return new L.LatLng(crds[0][0], crds[0][1])
      }
      polygon.on('rotateend', (e) => {
        polygon.transform._rotationOrigin = new L.LatLng(crds[0][0], crds[0][1])
      })

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants