rotation of map and contents to x degress. #268

Closed
coomsie opened this Issue Aug 29, 2011 · 64 comments

Comments

Projects
None yet
@coomsie

coomsie commented Aug 29, 2011

Hi,

I have been using this on the iphone as a great mapping api for offline maps ... it rocks ...

I'm keen to extend the library to allow a method to be called to do a transformation of the map and it's contents (using the power of webkit ) to point north (assuming the user is using a phone with a compass api) ... i.e.

-webkit-transform: rotate(12deg);

can someone point me in the right direction where i should start ... or if this is a future feature ...

Cheers
coomsie

p.s. sorry if this is the wrong place to place new features requests ...

@mourner

This comment has been minimized.

Show comment
Hide comment
@mourner

mourner Aug 29, 2011

Member

It's not as easy as it sounds - besides the rotation itself, you need to extend all the projection logic for all events to work with rotated maps correctly, extend touch logic to allow rotation with fingers, change the tile loading algorithm (it will become more complex in rotated case than just a requesting rectangle of tiles), and many other nuances.

I thought about that myself and at that time I came to conclusion that this feature isn't worth all the code overhead and complexity. It's nice to toy with but still rarely very practical.

Member

mourner commented Aug 29, 2011

It's not as easy as it sounds - besides the rotation itself, you need to extend all the projection logic for all events to work with rotated maps correctly, extend touch logic to allow rotation with fingers, change the tile loading algorithm (it will become more complex in rotated case than just a requesting rectangle of tiles), and many other nuances.

I thought about that myself and at that time I came to conclusion that this feature isn't worth all the code overhead and complexity. It's nice to toy with but still rarely very practical.

@mourner mourner closed this Aug 29, 2011

@coomsie

This comment has been minimized.

Show comment
Hide comment
@coomsie

coomsie Sep 2, 2011

thanks for the comments .... appreciate it,

i'll mark it down as something to do later then ...

