Vjylku

The test team as an enemy of development? And how can this be avoided?

Is it dangerous to install hacking tools on my private linux machine?

What are the main differences between Stargate SG-1 cuts?

Central Vacuuming: Is it worth it, and how does it compare to normal vacuuming?

Does the Mueller report show a conspiracy between Russia and the Trump Campaign?

Nose gear failure in single prop aircraft: belly landing or nose-gear up landing?

Flight departed from the gate 5 min before scheduled departure time. Refund options

Why not send Voyager 3 and 4 following up the paths taken by Voyager 1 and 2 to re-transmit signals of later as they fly away from Earth?

Does the Black Tentacles spell do damage twice at the start of turn to an already restrained creature?

Test print coming out spongy

Co-worker has annoying ringtone

Is there hard evidence that the grant peer review system performs significantly better than random?

What does 丫 mean? 丫是什么意思？

In musical terms, what properties are varied by the human voice to produce different words / syllables?

Special flights

One-one communication

What to do with repeated rejections for phd position

Ore hitori de wa kesshite miru koto no deki nai keshiki; It's a view I could never see on my own

Resize vertical bars (absolute-value symbols)

What does Turing mean by this statement?

What initially awakened the Balrog?

What does it mean that physics no longer uses mechanical models to describe phenomena?

Mounting TV on a weird wall that has some material between the drywall and stud

How to change the tick of the color bar legend to black

Leaflet search and popup at other position

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ margin-bottom:0;
}

1

0

In leaflet I want the popup on another position then the standard.
So I created a div in which the popup-information is opens.

countryLayer = L.geoJson(countryLayer, {



         onEachFeature: function (feature, layer){

           layer.on({

                click: function showResultsInDiv() {

                    var d = document.getElementById('popup');

                    d.innerHTML = "";

                        for (prop in feature.properties){

                        d.innerHTML += prop+": "+feature.properties.COUNTRY+"<br>";

                        }

                    console.log(d.innerHTML);

                }

            }); }       



});

This is working fine. I click an object and the popup opens in the top-right corner.

