1

I have built a simple map using OpenLayers 3, have a look at the code below:

JavaScript code:

var map;

function init(){
    map = new ol.Map({
        target:'map',
        renderer:'canvas',
        view: new ol.View({
            projection: 'EPSG:900913',
            center:[-8015003.33712,4160979.44405],
            zoom:5
        })
    });

    var newLayer = new ol.layer.Tile({
    source: new ol.source.OSM()
    });

    map.addLayer(newLayer);

    /* 
        get and display extent 
        http://gis.stackexchange.com/questions/168590/how-to-get-extent-in-openlayers-3
    */

    var size = map.getView().calculateExtent(map.getSize());

    console.log(size);

    console.log(map.getSize());


    /* ========================== */

}

/* function to remove layer */

function removeTopLayer(){
    var layers = map.getLayers();
    layers.pop();
}

/* ========================= */


/* swap layers function */

function swapTopLayer(){
    var layers = map.getLayers();
    var topLayer = layers.removeAt(2);
    layers.insertAt(1, topLayer);
}

/* =================== */

HTML code:

<body onload="init()">
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->

        <!-- Add your site or application content here -->
        <div id='map'></div>
        <button style='position:absolute; left: 10px; top:30%' onclick='removeTopLayer()'>Remove Top Layer</button>
        <button style='position:absolute; left: 10px; top:40%' onclick='swapTopLayer()'>Swap Top Layers</button>

    </body>

Functioning link can be found HERE.

Now I wanted to add a bounding box, so that when the map loads, it only loads for a specific area, I searched for examples online, but they are either of OL2 or are about a user selecting a bound box dynamically, which is not my requirement. My requirement is pretty simple, all I want is the tiles for a specific bounding box to load instead of the map for the entire world to load.

I found the below method in OpenLayers 3.0 doc's boundingExtent, but I am not sure how to use it. :( So now suppose I want to add a bounding box for THIS area, how would I go about doing it, using the boundingExtent method? Can anybody explain?

I have been scratching my head over this one for quite sometime now, can anybody help me achieve my goal of have only a specific bounding box load?

Improve this question
1

I can get your point but I really can not understand what do you expect to visually get out of it.

  1. Would it be somehtig like this example? -->clipping. Show the a map but hide the areas you need to be not visisble.

  2. Or would it be something like this example.-->extent+minZoom+maxZoom prevent the user moving the map in areas you need to be hidden and thus not loading these tiles. (passign extent during the view configuration prevents the map center to be outside the extent passed.)

  3. Or would it be something else??????

finally, for the question concerning boundingExtent. It is just creating a bbox out of the supplied points. That means get the min_x,min_y, max_x, max_y out of the supplied points (x,y's). Cannt see how this is going to help you in this case.

Improve this answer
4
  • thanks for the detailed guidelines , basically what i want to do is , set an extent (i have added the link of the coordinates in my question) , I.E. only the tiles of that extent should load. of the examples you provided , i don't need the 1st one , regarding the secound example i think the parameter extent:[-16655.5402445057125, 6609968.258934638,0,6809968], might be what i was looking for. is it setting an extent for the map tiles ? – Alexander Solonik Nov 23 '15 at 3:46
  • 1
    If you just dont want to draw tiles outside an extent then pass the extent during tile layer initiliasation. check the docs here -->openlayers.org/en/v3.11.1/apidoc/ol.layer.Tile.html. If you want to prevent the map mooving outside this extent then pass it to the ol.view as well as the tile layer – pavlos Nov 23 '15 at 9:35
  • Basically its all about the load time .. I.E. reducing the load time , i have seen the effects of passing the parameter extent to layers , thats probably what i need , not your initial example , i hope my understanding is correct. Thank you. – Alexander Solonik Nov 23 '15 at 17:32
  • no probs. glad to help. – pavlos Nov 23 '15 at 18:12

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.