nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Kinetic Panning Via The ESRI JavaScript API

jeffpalus

Just to be consitent with other ESRI web mapping API's, please add kinetic scrolling (aka inertia scrolling) feature, like the way the map pan move in bing & google maps. When you pan around on the map, the expected behaviour is for the map the continue to slide proportionally to the speed you dragged/panned the map.

When the user drag the map, the map moves smoothly.
When the user release the left mouse button the map does not stop straight, but stops by the power of dragging the map you made.

Find more posts tagged with

Accepted answers

All comments

StephenLead

+1 this would be a very nice feature

Have you tried adding something at ideas.esri.com?

jeffpalus

Yes, here is the link:
http://ideas.arcgis.com/ideaView?id=08730000000bvKQAAY

Dan

Has ESRI implemented kinetic panning in the Javascript API yet? If not, when?

Silverlight and Flex have smooth kinetic panning. We'd like to see similar behavior in our web map apps regardless of the API. We'd also like to provide modern web functionality that users expect.

AdrianMarsden

Please, if this is added, make it optional. When google Maps started doing it I spent ages trying to switch it off, I HATE it. I want the map to stop when I stop moving the mouse, not to continue on moving based on how fast I moved the mouse. Hate it.

Did I mention, I don't like it?

derekswingley1

The team has (briefly) discussed adding this in the past but we haven't made it a priority. If it is added, you will be able to turn it off.

One thing that came up is that this is more of a requirement on touch devices. If you're still using a mouse, it's probably not the ideal experience. Anyone care to agree or disagree?

Dan

Some hate it. Some love it. So, yes, please make it an option.

