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
});