VOL3 / v-ol3

Vaadin OpenLayers 3 wrapper
Apache License 2.0
15 stars 18 forks source link

Tile mismatch on WMS layer #79

Open jobsonm opened 8 years ago

jobsonm commented 8 years ago

I have a valid WMS URL (see http://wmsviewer-rodis.rhcloud.com/custom.html?&wmsurl=http://readymap.org/readymap/tiles&wmslayer=7&wmsborder=none&wmsside=normal&wmscenterx=14.3575390625&wmscentery=41.454053125&wmszoom=5&wmsprj=EPSG:4326)

When I try to load with the v-ol3 plugin I get a mismatched tile layout. It looks like the tiles should be rotated by 90 degrees (See screenshot)

wms_mismatch

The following is a snippet from my code.

Any help would be greatly appreciated. Or it could be an issue.

Many thanks, Mike

` public OpenLayersRuntimeDisplay(ApplicationBaseUI application) { super(application);

    VerticalLayout layout = new VerticalLayout();
    layout.setSizeFull();

    // create map instance
    map = new OLMap();
    map.setSizeFull();

    // add layers to map

    if (getApplication() instanceof OpenLayers)
    {
        OpenLayers openLayers = (OpenLayers) getApplication();
        OLSource wmsTileSource = new OLTileWMSSource(createPelicanSource());
        layer = new OLTileLayer(wmsTileSource);
        //OLSource wmsImageSource = new OLImageWMSSource(createImagePelicanSource());
        //layer = new OLImageLayer(wmsImageSource);

        map.addLayer(layer);
        map.setView(createView());

        // Load the configuration from the cookie and reposition the map
        BrowserCookie.detectCookieValue(application.generateCookieName(), new BrowserCookie.Callback()
        {
            @Override
            public void onValueDetected(String value)
            {
                application.load(value);
                ToolkitMapConfiguration configuration = new ToolkitMapConfiguration(application.getConfiguration());
                OLView view = map.getView();

                OLCoordinate olCoordinate = new OLCoordinate(configuration.getLat(), configuration.getLon());
                view.setCenter(olCoordinate);
                view.setZoom(configuration.getZoomLevel());
                map.setView(view);
            }
        });

        // Add the entity layer
        entityLayer = new OLEntityLayer(new EntityLayerSource(application), openLayers.getEntityLayerOptions());
        map.addLayer(entityLayer);

        // Add the map component
        layout.addComponent(map);
        // layout.addComponent(createControls());

        // Set full screen
        layout.setExpandRatio(map, 1.0f);

        // Set the main display
        setCompositionRoot(layout);
    }
}

protected OLLayer createTileLayer(OLSource source)
{
    return new OLTileLayer(source);
}

protected OLLayer createImageLayer(OLSource source)
{
    return new OLImageLayer(source);
}

private OLView createView()
{
    OLViewOptions options = new OLViewOptions();
    //options.setMapProjection("EPSG:4326");
    view = new OLView(options);
    view.setZoom(3);
    view.setCenter(0, 0);
    view.addViewChangeListener(this);

    return view;
}

private OLTileWMSSourceOptions createPelicanSource()
{
    ToolkitLogger.getLogger().info("*********************** USING READYMAP TILE ***********************");
    OLTileWMSSourceOptions options = new OLTileWMSSourceOptions(); //
    options.setUrl("http://readymap.org/readymap/tiles");
    options.setProjection("EPSG:4326");

    Map<String, String> params = new HashMap<String, String>();
    params.put("LAYERS", "7");
    params.put("FORMAT", "image/png");
    //params.put("reverseAxisOrder", "true");
    //params.put("singleTile", "true");
    //params.put("srs", "EPSG:4326");
    //params.put("yx", "true");
    //params.put("wmsprj", "EPSG:4326");

    options.setParams(params);

    return options;
}`