Also, it would be nice if it had the ability to pan continuously for a long distance on release (like Google Earth), or to glide to a halt in a stickier fashion (like Bing Maps and Google Maps). Both of these map apps are hugely successful, so there are enough people out there who enjoy glide/swipe (kinetic) panning. (BTW: if the user stops panning before releasing the mouse, map should not glide at all (as is done in Bing Maps, Google Maps, etc.)

Kinetic panning is particularly useful for large areas. Similar concept to free-spinning mouse wheels for zipping through long documents - less effort to move across large areas.

Also, rather than just a Boolean, a numeric factor could be set to determine glide time (0 = no glide effect).

Dan

If you're still using a mouse, it's probably not the ideal experience. Anyone care to agree or disagree?

I humbly disagree with swingley's comment above . . .

Bing Maps, Google Maps, Google Earth, and other very successful map apps use kinetic/glide panning on moused setups as well as mobile/touch devices.

Dan

Another comparison is with zoom. With a free-spin mouse wheel a Flex map app only zooms in one notch no matter how fast the wheel is spun (as I recall). I like how the JSAPI enables the user to free-spin deep in to or out of the map.

derekswingley1

I humbly disagree with swingley's comment above . . .

Noted. Don't expect this in the next release (3.3) but we might be able to do something after that.

Bing Maps, Google Maps, Google Earth, and other very successful map apps use kinetic/glide panning on moused setups as well as mobile/touch devices.

Google Earth and Maps, and to some degree Bing, are quite successful at being platforms people use for maps but having kinetic panning is only one (and probably a minor one at that) of the many reasons for their success. Kinetic panning, when done correctly, IMO, is a subtle enhancement to an app's user experience. If it's too prominent, it tends to detract from the user experience (again, my opinion). Ideally, it "just feels right" and isn't directly noticed by users. Developers are a different story as that is a pretty picky audience

Dan

Google Earth and Maps, and to some degree Bing, are quite successful at being platforms people use for maps but having kinetic panning is only one (and probably a minor one at that) of the many reasons for their success.

True, but it wouldn't be a far reach to assume that Google's/Bing's/others' market research found that kinetic panning was preferred or they would not have included it.

We'll look forward to it in 3.4 (please) with hopes of squeezing it in for 3.3 (double please).

Developers are a different story as that is a pretty picky audience.

True, at least in my case - �?�

derekswingley1

We'll look forward to it in 3.4 (please) with hopes of squeezing it in for 3.3 (double please).

Can't promise anything, but we'll be talking about it. Definitely not for 3.3.

Dan

Thanks for joining the discussion.

StephenLead

Ideally, it "just feels right" and isn't directly noticed by users

I use Google Maps all the time, but I still had to fire it up and test it out to see what this thread was asking for.

Now that I've noticed it, I want it too.

JoeJan

esri, please add it to 3.3

jeffpalus

ERSI ? IS there any news?

ryanmordoff

Are people still interested in this? I was able to throw together a rough approach that seems to be working fairly well for me. If anyone is interested let me know, I will probably clean it up and throw up on github in a few weeks. Should work for 3.3 and 3.4.

ReneRubalcava

I would definitely be interested. I made an attempt at this, but I think my math was off as my map just jumped around all over the place.

Thanks.

JeffJacobson

Are people still interested in this? I was able to throw together a rough approach that seems to be working fairly well for me. If anyone is interested let me know, I will probably clean it up and throw up on github in a few weeks. Should work for 3.3 and 3.4.

I would also be interested.

ryanmordoff

Sounds good, I should have it cleaned up in a few weeks. Will let you know when I release it.

ryanmordoff

Hello all, here is the link to my implementation. Let me know if you have any issues/comments.

Source - https://github.com/rymor/esri-kinetic-panning

Live Demo - http://rymor.github.io/esri-kinetic-panning/index.html

mykLT

Thank You for sharing. I used params displacementMouseMultiplier: 15 and deceleration: 0.85 for best effect.

I found one issue: if KineticPanning module is created after map is loaded - it works incorrectly (if two mouse drags are done one after another, first panning effect is stopped and second is starting from previous extent).

MarkHoover

Any plans to get this working for IE 8 or any idea why it doesn't? Sadly, it is the current default browser installed on machines throughout my company. Works great on IE 9 though!

ryanmordoff

Thank You for sharing. I used params displacementMouseMultiplier: 15 and deceleration: 0.85 for best effect.

I found one issue: if KineticPanning module is created after map is loaded - it works incorrectly (if two mouse drags are done one after another, first panning effect is stopped and second is starting from previous extent).

Thanks for pointing out the issue. I will look into it and try to get it resolved in a couple of days.

ryanmordoff

Any plans to get this working for IE 8 or any idea why it doesn't? Sadly, it is the current default browser installed on machines throughout my company. Works great on IE 9 though!

Yes, my plan is to get it working in ie8, haven't had a chance to troubleshoot it yet though. I will reply back once I get it fixed.

mykLT

I noticed that map parameter should not be passed for mouseEvents and touchEvents, because they generate map click events and this can cause problems (for eg. draw toolbar is connecting on map click event to handle draw ending).

Also it fails when trying to zoom at panning time. Zooming begins from first pan movement point.

ryanmordoff

I noticed that map parameter should not be passed for mouseEvents and touchEvents, because they generate map click events and this can cause problems (for eg. draw toolbar is connecting on map click event to handle draw ending).

Also it fails when trying to zoom at panning time. Zooming begins from first pan movement point.

Thanks, adding to my list of bugs.

evtguy

Wow. +100 internets to you, Ryan for this. So much better than the default panning behavior. I also need to support pre IE-9 so I'll wait on the sidelines until you get that bug worked out. Great job!

ryanmordoff

Wow. +100 internets to you, Ryan for this. So much better than the default panning behavior. I also need to support pre IE-9 so I'll wait on the sidelines until you get that bug worked out. Great job!

Hey, glad you like it. Go ahead an give it another try, it should be working on ie8 now.

If anyone else has any issues, go ahead and fill out an issue for the project and I will get to them when I can - https://github.com/rymor/esri-kinetic-panning/issues

MarkHoover

Is the live demo no longer working? I can't seem to access it.

ryanmordoff

Is the live demo no longer working? I can't seem to access it.

Sorry, updated the link. Give this a try - http://rymor.github.io/esri-kinetic-panning/examples/index.html

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.