However I am also using the search plugin by stefanocudini (https://github.com/stefanocudini/leaflet-search)
When I search I want the popup to open automatically in the div.
Unfortunately I can´t get this to work. I can seach and the location is giving, but the popup does not open.

The search-control code I use is:

var searchControl = L.control.search({

    layer: countryLayer,

    initial: false,

    propertyName: 'COUNTRY',

    zoom: 15

});



searchControl.on('search:locationfound', function(e) {



    if(e.layer._popup)

        e.layer.openPopup();



}).on('search:collapsed', function(e) {



        streetsLayer.eachLayer(function(feature, layer) {   //restore feature color

            streetsLayer.resetStyle(layer);

    }); 

});



map.addControl( searchControl );  //inizialize search control

Hope someone can help me solve this issue

leaflet popup search

share|improve this question

asked Aug 8 '18 at 9:07

StefanStefan

1,39011227

bumped to the homepage by Community♦ 5 mins ago

This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.

add a comment | 

1

0

In leaflet I want the popup on another position then the standard.
So I created a div in which the popup-information is opens.

countryLayer = L.geoJson(countryLayer, {



         onEachFeature: function (feature, layer){

           layer.on({

                click: function showResultsInDiv() {

                    var d = document.getElementById('popup');

                    d.innerHTML = "";

                        for (prop in feature.properties){

                        d.innerHTML += prop+": "+feature.properties.COUNTRY+"<br>";

                        }

                    console.log(d.innerHTML);

                }

            }); }       



});

This is working fine. I click an object and the popup opens in the top-right corner.

However I am also using the search plugin by stefanocudini (https://github.com/stefanocudini/leaflet-search)
When I search I want the popup to open automatically in the div.
Unfortunately I can´t get this to work. I can seach and the location is giving, but the popup does not open.

The search-control code I use is:

var searchControl = L.control.search({

    layer: countryLayer,

    initial: false,

    propertyName: 'COUNTRY',

    zoom: 15

});



searchControl.on('search:locationfound', function(e) {



    if(e.layer._popup)

        e.layer.openPopup();



}).on('search:collapsed', function(e) {



        streetsLayer.eachLayer(function(feature, layer) {   //restore feature color

            streetsLayer.resetStyle(layer);

    }); 

});



map.addControl( searchControl );  //inizialize search control

Hope someone can help me solve this issue

leaflet popup search

share|improve this question

asked Aug 8 '18 at 9:07

StefanStefan

1,39011227

bumped to the homepage by Community♦ 5 mins ago

This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.

add a comment | 

In leaflet I want the popup on another position then the standard.
So I created a div in which the popup-information is opens.

countryLayer = L.geoJson(countryLayer, {



         onEachFeature: function (feature, layer){

           layer.on({

                click: function showResultsInDiv() {

                    var d = document.getElementById('popup');

                    d.innerHTML = "";

                        for (prop in feature.properties){

                        d.innerHTML += prop+": "+feature.properties.COUNTRY+"<br>";

                        }

                    console.log(d.innerHTML);

                }

            }); }       



});

This is working fine. I click an object and the popup opens in the top-right corner.

However I am also using the search plugin by stefanocudini (https://github.com/stefanocudini/leaflet-search)
When I search I want the popup to open automatically in the div.
Unfortunately I can´t get this to work. I can seach and the location is giving, but the popup does not open.

The search-control code I use is:

var searchControl = L.control.search({

    layer: countryLayer,

    initial: false,

    propertyName: 'COUNTRY',

    zoom: 15

});



searchControl.on('search:locationfound', function(e) {



    if(e.layer._popup)

        e.layer.openPopup();



}).on('search:collapsed', function(e) {



        streetsLayer.eachLayer(function(feature, layer) {   //restore feature color

            streetsLayer.resetStyle(layer);

    }); 

});



map.addControl( searchControl );  //inizialize search control

Hope someone can help me solve this issue

leaflet popup search

share|improve this question

asked Aug 8 '18 at 9:07

StefanStefan

1,39011227

countryLayer = L.geoJson(countryLayer, {



         onEachFeature: function (feature, layer){

           layer.on({

                click: function showResultsInDiv() {

                    var d = document.getElementById('popup');

                    d.innerHTML = "";

                        for (prop in feature.properties){

                        d.innerHTML += prop+": "+feature.properties.COUNTRY+"<br>";

                        }

                    console.log(d.innerHTML);

                }

            }); }       



});

var searchControl = L.control.search({

    layer: countryLayer,

    initial: false,

    propertyName: 'COUNTRY',

    zoom: 15

});



searchControl.on('search:locationfound', function(e) {



    if(e.layer._popup)

        e.layer.openPopup();



}).on('search:collapsed', function(e) {



        streetsLayer.eachLayer(function(feature, layer) {   //restore feature color

            streetsLayer.resetStyle(layer);

    }); 

});



map.addControl( searchControl );  //inizialize search control

share|improve this question

asked Aug 8 '18 at 9:07

StefanStefan

1,39011227

share|improve this question

asked Aug 8 '18 at 9:07

StefanStefan

1,39011227

asked Aug 8 '18 at 9:07

StefanStefan

1,39011227

asked Aug 8 '18 at 9:07

StefanStefan

1,39011227

1 Answer
1

active

oldest

votes

0

Since the popup already opens in a div on click, you want the search selection to open in the same div.

I have a write up I did for a class using JQuery;s autocomplete as a search tool. When loading the layer, I also load an array that I use for the search, In my case a state name value, Since this is unique I also loaded it as the Leaflet_ID. by doing I could associate the search name with a specific feature, then use the select to fire a click event with the same result as if you just clicked on it. I included a zoom to feature also.

My write up http://www.gistechsolutions.com/leaflet/DEMO/Search/index.html
There is also a working example off of it.

share|improve this answer

answered Aug 10 '18 at 16:18

Bill ChappellBill Chappell

2,8261816

add a comment | 

Your Answer

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "79"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fgis.stackexchange.com%2fquestions%2f292144%2fleaflet-search-and-popup-at-other-position%23new-answer', 'question_page');
}
);

Post as a guest

Name

Email

Required, but never shown

0

Since the popup already opens in a div on click, you want the search selection to open in the same div.

I have a write up I did for a class using JQuery;s autocomplete as a search tool. When loading the layer, I also load an array that I use for the search, In my case a state name value, Since this is unique I also loaded it as the Leaflet_ID. by doing I could associate the search name with a specific feature, then use the select to fire a click event with the same result as if you just clicked on it. I included a zoom to feature also.

My write up http://www.gistechsolutions.com/leaflet/DEMO/Search/index.html
There is also a working example off of it.

share|improve this answer

answered Aug 10 '18 at 16:18

Bill ChappellBill Chappell

2,8261816

add a comment | 

0

Since the popup already opens in a div on click, you want the search selection to open in the same div.

I have a write up I did for a class using JQuery;s autocomplete as a search tool. When loading the layer, I also load an array that I use for the search, In my case a state name value, Since this is unique I also loaded it as the Leaflet_ID. by doing I could associate the search name with a specific feature, then use the select to fire a click event with the same result as if you just clicked on it. I included a zoom to feature also.

My write up http://www.gistechsolutions.com/leaflet/DEMO/Search/index.html
There is also a working example off of it.

share|improve this answer

answered Aug 10 '18 at 16:18

Bill ChappellBill Chappell

2,8261816

add a comment | 

Since the popup already opens in a div on click, you want the search selection to open in the same div.

I have a write up I did for a class using JQuery;s autocomplete as a search tool. When loading the layer, I also load an array that I use for the search, In my case a state name value, Since this is unique I also loaded it as the Leaflet_ID. by doing I could associate the search name with a specific feature, then use the select to fire a click event with the same result as if you just clicked on it. I included a zoom to feature also.

My write up http://www.gistechsolutions.com/leaflet/DEMO/Search/index.html
There is also a working example off of it.

share|improve this answer

answered Aug 10 '18 at 16:18

Bill ChappellBill Chappell

2,8261816

share|improve this answer

answered Aug 10 '18 at 16:18

Bill ChappellBill Chappell

2,8261816

answered Aug 10 '18 at 16:18

Bill ChappellBill Chappell

2,8261816

answered Aug 10 '18 at 16:18

Bill ChappellBill Chappell

2,8261816