blocks|key|647061|text|遗憾的是，不能更改panTo动画的速度。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|647062|该函数只接受一个latlng参数。详情请访问：http://code.google.com/apis/maps/documentation/javascript/reference.html#Map|offset|length|647063|entityMap|0|LINK|mutability|MUTABLE|url|http://code.google.com/apis/maps/documentation/javascript/reference.html#Map^0|0|N|24|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@$D|P|E|Q|1|R]]|A|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|M]]]]

Sadly, no, you cannot change the speed of the panTo animation.

The function only takes a single latlng argument. Details here: <a href="http://code.google.com/apis/maps/documentation/javascript/reference.html#Map" rel="noreferrer">http://code.google.com/apis/maps/documentation/javascript/reference.html#Map</a>

blocks|key|432745|text|我编写自己的panTo实现。使用类"EasingAnimator“。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|432746|var+EasingAnimator+=+function(opt){
++++++++opt+=+opt+%7C%7C+{};
++++++++this.easingInterval+=+opt.easingInterval;
++++++++this.duration+=+opt.duration+%7C%7C+1000;
++++++++this.step+=+opt.step+%7C%7C+50;
++++++++this.easingFn+=+opt.easingFn++%7C%7C+function+easeInOutElastic(t,+b,+c,+d)+{
++++++++++++if+((t/=d/2)+<+1)+return+c/2*t*t*t*t+%2B+b;
++++++++++++return+-c/2+*+((t-=2)*t*t*t+-+2)+%2B+b;
++++++++};
++++++++this.callBack+=+opt.callBack+%7C%7C+function(){};
++++};
EasingAnimator.makeFromCallback+=+function(callBack){
++++return+new+EasingAnimator({
++++++++callBack:+callBack
++++});
};
EasingAnimator.prototype.easeProp+=+function(obj,+propDict){
++++propDict+=+propDict+%7C%7C+{};

++++var+self+=+this,
++++++++t+=+0,
++++++++out_vals+=+JSON.parse(JSON.stringify(obj));

++++clearInterval(self.easingInterval);
++++self.easingInterval+=+setInterval(function(){
++++++++t%2B=+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);
};|code-block|syntax|javascript|432747|现在你可以控制一切，包括持续时间，步数，当然还有放松功能。这里有一些很好的例子，http://easings.net/。现在你可以像这样使用它：|offset|length|432748|dom_elem.addEventListener('click',+function(event){
++++var+point+=+map.getCenter();

++++easingAnimator.easeProp({
++++++++lat:+point.lat(),
++++++++lng:+point.lng()
++++},+points[i]);
});|432749|在这里您可以找到它如何工作的现场演示http://codepen.io/ErDmKo/pen/Jdpmzv|432750|entityMap|0|LINK|mutability|MUTABLE|url|http://easings.net/|1|http://codepen.io/ErDmKo/pen/Jdpmzv^0|0|0|14|J|0|0|0|I|Z|1|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|Z|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|10|8|@]|9|@$I|11|J|12|1|13]]|A|$]]|$1|K|3|L|5|D|7|14|8|@]|9|@]|A|$E|F]]|$1|M|3|N|5|6|7|15|8|@]|9|@$I|16|J|17|1|18]]|A|$]]|$1|O|3|-4|5|6|7|19|8|@]|9|@]|A|$]]]|P|$Q|$5|R|S|T|A|$U|V]]|W|$5|R|S|T|A|$U|X]]]]

I write my own implementation of panTo. Using class "EasingAnimator".

<pre><code>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) &lt; 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 &gt;= 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);
};
</code></pre>

Now you can control everything including duration, steps and of course the easing function. Here are some nice examples of it <a href="http://easings.net/">http://easings.net/</a>. And now you can use it some like this:

<pre><code>dom_elem.addEventListener('click', function(event){
 var point = map.getCenter();

 easingAnimator.easeProp({
 lat: point.lat(),
 lng: point.lng()
 }, points[i]);
});
</code></pre>

Here you can find live demo of how it works
<a href="http://codepen.io/ErDmKo/pen/Jdpmzv">http://codepen.io/ErDmKo/pen/Jdpmzv</a>

I have a map that pans from point to point around a map as markers are dropped on the map. The issue I'm having is that the panning is too fast. Is there any way to slow down the panTo function?

Thanks,
Chris

Slow down google panTo function

JSON

我有一张地图，当标记落在地图上时，它会从一个点移动到另一个点。我遇到的问题是平移太快了。有什么方法可以降低panTo函数的运行速度吗？谢谢，克里斯

问减慢谷歌panTo函数的速度
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问减慢谷歌panTo函数的速度EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问减慢谷歌panTo函数的速度
EN