Javascript 自定义控件Openlayers 3上的平滑缩放

Javascript 自定义控件Openlayers 3上的平滑缩放,javascript,openlayers,openlayers-3,Javascript,Openlayers,Openlayers 3,是否可以在自定义按钮控件中实现平滑缩放 在下面的示例中,您可以看到自定义缩放控件和默认缩放控件之间的缩放动画有很大的不同 var-map=新的ol.map({ 目标:“地图”, 图层:[ 新ol.layer.Tile({ 来源:new ol.source.OSM() }) ], 视图:新ol.view({ 中心:Lonlat的其他项目([37.41,8.82]), 缩放:4 }) }); $('#test1')。在('click',function()上{ map.getView().setZ

是否可以在自定义按钮控件中实现平滑缩放

在下面的示例中,您可以看到自定义缩放控件和默认缩放控件之间的缩放动画有很大的不同

var-map=新的ol.map({
目标:“地图”,
图层:[
新ol.layer.Tile({
来源:new ol.source.OSM()
})
],
视图:新ol.view({
中心:Lonlat的其他项目([37.41,8.82]),
缩放:4
})
});
$('#test1')。在('click',function()上{
map.getView().setZoom(map.getView().getZoom()+1);
});
$('#test2')。在('click',function()上{
map.getView().setZoom(map.getView().getZoom()-1);
});
.map{
高度:400px;
宽度:100%;
}

OpenLayers示例
我的地图
加
减

您可以使用
动画
代替
设置缩放

检查
视图
,向下滚动至
动画

您需要的代码如下所示:

view.animate({
  zoom: zoom - 1,
  duration: 200
});