Support right-click-drag to change map rotation
In some cases it would be helpful to be able to rotate the map away from North-Up.
To support this we'd need to change the following:
-
add rotation to the map projection object
- this whole file https://github.com/openstreetmap/iD/blob/master/modules/geo/raw_mercator.js
- utilSetTransform (and anywhere that calls utilSetTransform) https://github.com/openstreetmap/iD/blob/master/modules/util/util.js#L159
-
code that uses a projection to fetch data should be rotation aware.
mostly that means updatingd3.geoTilehttps://github.com/openstreetmap/iD/blob/master/modules/lib/d3.geo.tile.js and any place it is used:- compute the extent of background tiles to fetch https://github.com/openstreetmap/iD/blob/master/modules/renderer/tile_layer.js
- compute the extent of osm data to fetch https://github.com/openstreetmap/iD/blob/master/modules/services/osm.js
- compute the extent of mapillary/openstreetcam data https://github.com/openstreetmap/iD/blob/master/modules/services/mapillary.js https://github.com/openstreetmap/iD/blob/master/modules/services/openstreetcam.js
-
add support for changing the rotation in several places in the map code:
- adjust event filter:
https://github.com/openstreetmap/iD/blob/master/modules/renderer/map.js#L272 - handle right click drags in event handler: https://github.com/openstreetmap/iD/blob/master/modules/renderer/map.js#L365
- add rotate methods around here: https://github.com/openstreetmap/iD/blob/master/modules/renderer/map.js#L674
- adjust event filter:
-
support a rotation in the map hash
- maybe support both
zoom/lat/lonandzoom/lat/lon/angle? https://github.com/openstreetmap/iD/blob/master/modules/behavior/hash.js
- maybe support both
-
all the drawing code needs to be aware of being rotated
- check everything under https://github.com/openstreetmap/iD/tree/master/modules/svg/*
- But what comes to mind includes
- midpoint arrows will need to adjust their orientation (
midpoints.js) - vertices with a direction will need to adjust their orientation (
vertices.js) - oneway markers should be ok, as they are attached to paths
- text of all kinds should stay face up (
labels.js,gpx.js) - markers of all kinds should stay face up (
points.js,mapillary_images.js,mapillary_signs.js,openstreetcam_images.js)
- midpoint arrows will need to adjust their orientation (
-
add some kind of rotation compass control:
- copy whatever zoom does to make a button https://github.com/openstreetmap/iD/blob/master/modules/ui/zoom.js
- add the button to the toolbar around here: https://github.com/openstreetmap/iD/blob/master/modules/ui/init.js#L132
- add some code to make it rotateable
- needs to listen for map move events like
context.map().on('move.compass', debouncedUpdate)
see https://github.com/openstreetmap/iD/blob/master/modules/ui/undo_redo.js#L78 - needs an icon
-
other stuff:
- minimap should rotate the yellow bounding box https://github.com/openstreetmap/iD/blob/master/modules/ui/map_in_map.js#L252
- not sure what to even do with the turn restriction editor, but that thing has its own projection and can rotate too https://github.com/openstreetmap/iD/blob/master/modules/ui/fields/restrictions.js#L236
@bhousel wrote:
In some cases it would be helpful to be able to rotate the map away from North-Up.
Could you please give examples?
Could you please give examples?
The two most common examples people have asked me about are:
- Tracing stuff along a diagonal road grid (many users instinctively bend their neck to match the road grid, which can be uncomfortable, and looks silly when a whole room of people is doing it)
- Using street level imagery where the user wants the map aligned to driver point of view (for example, to better understand what the "no left turn" sign means without having to spin the world around in their head).
Personally, I would find map rotation to be very handy for the two reasons above (and not just because I like to trace east-facing corn mazes).
Some considerations regarding user interaction:
- JOSM binds right-dragging (or Ctrl-dragging on the Mac) to panning the map. I don’t think it’s necessarily the job of iD to avoid conflicts with any JOSM gesture, but this is such a basic gesture that it should be super easy to unrotate the map if the user accidentally rotates it. On the Mac, the most natural key bindings would be ⌥← and ⌥→ for rotation and ⌘↑ for unrotation.
- Mac users often Ctrl-drag instead of right-dragging because it’s awkward to two-finger drag on a touchpad or on a touch-enabled, one-button mouse. For awhile, it was impossible to rotate a GL JS–powered map in Firefox on the Mac, because the context menu kept getting in the way: mapbox/mapbox-gl-js#3131.
- Both these kinds of input devices support the two-finger rotation gesture, which would be ideal for this feature. See
GestureEventfor Safari andMSGestureEventfor Internet Explorer and Edge. - Should iD remember the rotation setting? If so, the compass would need to be more prominent to avoid surprises. Maybe the minimap itself should automatically appear when the map is rotated and serve as a compass of some sort.
- How should the imagery offset controls work? Should the map automatically unrotate the moment you fiddle with them?
hi , this is a great feat for map rotation, is there any timeline for the support of rotate func in iD? i want to make contributions for this feat.
There isn't a timeline - someone wanted this so I put my thoughts on a ticket about what might be needed..
It would be great to have your help with this! 👍 It might make it easier to break the work into several PRs.
Any progress on this?
Also checking in... could be very helpful... any suggestion for what it might take to bump this up the priority list?
Perhaps someone with knowledge of the code base (see first post) could break this down into subtasks that can be implemented (and dry-tested) individually, even if they don't "do" anything unless in concert. Any feature that isn't rotation-aware yet could just force the view into north-up.
Perhaps also a good project for GSoC.