0

I have a map I have created in QGIS 3.8. It is using OSM as the base map and I have a simple raster layer which is a georeferenced map.

QGIS has a useful plugin qgis2web that exports a complete set of files for Openlayers (and Leaflet).

Once in Openlayer format and viewed in a browser it is possible to rotate the complete view to rotate say the north-point 40 degrees (i.e. about 0.7 Radians) east by using Alt+Shift+Drag. You can see a demo of this working here: https://openlayers.org/en/latest/examples/rotation.html

What I am trying to do is to modify the generated code to show the map already rotated to the required angle. (This is because the georeferenced map does not have its north point at the top of the page.)

This is the layers.js code that I am trying to modify, presumably, I need a rotation: 0.7 but I cannot figure out where!

var wms_layers = [];

    var lyr_OpenStreetMap_0 = new ol.layer.Tile({
        'title': 'OpenStreetMap',
        'type': 'base',
        'opacity': 1.000000,


        source: new ol.source.XYZ({
attributions: '<a href=""></a>',
            url: 'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png'
        })
    });var lyr_MyMap = new ol.layer.Image({
                        opacity: 1,
                        title: "King's Park",


                        source: new ol.source.ImageStatic({
                           url: "./layers/MyMap.png",
attributions: '<a href=""></a>',
                            projection: 'EPSG:3857',
                            alwaysInRange: true,
                            imageExtent: [-100073.533268, 6847294.601171, -93832.319311, 6852417.437192]
                        })
                    });

lyr_OpenStreetMap_0.setVisible(true);lyr_MyMap.setVisible(true);
var layersList = [lyr_OpenStreetMap_0,lyr_MyMap];
Packwood
  • 239
  • 4
  • 13
  • It's the rotation option in the (`view rotation: Math.PI / 6,` in the example) for you can use `map.getView().setRotation(Math.PI / 6);` – Mike Jul 16 '19 at 20:48
  • Thanks, I'd tried with something like that, but I cannot work out where exactly it needs to go in my code. It either has no effect or I get the syntax wrong! – Packwood Jul 16 '19 at 21:42
  • 1
    Just put it after map initialisation. Provide the code of your example to guide you properly – pavlos Jul 17 '19 at 11:47

1 Answers1

1

Thank you pavlos

Just adding one line at the end of the body of html file sorted it:

<script>map.getView().setRotation(Math.PI / 2.6 );</script>
Packwood
  • 239
  • 4
  • 13