i've created an extension for the tile layer that allows the tiles to come from the web database .... works well on the iphone + titanium/phonegap ... i'll tidy it up and then send a pull request .... (the js will no doubt need tidying up though - i'm not an expert in that field yet)

:p

coomsie commented Sep 2, 2011

thanks for the comments .... appreciate it,

i'll mark it down as something to do later then ...

i've created an extension for the tile layer that allows the tiles to come from the web database .... works well on the iphone + titanium/phonegap ... i'll tidy it up and then send a pull request .... (the js will no doubt need tidying up though - i'm not an expert in that field yet)

:p

@yoavrofe

This comment has been minimized.

Show comment
Hide comment
@yoavrofe

yoavrofe Dec 15, 2011

I'ts not so hard as it looks. Map rotation can be a graet thing when working with PhoneGap. as a test, just add the following the the CSS:

"-webkit-transform: rotate(30deg);"

This will show you the rotated map. Markers and tiles seam to work, but the canvas shoukd be expanded so it's a rectangular area with the size of the diagonal.

I'ts not so hard as it looks. Map rotation can be a graet thing when working with PhoneGap. as a test, just add the following the the CSS:

"-webkit-transform: rotate(30deg);"

This will show you the rotated map. Markers and tiles seam to work, but the canvas shoukd be expanded so it's a rectangular area with the size of the diagonal.

@mourner

This comment has been minimized.

Show comment
Hide comment
@mourner

mourner Dec 15, 2011

Member

It's not so simple as it looks either. :) You need to transform all mouse and touch events correctly according to rotation, you need to make it work with non-rotated markers and popups, you need to write completely different algorithms for detecting current geographical bounds, detecting tiles to load, different polygon and polyline clipping algorithms, etc. etc. etc.

Member

mourner commented Dec 15, 2011

It's not so simple as it looks either. :) You need to transform all mouse and touch events correctly according to rotation, you need to make it work with non-rotated markers and popups, you need to write completely different algorithms for detecting current geographical bounds, detecting tiles to load, different polygon and polyline clipping algorithms, etc. etc. etc.

@yoavrofe

This comment has been minimized.

Show comment
Hide comment
@yoavrofe

yoavrofe Dec 15, 2011

I tried it with the first example. It looks like the tiles are loaded correctly, but the mouse events should be changed, as well as the popups. The vector layers are placed correctly, but the marker image if rotated, of course.

I tried it with the first example. It looks like the tiles are loaded correctly, but the mouse events should be changed, as well as the popups. The vector layers are placed correctly, but the marker image if rotated, of course.

@yoavrofe

This comment has been minimized.

Show comment
Hide comment
@yoavrofe

yoavrofe Feb 2, 2012

mourner, could you please advise me how to change the size and position of the map pane div? If I want to rotate the map, I must have a map that's larger then the real size so that no blank space is left on the courners. Could you direct me to the function responsible for the div size?

Thanks!

yoavrofe commented Feb 2, 2012

mourner, could you please advise me how to change the size and position of the map pane div? If I want to rotate the map, I must have a map that's larger then the real size so that no blank space is left on the courners. Could you direct me to the function responsible for the div size?

Thanks!

@jerroydmoore

This comment has been minimized.

Show comment
Hide comment
@jerroydmoore

jerroydmoore Dec 21, 2013

it looks like this isn't going to be included in leafletjs anytime soon, I guess, huh? haha

it looks like this isn't going to be included in leafletjs anytime soon, I guess, huh? haha

@colllin

This comment has been minimized.

Show comment
Hide comment
@colllin

colllin Mar 4, 2014

I think this feature is becoming more of a need-to-have than a nice-to-have. Common mapping applications now offer rotation, so users are starting to expect it. It's been added to my product roadmap whether it's on leaflet's or not.

Can we reconsider the map rotation feature? What would it take to build it, and what are the considerations?

colllin commented Mar 4, 2014

I think this feature is becoming more of a need-to-have than a nice-to-have. Common mapping applications now offer rotation, so users are starting to expect it. It's been added to my product roadmap whether it's on leaflet's or not.

Can we reconsider the map rotation feature? What would it take to build it, and what are the considerations?

@mh166

This comment has been minimized.

Show comment
Hide comment
@mh166

mh166 Mar 5, 2014

I can +1 here. I do need rotation for my application, too. I just made the change from ol3 to Leaflet / Mapbox.js because it is much easier to comprehend and does a lot of the stuff I want and need in just the way I thought it has to work. So it's very intuitive, thanks for that!
But if you could add rotation support it would be fantastic!

mh166 commented Mar 5, 2014

I can +1 here. I do need rotation for my application, too. I just made the change from ol3 to Leaflet / Mapbox.js because it is much easier to comprehend and does a lot of the stuff I want and need in just the way I thought it has to work. So it's very intuitive, thanks for that!
But if you could add rotation support it would be fantastic!

@bnroths

This comment has been minimized.

Show comment
Hide comment
@bnroths

bnroths Mar 5, 2014

me too, I could have used this feature recently too. It'd be awesome!

bnroths commented Mar 5, 2014

me too, I could have used this feature recently too. It'd be awesome!

@cgwyllie

This comment has been minimized.

Show comment
Hide comment
@cgwyllie

cgwyllie Mar 18, 2014

+1 for me, being able to use the device orientation API to align the map with a mobile user would be brilliant!

+1 for me, being able to use the device orientation API to align the map with a mobile user would be brilliant!

@krnlde

This comment has been minimized.

Show comment
Hide comment

krnlde commented Apr 6, 2014

+1

@mrcfhr

This comment has been minimized.

Show comment
Hide comment
@mrcfhr

mrcfhr Apr 23, 2014

wouldn't it be enough if the marker would change it's rotation with the device motion data you get from your phone in html5? so you could at least see where you stand - and in which direction you're looking right when you turn your device.

mrcfhr commented Apr 23, 2014

wouldn't it be enough if the marker would change it's rotation with the device motion data you get from your phone in html5? so you could at least see where you stand - and in which direction you're looking right when you turn your device.

@hokkos

This comment has been minimized.

Show comment
Hide comment

hokkos commented May 27, 2014

Open layers 3 has this feature.
http://ol3js.org/en/master/examples/rotation.html

@lyaunzbe

This comment has been minimized.

Show comment
Hide comment
@lyaunzbe

lyaunzbe Jun 6, 2014

Any updates on the possibility of this being implemented? Would be very much appreciated.

lyaunzbe commented Jun 6, 2014

Any updates on the possibility of this being implemented? Would be very much appreciated.

@colllin

This comment has been minimized.

Show comment
Hide comment
@colllin

colllin Jun 6, 2014

Seems like OL3 is your best bet for now, or wait for WebGL. I know it's
not what you want to hear, but I also tried posting an offer in their
Google Group for my team to help build map rotation and.... crickets.

On Thu, Jun 5, 2014 at 7:27 PM, Ben L. notifications@github.com wrote:

Any updates on the possibility of this being implemented? Would be very
much appreciated.


Reply to this email directly or view it on GitHub
#268 (comment).

colllin commented Jun 6, 2014

Seems like OL3 is your best bet for now, or wait for WebGL. I know it's
not what you want to hear, but I also tried posting an offer in their
Google Group for my team to help build map rotation and.... crickets.

On Thu, Jun 5, 2014 at 7:27 PM, Ben L. notifications@github.com wrote:

Any updates on the possibility of this being implemented? Would be very
much appreciated.


Reply to this email directly or view it on GitHub
#268 (comment).

@stefanocudini

This comment has been minimized.

Show comment
Hide comment
@cgwyllie

This comment has been minimized.

Show comment
Hide comment
@cgwyllie

cgwyllie Jul 14, 2014

@colllin Same here... In the end we switched to OL3 for our project.

@colllin Same here... In the end we switched to OL3 for our project.

@mvaivre

This comment has been minimized.

Show comment
Hide comment
@mvaivre

mvaivre Nov 29, 2014

Same here. No map rotation is a deal breaker for us.

mvaivre commented Nov 29, 2014

Same here. No map rotation is a deal breaker for us.

@stefanocudini

This comment has been minimized.

Show comment
Hide comment
@stefanocudini

stefanocudini Nov 29, 2014

Contributor

@cgwyllie OpenLayers 3 support map rotation!!?

Contributor

stefanocudini commented Nov 29, 2014

@cgwyllie OpenLayers 3 support map rotation!!?

@mvaivre

This comment has been minimized.

Show comment
Hide comment
@braandl

This comment has been minimized.

Show comment
Hide comment
@braandl

braandl Feb 28, 2015

I also think that this feature should be the current #1 topic for leaflet. Please concider it, I think it is totally worth the effort.

braandl commented Feb 28, 2015

I also think that this feature should be the current #1 topic for leaflet. Please concider it, I think it is totally worth the effort.

@mourner

This comment has been minimized.

Show comment
Hide comment
@mourner

mourner Feb 28, 2015

Member

No, it doesn't. At least for Leaflet.

Member

mourner commented Feb 28, 2015

No, it doesn't. At least for Leaflet.

@stefanocudini

This comment has been minimized.

Show comment
Hide comment
@stefanocudini

stefanocudini Feb 28, 2015

Contributor

👍

Contributor

stefanocudini commented Feb 28, 2015

👍

@1marty4sale

This comment has been minimized.

Show comment
Hide comment
@1marty4sale

1marty4sale Jun 4, 2015

I would also love this. Leaflet is a fantastic framework and it is such a shame there is no plans to support this.

I would also love this. Leaflet is a fantastic framework and it is such a shame there is no plans to support this.

@lliss lliss referenced this issue in azavea/pwd-waterworks-revealed Jun 4, 2015

Closed

Reorient map while walking #79

@9SL9

This comment has been minimized.

Show comment
Hide comment
@9SL9

9SL9 Aug 15, 2015

Need rotation or need to look elsewhere...unfortunately

9SL9 commented Aug 15, 2015

Need rotation or need to look elsewhere...unfortunately

@lesion

This comment has been minimized.

Show comment
Hide comment

lesion commented Apr 25, 2016

👍

@luxigo

This comment has been minimized.

Show comment
Hide comment
@luxigo

luxigo Jun 1, 2016

👎 Looks like we'll need to lose time switching to OL3 🎱

luxigo commented Jun 1, 2016

👎 Looks like we'll need to lose time switching to OL3 🎱

@mredbishop

This comment has been minimized.

Show comment
Hide comment
@mredbishop

mredbishop Jun 10, 2016

This is a real shame as it's a deal breaker for us too. We're having to switch to OL3 for our app :o(

This is a real shame as it's a deal breaker for us too. We're having to switch to OL3 for our app :o(

@hyperknot

This comment has been minimized.

Show comment
Hide comment
@hyperknot

hyperknot Jun 10, 2016

Collaborator

Have a look at my unofficial rotate-rc1 branch at https://github.com/hyperknot/Leaflet/tree/rotate-rc1
It is based on @IvanSanchez's older rotate work.

Collaborator

hyperknot commented Jun 10, 2016

Have a look at my unofficial rotate-rc1 branch at https://github.com/hyperknot/Leaflet/tree/rotate-rc1
It is based on @IvanSanchez's older rotate work.

@maceto2016

This comment has been minimized.

Show comment
Hide comment
@maceto2016

maceto2016 Jun 11, 2016

We have tested the framework, and really liked the results. However for professional use in navigation solutions, this is an indispensable feature. We understand the complexity involved in this implementation, but this feature would add much to the framework. Let's wait a little longer, and if this feature is not included, unfortunately, we will have to switch to OL3 ...

We have tested the framework, and really liked the results. However for professional use in navigation solutions, this is an indispensable feature. We understand the complexity involved in this implementation, but this feature would add much to the framework. Let's wait a little longer, and if this feature is not included, unfortunately, we will have to switch to OL3 ...

@hyperknot

This comment has been minimized.

Show comment
Hide comment
@hyperknot

hyperknot Jun 12, 2016

Collaborator

@maceto2016 I'll continue working on rotate-rc1 and @IvanSanchez is working on Leaflet GL, which also supports rotation: https://github.com/IvanSanchez/Leaflet.gl

Collaborator

hyperknot commented Jun 12, 2016

@maceto2016 I'll continue working on rotate-rc1 and @IvanSanchez is working on Leaflet GL, which also supports rotation: https://github.com/IvanSanchez/Leaflet.gl

@maceto2016

This comment has been minimized.

Show comment
Hide comment
@maceto2016

maceto2016 Jun 13, 2016

@hyperknot Thanks for reply. Let's try the rotate-rc1 soon.

@hyperknot Thanks for reply. Let's try the rotate-rc1 soon.

@wellenvogel

This comment has been minimized.

Show comment
Hide comment
@wellenvogel

wellenvogel Jun 26, 2016

@hyperknot : Can you give a hint on the status for your work on the rotate stuff? I was checking to use leaflet for my nav software. Rotation is definitely required. I just made a poc for rotating the map "outside" - see this example. Basically it would fit my needs but unfortunately it requires accessing some internal methods and this way is not very future proof. So if there are chances for rotation being part of leaflet soon, I would prefer this. I would also be willing to contribute on this part.

@hyperknot : Can you give a hint on the status for your work on the rotate stuff? I was checking to use leaflet for my nav software. Rotation is definitely required. I just made a poc for rotating the map "outside" - see this example. Basically it would fit my needs but unfortunately it requires accessing some internal methods and this way is not very future proof. So if there are chances for rotation being part of leaflet soon, I would prefer this. I would also be willing to contribute on this part.

@GaMsh

This comment has been minimized.

Show comment
Hide comment
@GaMsh

GaMsh Jun 28, 2016

We need rotate nap feature!!!

GaMsh commented Jun 28, 2016

We need rotate nap feature!!!

@hyperknot

This comment has been minimized.

Show comment
Hide comment
@hyperknot

hyperknot Jun 28, 2016

Collaborator

@wellenvogel @GaMsh have a look at my rotate-rc1 branch, we are developing it with @fnicollet, he is using it exactly for a navigational software.

@wellenvogel also, your example looks great, you've already solved popup rotation, I'd be interested in seeing your solution. Your contributions would be welcome on rotate-rc1!

Collaborator

hyperknot commented Jun 28, 2016

@wellenvogel @GaMsh have a look at my rotate-rc1 branch, we are developing it with @fnicollet, he is using it exactly for a navigational software.

@wellenvogel also, your example looks great, you've already solved popup rotation, I'd be interested in seeing your solution. Your contributions would be welcome on rotate-rc1!

@wellenvogel

This comment has been minimized.

Show comment
Hide comment
@wellenvogel

wellenvogel Jun 28, 2016

@hyperknot : should we discuss some stuff here?
I was wondering if the idea would be to rotate oly some of the panes?
For me rotate + anti-rotate afterwards on an item gave me some issue with text being less readable(Chrome on Ubuntu).
So I thought it could be helpfull to only rotste the necessary panes.
But this woul introduce the need for translation functions being pane specific...

@hyperknot : should we discuss some stuff here?
I was wondering if the idea would be to rotate oly some of the panes?
For me rotate + anti-rotate afterwards on an item gave me some issue with text being less readable(Chrome on Ubuntu).
So I thought it could be helpfull to only rotste the necessary panes.
But this woul introduce the need for translation functions being pane specific...

@hyperknot

This comment has been minimized.

Show comment
Hide comment
@hyperknot

hyperknot Jun 28, 2016

Collaborator

@wellenvogel can you check if the rotate + anti-rotate is giving your those problems on the rotate-rc1 branch as well? It's a possible solution to only rotate the tile + vector panes, but then the calculations need to be changed.

Also, feel free to use the rotate-rc1 repo's issue tracker for discussions, that way we can keep it separate from Leaflet master.

Collaborator

hyperknot commented Jun 28, 2016

@wellenvogel can you check if the rotate + anti-rotate is giving your those problems on the rotate-rc1 branch as well? It's a possible solution to only rotate the tile + vector panes, but then the calculations need to be changed.

Also, feel free to use the rotate-rc1 repo's issue tracker for discussions, that way we can keep it separate from Leaflet master.

@fnicollet

This comment has been minimized.

Show comment
Hide comment
@fnicollet

fnicollet Jun 28, 2016

Collaborator

I have to say that I have these blur issues on your branch but I don't have
them in rotate-rc1, so rotate+anti-rotate works, when the calculations are
exact I believe. I am working on this branch for the fix:
https://github.com/fnicollet/Leaflet/tree/patch-14
This very fresh commit:
bddfb11
Has messed things up but I almost have it working

Fabien

On Tue, Jun 28, 2016 at 5:38 PM, Zsolt Ero notifications@github.com wrote:

@wellenvogel https://github.com/wellenvogel can you check if the rotate

  • anti-rotate is giving your those problems on the rotate-rc1 branch as
    well? It's a possible solution to only rotate the tile + vector panes, but
    then the calculations need to be changed.


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#268 (comment),
or mute the thread
https://github.com/notifications/unsubscribe/ABLtoa73ZBKvqplUDnl-Vvm8jbtxNExRks5qQT_2gaJpZM4BVuxg
.

Fabien Nicollet
Tel : +33 (0)6 60 54 72 20

Collaborator

fnicollet commented Jun 28, 2016

I have to say that I have these blur issues on your branch but I don't have
them in rotate-rc1, so rotate+anti-rotate works, when the calculations are
exact I believe. I am working on this branch for the fix:
https://github.com/fnicollet/Leaflet/tree/patch-14
This very fresh commit:
bddfb11
Has messed things up but I almost have it working

Fabien

On Tue, Jun 28, 2016 at 5:38 PM, Zsolt Ero notifications@github.com wrote:

@wellenvogel https://github.com/wellenvogel can you check if the rotate

  • anti-rotate is giving your those problems on the rotate-rc1 branch as
    well? It's a possible solution to only rotate the tile + vector panes, but
    then the calculations need to be changed.


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#268 (comment),
or mute the thread
https://github.com/notifications/unsubscribe/ABLtoa73ZBKvqplUDnl-Vvm8jbtxNExRks5qQT_2gaJpZM4BVuxg
.

Fabien Nicollet
Tel : +33 (0)6 60 54 72 20

@fnicollet

This comment has been minimized.

Show comment
Hide comment
@fnicollet

fnicollet Jun 28, 2016

Collaborator

Almost there, last thing is to call update when rotation of the map is
changed so that _updatePosition is changed. Have to go, will commit that
tonight probably

On Tue, Jun 28, 2016 at 5:53 PM, Fabien Nicollet fnicollet@gmail.com
wrote:

I have to say that I have these blur issues on your branch but I don't
have them in rotate-rc1, so rotate+anti-rotate works, when the calculations
are exact I believe. I am working on this branch for the fix:
https://github.com/fnicollet/Leaflet/tree/patch-14
This very fresh commit:

bddfb11
Has messed things up but I almost have it working

Fabien

On Tue, Jun 28, 2016 at 5:38 PM, Zsolt Ero notifications@github.com
wrote:

@wellenvogel https://github.com/wellenvogel can you check if the
rotate + anti-rotate is giving your those problems on the rotate-rc1 branch
as well? It's a possible solution to only rotate the tile + vector panes,
but then the calculations need to be changed.


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#268 (comment),
or mute the thread
https://github.com/notifications/unsubscribe/ABLtoa73ZBKvqplUDnl-Vvm8jbtxNExRks5qQT_2gaJpZM4BVuxg
.

Fabien Nicollet
Tel : +33 (0)6 60 54 72 20

Fabien Nicollet
Tel : +33 (0)6 60 54 72 20

Collaborator

fnicollet commented Jun 28, 2016

Almost there, last thing is to call update when rotation of the map is
changed so that _updatePosition is changed. Have to go, will commit that
tonight probably

On Tue, Jun 28, 2016 at 5:53 PM, Fabien Nicollet fnicollet@gmail.com
wrote:

I have to say that I have these blur issues on your branch but I don't
have them in rotate-rc1, so rotate+anti-rotate works, when the calculations
are exact I believe. I am working on this branch for the fix:
https://github.com/fnicollet/Leaflet/tree/patch-14
This very fresh commit:

bddfb11
Has messed things up but I almost have it working

Fabien

On Tue, Jun 28, 2016 at 5:38 PM, Zsolt Ero notifications@github.com
wrote:

@wellenvogel https://github.com/wellenvogel can you check if the
rotate + anti-rotate is giving your those problems on the rotate-rc1 branch
as well? It's a possible solution to only rotate the tile + vector panes,
but then the calculations need to be changed.


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#268 (comment),
or mute the thread
https://github.com/notifications/unsubscribe/ABLtoa73ZBKvqplUDnl-Vvm8jbtxNExRks5qQT_2gaJpZM4BVuxg
.

Fabien Nicollet
Tel : +33 (0)6 60 54 72 20

Fabien Nicollet
Tel : +33 (0)6 60 54 72 20

@wellenvogel

This comment has been minimized.

Show comment
Hide comment
@wellenvogel

wellenvogel Jun 29, 2016

@hyperknot do you see chances that your work will be merged into master in the near future?
I really would like to stay as close as possible on master. Otherrwise I maybe would continue with some sort of plugin approach with minimal changes on the core code.

@hyperknot do you see chances that your work will be merged into master in the near future?
I really would like to stay as close as possible on master. Otherrwise I maybe would continue with some sort of plugin approach with minimal changes on the core code.

@GaMsh

This comment has been minimized.

Show comment
Hide comment
@GaMsh

GaMsh Jun 29, 2016

Please give link to compiled leaflet.js with this patch!

GaMsh commented Jun 29, 2016

Please give link to compiled leaflet.js with this patch!

@fnicollet

This comment has been minimized.

Show comment
Hide comment
@fnicollet

fnicollet Jun 29, 2016

Collaborator

@hyperknot regularly builds and store the result in the branch's source code, but the best you can do it build it yourself just checkout the branch or download it (https://github.com/hyperknot/Leaflet/archive/rotate-rc1.zip), then build it just like leaflet, see Build Leaflet from source: http://leafletjs.com/download.html.
Last big issue is with vector layers https://github.com/hyperknot/Leaflet/issues/1, patch almost works but needs a fix (see comments), if you feel like helping us :)

Collaborator

fnicollet commented Jun 29, 2016

@hyperknot regularly builds and store the result in the branch's source code, but the best you can do it build it yourself just checkout the branch or download it (https://github.com/hyperknot/Leaflet/archive/rotate-rc1.zip), then build it just like leaflet, see Build Leaflet from source: http://leafletjs.com/download.html.
Last big issue is with vector layers https://github.com/hyperknot/Leaflet/issues/1, patch almost works but needs a fix (see comments), if you feel like helping us :)

@fnicollet

This comment has been minimized.

Show comment
Hide comment
@fnicollet

fnicollet Jul 24, 2016

Collaborator

For anyone interested, here is the link to the unofficial branch for leaflet rotation:
https://github.com/fnicollet/Leaflet/tree/rotate-master

You are welcome to try it and contribute to it :)

Fabien

Collaborator

fnicollet commented Jul 24, 2016

For anyone interested, here is the link to the unofficial branch for leaflet rotation:
https://github.com/fnicollet/Leaflet/tree/rotate-master

You are welcome to try it and contribute to it :)

Fabien

@webleaf

This comment has been minimized.

Show comment
Hide comment
@webleaf

webleaf Sep 20, 2016

We need rotation, too

webleaf commented Sep 20, 2016

We need rotation, too

@IvanSanchez

This comment has been minimized.

Show comment
Hide comment
@IvanSanchez

IvanSanchez Sep 20, 2016

Member

@webleaf Then spend some time and resources debugging the rotate branches, as we'll all benefit from that and the code will be released quicker.

Member

IvanSanchez commented Sep 20, 2016

@webleaf Then spend some time and resources debugging the rotate branches, as we'll all benefit from that and the code will be released quicker.

@jperelli jperelli referenced this issue in cualbondi/old-mobile Dec 11, 2016

Open

Poder girar mapa #4

@kaio328

This comment has been minimized.

Show comment
Hide comment
@kaio328

kaio328 Jan 31, 2017

Yep rotation is definitely needed! Best example: a custom made map that changed it original orientation after georeferencing it.

kaio328 commented Jan 31, 2017

Yep rotation is definitely needed! Best example: a custom made map that changed it original orientation after georeferencing it.

@HarelM

This comment has been minimized.

Show comment
Hide comment
@HarelM

HarelM Apr 19, 2017

@mourner @fnicollet @hyperknot Is this planned to be merge to official version? I see a lot of people moving away from leaflet due to this feature which makes me sad, mainly because I like leaflet very much and because I feel that this feature will be needed in my project in the near future.

HarelM commented Apr 19, 2017

@mourner @fnicollet @hyperknot Is this planned to be merge to official version? I see a lot of people moving away from leaflet due to this feature which makes me sad, mainly because I like leaflet very much and because I feel that this feature will be needed in my project in the near future.

@yohanboniface yohanboniface referenced this issue Sep 6, 2017

Closed

rotate the map #5762

0 of 2 tasks complete
@RafikSM

This comment has been minimized.

Show comment
Hide comment
@RafikSM

RafikSM Sep 18, 2017

This function is a must to have, I don't understand why @mourner considers this feature not important especially since almost all the others map libraries offer this function !

RafikSM commented Sep 18, 2017

This function is a must to have, I don't understand why @mourner considers this feature not important especially since almost all the others map libraries offer this function !

@IvanSanchez

This comment has been minimized.

Show comment
Hide comment
@IvanSanchez

IvanSanchez Sep 18, 2017

Member

@RafikSM Then spend some time and resources debugging the rotate branches, as we'll all benefit from that and the code will be released quicker.

Member

IvanSanchez commented Sep 18, 2017

@RafikSM Then spend some time and resources debugging the rotate branches, as we'll all benefit from that and the code will be released quicker.

@zhuyinjing

This comment has been minimized.

Show comment
Hide comment
@zhuyinjing

zhuyinjing Sep 21, 2017

does leaflet support rotate function????
i really want my map to rotate !
thanks so much! @IvanSanchez

does leaflet support rotate function????
i really want my map to rotate !
thanks so much! @IvanSanchez

@goforward01

This comment has been minimized.

Show comment
Hide comment
@goforward01

goforward01 Dec 21, 2017

@IvanSanchez Hi, first, thanks a lot for the amazing work of leaflet. I am wandering about whether to switch to other library for leaflet has no way to rotate map which is needed serious or not. So are there any new messages about this feature, and will this feature be supported by official library soon or maybe in future? I have tried a lot ways and have no luck with any hack to realize rotating my maps.

@IvanSanchez Hi, first, thanks a lot for the amazing work of leaflet. I am wandering about whether to switch to other library for leaflet has no way to rotate map which is needed serious or not. So are there any new messages about this feature, and will this feature be supported by official library soon or maybe in future? I have tried a lot ways and have no luck with any hack to realize rotating my maps.

@hyperknot

This comment has been minimized.

Show comment
Hide comment
@hyperknot

hyperknot Dec 21, 2017

Collaborator

@goforward01 if map rotation is a required feature for a project, then yes, I recommend you to switch to a different library.

Collaborator

hyperknot commented Dec 21, 2017

@goforward01 if map rotation is a required feature for a project, then yes, I recommend you to switch to a different library.

@maceto2016

This comment has been minimized.

Show comment
Hide comment
@maceto2016

maceto2016 Dec 21, 2017

@goforward01

This comment has been minimized.

Show comment
Hide comment
@goforward01

goforward01 Dec 22, 2017

@hyperknot Okay, thanks for reply. BTW, I will keep an eye on leaflet, it's an awesome library.

@hyperknot Okay, thanks for reply. BTW, I will keep an eye on leaflet, it's an awesome library.

@va2ron1

This comment has been minimized.

Show comment
Hide comment
@va2ron1

va2ron1 Mar 16, 2018

If people wondering, I have merged and have updated the old @IvanSanchez rotate branch to the latest of Leaflet in my fork.

va2ron1 commented Mar 16, 2018

If people wondering, I have merged and have updated the old @IvanSanchez rotate branch to the latest of Leaflet in my fork.

@HarelM

This comment has been minimized.

Show comment
Hide comment
@HarelM

HarelM Mar 20, 2018

@va2ron1 I would very much like to test it, but I'm using angular-cli. is there a npm package I can use to test it?
Assuming this will work as planned, will it be merged to the official version? I really don't want to choose between rotation to other newly implemented features if the branch gets out of sync...

HarelM commented Mar 20, 2018

@va2ron1 I would very much like to test it, but I'm using angular-cli. is there a npm package I can use to test it?
Assuming this will work as planned, will it be merged to the official version? I really don't want to choose between rotation to other newly implemented features if the branch gets out of sync...

@fnicollet

This comment has been minimized.

Show comment
Hide comment
@fnicollet

fnicollet Mar 20, 2018

Collaborator
Collaborator

fnicollet commented Mar 20, 2018

@va2ron1

This comment has been minimized.

Show comment
Hide comment
@va2ron1

va2ron1 Mar 20, 2018

@HarelM like @fnicollet said, this is just experimental. If you want to try it with angular, just install the package like this:
npm install https://github.com/va2ron1/Leaflet

Edit: I hadn't include the distributions files, now will work with node.

va2ron1 commented Mar 20, 2018

@HarelM like @fnicollet said, this is just experimental. If you want to try it with angular, just install the package like this:
npm install https://github.com/va2ron1/Leaflet

Edit: I hadn't include the distributions files, now will work with node.

@HarelM

This comment has been minimized.

Show comment
Hide comment
@HarelM

HarelM Mar 27, 2018

@va2ron1 I wanted to test your branch but I have an issue with markercluster so i can't currently test it:
Leaflet/Leaflet.markercluster#874
I will upload it once the issue is resolved and it runs to my beta site and let you know what issues I find.

HarelM commented Mar 27, 2018

@va2ron1 I wanted to test your branch but I have an issue with markercluster so i can't currently test it:
Leaflet/Leaflet.markercluster#874
I will upload it once the issue is resolved and it runs to my beta site and let you know what issues I find.

@HarelM

This comment has been minimized.

Show comment
Hide comment
@HarelM

HarelM Mar 28, 2018

Ok, The problem was that this branch is using the esm version and does not export L variable for leaflet.markercluster to use - fixed it locally.
I Added the following code to map initialization on my project:

{
...
rotate = true,
...
}
...
map.setBearing(30);

I have uploaded a version to the following address:
https://israelhiking.osm.org.il/beta/
My findings:

  1. I could not rotate the map using 2 fingers - neither desktop with touch on win 10 and chrome nor chrome on android - not sure if this was not implemented or I didn't configured something...
  2. DivIcon is not centered (I think) - in the following example the lower part of the white triangle should be pointing to the blue dot.
    image
    This is how it looks in the non rotated version:
    image
  3. getBounds function is drifting? I have a query to my DB to show all the points in the current screen using the following code:
let northEast = this.mapService.map.getBounds().pad(0.2).getNorthEast();
let southWest = this.mapService.map.getBounds().pad(0.2).getSouthWest();
sending to server

at first this works fine, but after a few panning and zooming I get incorrect response when calling this function.
4. not sure if there's a bug in my code or not but I see strange behavior with the following code:
https://github.com/IsraelHikingMap/Site/blob/master/IsraelHiking.Web/sources/application/services/snapping.service.ts
which should snap a marker when dragging it to the closest feature in a list, but it behaves strangely with the rotation.

Polygons and poly-lines are correctly rotated, and even ant-path works :-)
flyTo seems to work as expected.
overall, I think this is a good progress, the above issues are probably small/easy to fix unfortunately I don't think I'll be able to help out with the implementation at this state but I'll be happy to test things out.
Let me know if I can help more...

HarelM commented Mar 28, 2018

Ok, The problem was that this branch is using the esm version and does not export L variable for leaflet.markercluster to use - fixed it locally.
I Added the following code to map initialization on my project:

{
...
rotate = true,
...
}
...
map.setBearing(30);

I have uploaded a version to the following address:
https://israelhiking.osm.org.il/beta/
My findings:

  1. I could not rotate the map using 2 fingers - neither desktop with touch on win 10 and chrome nor chrome on android - not sure if this was not implemented or I didn't configured something...
  2. DivIcon is not centered (I think) - in the following example the lower part of the white triangle should be pointing to the blue dot.
    image
    This is how it looks in the non rotated version:
    image
  3. getBounds function is drifting? I have a query to my DB to show all the points in the current screen using the following code:
let northEast = this.mapService.map.getBounds().pad(0.2).getNorthEast();
let southWest = this.mapService.map.getBounds().pad(0.2).getSouthWest();
sending to server

at first this works fine, but after a few panning and zooming I get incorrect response when calling this function.
4. not sure if there's a bug in my code or not but I see strange behavior with the following code:
https://github.com/IsraelHikingMap/Site/blob/master/IsraelHiking.Web/sources/application/services/snapping.service.ts
which should snap a marker when dragging it to the closest feature in a list, but it behaves strangely with the rotation.

Polygons and poly-lines are correctly rotated, and even ant-path works :-)
flyTo seems to work as expected.
overall, I think this is a good progress, the above issues are probably small/easy to fix unfortunately I don't think I'll be able to help out with the implementation at this state but I'll be happy to test things out.
Let me know if I can help more...

