I have built an interactive map for the Web that transitions smoothly from lon/lat point to lon/lat point. The duration of the transition is calculated dynamically and depends on the distance between the two points.
I have commented my code, shown below, to better illustrate the current set-up.
// Multiply the distance between points (given in radians) // by the mean radius of the earth (given in kilometers) to // give us the distance between points (in kilometers). var distanceInKm = d3.geo.distance(fromPoint, toPoint) * 6371; // The base speed - currently 5 kilometers per millisecond var flySpeed = 5 / 1000; // The duration of the transition (in milliseconds) var flyTime = distanceInKm / flySpeed;
My problem is
flyTime increases and decreases linearly. I want bring down the top end to form a curve (something that looks like the top-left quarter of a circle, maybe), so I can reduce the transition time for particularly long (~10,000km+) journeys. I am not trying to model a real flight, but create a good user experience.
Please could someone help me write an equation to do that, keeping it as simple as possible and also enlighten me as to which area of math my question covers?
Math.log(x) function, with better results. I have been passing
distanceInKm in to it to reduce the long journeys and better my transition time. Unfortunately, the curve that this function produces seems to be too harsh. For those feeling inclined, I have pasted a copy of my code, heavily commented, here: http://pastebin.com/kFkUTNC2.