如何在弹出窗口中显示来自WMS的数据?

时间:2019-08-23 14:05:56

标签: openlayers geoserver wms

我制作了带有一些图层的地图,这没关系。然后,我尝试在弹出窗口中显示数据,但是我所做的一切都无法正常工作。出现弹出窗口,但没有数据,只是显示“拒绝的连接”。如果我单击以在新窗口中从弹出窗口中显示代码,那么它将起作用。

我试图将数据显示到div中,但是它也不起作用。我在弹出窗口中使用了框架标签,也许就是问题所在。我在web.xml上了解了一个配置,我尝试了一下,但是这又带来了其他问题。

<script>
    var map, info,wms_layer;
    function Init() {
        map = new ol.Map({
            target: 'map',
            layers: [
                new ol.layer.Group({
                    'title': 'Mapa Base',
                    layers: [
                        //OpenStreetMap
                        new ol.layer.Tile({
                            title: 'OpenStreetMap',
                            source: new ol.source.OSM(),
                            type: 'base',
                            visible: true
                        })
                    ]
                }),
                new ol.layer.Group({
                    title: 'Legendas',
                    fold: 'open',
                    layers: [
                        wms_layer = new ol.layer.Tile({
                            title: 'Area 1',
                            visible: false,
                            source: new ol.source.TileWMS({
                                url: 'http://myserver:8080/geoserver/wms',
                                params: { LAYERS: 'geo:AREA1', TILED: true},
                                serverType: 'geoserver'
                            }),
                        }),
                        new ol.layer.Tile({
                            title: 'Area 2',
                            visible: false,
                            source: new ol.source.TileWMS({
                                url: 'http://myserver:8080/geoserver/wms',
                                params: { LAYERS: 'geo:AREA2', TILED: true },
                                serverType: 'geoserver'
                            }),
                        }),
                    ]
                })
            ],
            view: new ol.View({
                center: ol.proj.fromLonLat([-46.444137, -23.713596]),
                zoom: 12
            })
        });

        map.addControl(new ol.control.LayerSwitcher);
        map.addControl(new ol.control.ScaleLine);
        map.addControl(new ol.control.ZoomSlider);
        var popup = new Popup();
        map.addOverlay(popup);
        map.on('singleclick', function (evt) {
        var coordenada = ol.coordinate.toStringHDMS(ol.proj.transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326'), 2);

        var viewProjection = map.getView().getProjection();
        var viewResolution = map.getView().getResolution();

        var url = wms_layer.getSource().getGetFeatureInfoUrl(
        evt.coordinate, viewResolution, viewProjection,
        {
            'INFO_FORMAT': 'text/html',
       });
        popup.show(evt.coordinate, '<div><iframe seamless src="' + url + '"></iframe></div>');

        });
    }

</script>

WMS网址: http://myserver:8080/geoserver/wms?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetFeatureInfo&FORMAT=image%2Fpng&TRANSPARENT=true&QUERY_LAYERS=geo%3AAREA1&LAYERS=geo%3AAREA1&TILED=true&INFO_FORMAT=text%2Fhtml&I=41&J=120&WIDTH=256&HEIGHT=256&CRS=EPSG%3A3857&STYLES=&BBOX=-5175704.059245855%2C-2719935.214499712%2C-5165920.119625352%2C-2710151.274879209

这是我在上面的链接中得到的:

enter image description here

如何查看弹出窗口中链接中的数据?

0 个答案:

没有答案