@va2ron1

This comment has been minimized.

Show comment
Hide comment
@va2ron1

va2ron1 Mar 30, 2018

@HarelM If you don't mind, post this issue at my fork to leave this behind.

Edit: Posted

va2ron1 commented Mar 30, 2018

@HarelM If you don't mind, post this issue at my fork to leave this behind.

Edit: Posted

@va2ron1 va2ron1 referenced this issue in va2ron1/Leaflet Mar 30, 2018

Open

Rotation of Map #5

@HarelM

This comment has been minimized.

Show comment
Hide comment
@HarelM

HarelM Mar 30, 2018

@mourner I know this issue is a bit old, any change to reconsider and opening so it will be added to leaflet officially? I've been using leaflet for the better part of the last five years and I really like it, I would hate to need to change the entire map presentation framework since this feature is not supported officially...

HarelM commented Mar 30, 2018

@mourner I know this issue is a bit old, any change to reconsider and opening so it will be added to leaflet officially? I've been using leaflet for the better part of the last five years and I really like it, I would hate to need to change the entire map presentation framework since this feature is not supported officially...

@HarelM HarelM referenced this issue in IsraelHikingMap/Site Mar 30, 2018

Open

Support map rotation #669

@ccloquet

This comment has been minimized.

Show comment
Hide comment
@ccloquet

ccloquet Apr 6, 2018

@va2ron1 great work, thank you !

ccloquet commented Apr 6, 2018

@va2ron1 great work, thank you !

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment