根据Google地图结果进行缩放

时间:2018-08-20 04:29:41

标签: javascript angularjs google-maps openlayers

这是我当前的代码:

$scope.search = function(){
    Request.googleAPI($scope.searchForm).then(function(data){
        console.log("Search result: ")
        console.log(data)
        var actualZoom = map.getView().getZoom();
        console.log("Zoom level: " + actualZoom)
        var point = [data.data.results[0].geometry.location.lng, data.data.results[0].geometry.location.lat];
        var size = /** @type {ol.Size} */ (map.getSize());
        view.centerOn(ol.proj.transform(point, 'EPSG:4326', 'EPSG:3857'), size, [size[0]/2, size[1]/2]);
        /*
        map.setView(new ol.View({
            projection: 'EPSG:4326',
            center: [long, lat], //long,lat
            zoom: actualZoom
        }));
        */
    })
}

我尝试使用底部的注释(建议在SO上使用)。我将其修改为仅使用“缩放”,但是它将使我的地图变白。

Google Maps请求包含几何点位置(纬度/经度)以及边界框,边界框应确定缩放级别。如何使用此边界框正确更新我的地图?

如果您需要查看更多代码,这里是我正在使用的complete script

1 个答案:

答案 0 :(得分:0)

解决了我的数学问题!

$scope.search = function(){
    Request.googleAPI($scope.searchForm).then(function(data){

        var point = [data.data.results[0].geometry.location.lng, data.data.results[0].geometry.location.lat];
        var size = /** @type {ol.Size} */ (map.getSize());
        view.centerOn(ol.proj.transform(point, 'EPSG:4326', 'EPSG:3857'), size, [size[0]/2, size[1]/2]);

        // To adjust Zoom Level
        var bound = data.data.results[0].geometry.viewport;
        var east = bound.northeast.lng
        var west = bound.southwest.lng
        var zoom = 9 - Math.floor(Math.log(Math.abs(west-east))/Math.log(2));
        map.getView().setZoom(zoom);
    })
}