I am using a network graph in my SAPUI5 application. In the Graph tag I set the 'enableWheelZoom'-property to true, which allows the user to zoom in/out using the mouse wheel.
Is there a way to adjust or customize the zoom-in velocity? Without further adjustments the zoom happens quite quickly, though I'm scrolling slowly. I would want the zoom to be smoother/slower.
Many thanks in advance! :)
Related
On my demo website I am using a Leaflet map on which I have disabled one finger panning to improve user experience on mobile platforms.
var map = L.map('myMap', {
dragging: !L.Browser.mobile,
tap: !L.Browser.mobile
}
This works fine, the website visitor can scroll past the map without troubles.
The problems start when the user wants to pan the map using two fingers. Such moves also scroll the website making the map effectively unusable.
Is there any way to prevent the user to scroll the website while panning the map using two fingers?
touchZoom:!L.Browser.mobile probably fits your needs.
https://leafletjs.com/reference-1.7.1.html explains touchZoom :
Boolean|String : Whether the map can be zoomed by touch-dragging with
two fingers. If passed 'center', it will zoom to the center of the
view regardless of where the touch events (fingers) were. Enabled for
touch-capable web browsers except for old Androids.
I have mxgraph application with default panning behavior (no settings from code). Chart can be moved in desktop browsers using right mouse.
On mobile browsers there is no right mouse button, so I cannot find a way to move (pan) mxgraph and only small part of chart is visible.
What do I need to set for mxgraph to allow scrolling/panning to see other parts of chart?
I find a way to pan chart using setting for left mouse button. In this case on mobile screens it works fine.
graph.setPanning(true);
graph.panningHandler.useLeftButtonForPanning = true;
I have a webpage where I show some PDFs converted in HTML5 with this awesome tool called pdf2htmlEX.
In the same page I make a navigation bar.
If I use mobile devices and I zoom with pinch-to-zoom gesture, the device apply zoom to all elements with navigation bar included.
I would like to make only the html-pdf content zoomable with pinch-to-zoom on mobile devices. I wrapped the content inside a div with id "content-container" and I tried some JS libraries like HammerJS (results with bad bad mobile performance) and iScroll-5 but I can't figure it out.
I checked out OpenStreetMaps mobile website that have some fixed elements and zoomable contents.
Have anyone implemented with good result this feature?
Thank you.
See this similar question: How to zoom div content using jquery?
Basically you can use $('#divName').animate({ 'zoom': zoomlevel }, 'slow'); to get the effect you like using zoom control buttons.
A good plugin that is very flexible to use zoom is http://jaukia.github.io/zoomooz/
We have been trying to build a map for a client where users can:
Use a joystick to navigate left and right
Zoom in/out on the canvas
Select a specific building and have that center align for them
Everything works great on a PC but when we try to use an iPad 2 problems happen:
The screen becomes quite shaky
When you zoom in on the screen the quality of the map drops, even though the map is over 10mb and the quality is good for some reason it becomes pixelated.
URL: http://bit.ly/1MDcVhV
Does anyone have experience with such problems.
Thanks.
I am playing around with Sencha Touch, especially with examples like http://dev.sencha.com/deploy/touch/examples/
However I am faced with a problem, when using the component the scale is set on the iPhone and the user cannot scroll the page or zoom in or out.
How may I disable these settings as I would like to have the carousel on a page which can be scrolled, and zoomed in/out.
Thanks.
[Sencha person] You can't zoom in or out of a Sencha component. Having fixed UI Chrome is one of the reasons to even use a UI framework (otherwise you'd might use a simple mobile-optimized web page).
You can have a scrollable area within a carousel, but you might want to consider whether that's really the best UX, since the carousel is already a scroller (it just scrolls in fixed increments) Take a look at touchstyle.mobi/app for an example of a data-store backed carousel.
I could be wrong, but it seems to me that the goal of sencha is to make full screen apps, so it seems logical that you cannot zoom/scroll the page ?
There are methods and plugins for zooming if you want.
Carousel ImageViewer (plugin) - Zoom feature
Pinch-to-zoom in panels
Pinch emulator (plugin)