当我单击 URL 时放大到矢量图层

zooming in to vector layer when i click a URL

我的地图中有一个 WFS 图层。我在层中有建筑物 building_id 作为属性以及其他许多属性。我的图层中也有坐标。

我有一个URL:http://localhost:8080/geoserver/wfs?service=wfs&version=1.0.0&request=getfeature&typename=topp:buildings&CQL_FILTER=id='bb21'

如何使用此 URL 将我的地图缩放到该建筑物?

有什么想法吗?

阿杰

================更新到这里===============

$.ajax({
    url: 'http://localhost:8080/geoserver/wfs?service=wfs&version=1.0.0&request=getfeature&typename=genesis:Building_WGS&CQL_FILTER=HOUSE_NO=%271436%27',
    xhrFields: {
        withCredentials: true
    },
    success: function(data) {
        var te = new ol.format.GML2();

        var a = te.readFeatures(data)
        var feature = new ol.Feature(a);
        //console.log(test1);
        var geom = feature.get("HOUSE_NO");
        var view = map.getView();
        //view.fit(geom, map.getSize());
        console.log(geom);
    }   
});

首先,您必须使用 ajax 请求查询 url。许多 JavaScript 库支持简单的方法来发出此类请求,例如 jQuery: http://api.jquery.com/jquery.ajax/

然后,在收到请求响应后,您必须阅读结果。如果您使用的是 WFS,那么您的响应应该是 GML。 OL3 有 GML 2 和 3 的格式:

两者都有一个 readFeatures 方法,您可以使用该方法将您的响应转换为特征数组,即转换为 ol.Feature 的实例。然后您可以循环这些要素并获取它们的几何形状并将地图拟合到该几何形状。

var geom = feature.getGeometry();
var view = map.getView();
view.fit(geom, map.getSize());