1

I've an HTML with a list of data's :

<select id="searchinput" align="top" maxlength="120" name="zl_choix">(...)

And the button search with this code:

<input type='button' value='Search !' id='searchbutton' onclick='search()'>

And my Javascript function, take the value of the data list and search on the map this value for make a zoom and display popup :

function search()
{

    // ZOOM ///////////////////////////////
    var search_value = document.getElementById('searchinput').value;

    var layers = map.getLayers();
    var view = map.getView();

    var length = layers.getLength();
    for (var i = 0; i<length; i++) {

        if (layers.item(i).q['name'] == 'Layer 1') {

            obj = layers.a[i].q['source'].i;

            var cpt_ligne = 0

            for (prop in obj){

                cpt_ligne++;
                nb_ligne = Object.keys(obj).length;

                if (cpt_ligne == 1) {
                    var debut = prop;
                };
                if (cpt_ligne == nb_ligne) {
                    var fin = prop;
                };
            }

            for (var j = debut; j<fin; j++) {

            var test_undefined = layers.a[i].q['source'].g[j];

                if (test_undefined != undefined) {
                    if (layers.a[i].q['source'].g[j].q['num'] === search_value) {

                        destination_center = layers.a[i].q['source'].g[j].q['geometry'].j;

                        var resolution = view.getResolution();

                        var duration = 2500;
                        var start = +new Date();
                        var zoom = ol.animation.zoom({
                            resolution: resolution
                            });

                            map.beforeRender(zoom);
                            view.setCenter(destination_center);
                            view.setZoom(15);

                        // POPUP ///////////////////////////////                        

                        if (popup_test == 1) {
                            map.removeOverlay(popup);
                            popup = new ol.Overlay.Popup;
                            popup.setOffset([0, 10]);
                            map.addOverlay(popup);
                        } else {
                            popup = new ol.Overlay.Popup;
                            popup.setOffset([0, 10]);
                            map.addOverlay(popup);
                        };

                        map.addOverlay(popup);

                        popup_test = 1;

                        var recup_layer = map.forEachLayerAtPixel(
                            map.getPixelFromCoordinate(destination_center),
                            function(ft, layer){return ft;}
                        );

                        var recup_prop = map.forEachFeatureAtPixel(
                            map.getPixelFromCoordinate(destination_center),
                            function(ft, layer){return ft;}
                        );

                        if (recup_layer && recup_layer.get('name') == 'Layer 1') {

                            var geometry = recup_prop.getGeometry();
                            var coord = geometry.getCoordinates();

                            var content = ("<div id='tad_close_popup' )'></div><div id='tad_text_popup'><p>Arr&ecirc;t "+  recup_prop.get('data') + "</p></div>");

                            popup.show(coord, content);

                        }

                        /////////////////////////////////////////////////////////

                        break;
                    }
                }
            }
        }
    }
}

The problem is my variable recup_prop doesn't recover the value if the point destination_center didn't on my screen when I click on the button Search !.

For example, if I've two near points and I see them on my screen and I search the first point and the second point, no problem, if I do alert (recup_prop) I've an object.

But if I've a third point what I don't see alert (recup_prop) varaible recup_prop is undefined.

  • Care to create a jsfiddle of your example? – nagytech May 31 '15 at 12:42
2

I resolve the problem if I remove popup and if I replace it by a < div id = " information " > Who contain the information of the popup what I complete with the code document.getElementById (' information ') . InnerHTML = (...)

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.