我有一张地图,当标记落在地图上时,它会从一个点移动到另一个点。我遇到的问题是平移太快了。有什么方法可以降低panTo函数的运行速度吗?
谢谢,克里斯
发布于 2012-02-18 05:16:30
遗憾的是,不能更改panTo动画的速度。
该函数只接受一个latlng参数。详情请访问:http://code.google.com/apis/maps/documentation/javascript/reference.html#Map
发布于 2015-07-03 17:17:22
我编写自己的panTo实现。使用类"EasingAnimator“。
var EasingAnimator = function(opt){
opt = opt || {};
this.easingInterval = opt.easingInterval;
this.duration = opt.duration || 1000;
this.step = opt.step || 50;
this.easingFn = opt.easingFn || function easeInOutElastic(t, b, c, d) {
if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
return -c/2 * ((t-=2)*t*t*t - 2) + b;
};
this.callBack = opt.callBack || function(){};
};
EasingAnimator.makeFromCallback = function(callBack){
return new EasingAnimator({
callBack: callBack
});
};
EasingAnimator.prototype.easeProp = function(obj, propDict){
propDict = propDict || {};
var self = this,
t = 0,
out_vals = JSON.parse(JSON.stringify(obj));
clearInterval(self.easingInterval);
self.easingInterval = setInterval(function(){
t+= self.step;
if (t >= self.duration) {
clearInterval(self.easingInterval);
self.callBack(propDict);
return;
}
var percent = self.easingFn(t, 0, 1, self.duration);
Object.keys(propDict).forEach(function(key, i) {
var old_val = obj[key];
out_vals[key] = old_val - percent*(old_val - propDict[key]);
});
self.callBack(out_vals);
}, self.step);
};
现在你可以控制一切,包括持续时间,步数,当然还有放松功能。这里有一些很好的例子,http://easings.net/。现在你可以像这样使用它:
dom_elem.addEventListener('click', function(event){
var point = map.getCenter();
easingAnimator.easeProp({
lat: point.lat(),
lng: point.lng()
}, points[i]);
});
在这里您可以找到它如何工作的现场演示http://codepen.io/ErDmKo/pen/Jdpmzv
https://stackoverflow.com/questions/9335150
复制相似问题