1

I have a problem to export a OpenLayers map to a png or jpeg file.

What I want is the full map and with maximum resolution, what I get is a part of the map with minimum resolution.

The map is hosted on a server on the Internet. Here is the link to call the page: http://bvbm1.bib-bvb.de/webclient/DeliveryManager?custom_att_2=simple_viewer&pid=233679

Here is The code (I found it in another thread, but I don't know how to zoom or how to set the size of the map.

// modify these parameters accordingly!
var url = 'http://digital.bib-bvb.de/webclient/DeliveryManager?application=&owner=&custom_att_1=&custom_att_3=&user_mode=&pds_handle=GUEST&search_terms=&adjacency=&frameId=1&user=&pid=233679&locale=de&zoom=100'
var mapID           = 'map';
var outputFilename  = 'hurrz.png';

var resourceWait  = 300,
    maxRenderWait = 10000;

var page          = require('webpage').create(),
    count         = 0,
    forcedRenderTimeout,
    renderTimeout;

// function to execute map clipping and saving when page has fully loaded
function doRender() {

    console.log("Page has fully loaded");       
    console.log('clipping map...')

    var clipRect = page.evaluate(function(mapID){
        console.log('Map Id');
        console.log(mapID)
        return document.getElementById(mapID).getBoundingClientRect();
        }, mapID);

    page.clipRect = {
        top:    clipRect.top,
        left:   clipRect.left,
        width:  clipRect.width,
        height: clipRect.height
        };

    console.log('rendering image...')
    console.log('top, left, width, height:')
    console.log(clipRect.top)
    console.log(clipRect.left)
    console.log(clipRect.width)
    console.log(clipRect.height)

    page.render(outputFilename);
    phantom.exit();

}

page.onResourceRequested = function (req) {
    count += 1;
    //console.log('REQ > ' + req.id + ' - ' + req.url);
    //req.url = req.url.replace("zoom=0&", "zoom=1&");
    //req.url = req.url.replace("zoom=1&", "zoom=100&");
    console.log('REQ > ' + req.id + ' - ' + req.url);
    console.log(' ');
    clearTimeout(renderTimeout);
};

page.onResourceReceived = function (res) {

    //res.url = res.url.replace("zoom=0&", "zoom=1&");
    //res.url = res.url.replace("zoom=1&", "zoom=2&");

    if (!res.stage || res.stage === 'end') {
        count -= 1;
        console.log('REC  ' + res.id + ' ' + res.status + ' - ' + res.url);
        if (count === 0) {
            renderTimeout = setTimeout(doRender, resourceWait);
        }
    }
};

page.open(url, function (status) {

    if (status !== "success") {
        console.log('Unable to load url');
        phantom.exit();
    } else {
        forcedRenderTimeout = setTimeout(function () {
            console.log('Count');
            console.log(count);
            doRender();
        }, maxRenderWait);
    }
});
  • Doing this is generally a violation of the terms of use for most sites. You should probably check to see if it is permitted before pounding on the server. – Vince Aug 22 '17 at 11:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.