Zoom in op een land wanneer je op de naam van het land in een zijpaneel klikt

Question

In mijn proof of concept-app (zie onderstaande link), wordt bij het klikken op de knop de kaart van Haïti gemarkeerd en wordt de naam van het land weergegeven in het zijpaneel. Je zoomt iets verder in wanneer je op de kaart van het land klikt en de naam van een stad wordt weergegeven in het zijpaneel.<\/P> <\/P> ICGC WEB PORTAL<\/A><\/P> <\/P> Ik zou graag iets soortgelijks willen doen wanneer ik op de naam van het land in het zijpaneel klik. Dat wil zeggen, iets verder inzoomen op Haïti. Suggesties over de beste manier om dit te realiseren worden gewaardeerd.<\/P> <\/P> Chris<\/P>

JohnGravois · Answer

Hi Chris,

your threads stand a lot better chance of generating feedback if you work harder to articulate exactly what research you've already done and what you've already tried.  what you're asking can be broken up into several parts:

1) how do I know that someone has clicked text on my page?

the good news here if that this question is not peculiar to GIS web development, its pure HTML/JavaScript, so there are a lot of different resources out there available to you!

this first step can be broken up even further:

a) how would I create an event listener for text that comes from plain old static <html>?

b) once i can do that, do I need to do anything differently if the text was inserted via arbitrary JavaScript?

before you start worrying about recentering the map, stick with something straightforward (like calling 'alert('yes!');')

2) once I know that someone has clicked on my item of interest, how do I take advantage of that opportunity to set the extent of my map?  what would I need to have available?

this part actually is a GIS web dev question, but the documentation is there to help you, and will hopefully explain how to dig into a particular L.geoJson feature and use its properties and methods to manipulate the map (using its methods).  the good news here is that if you forget about the first part of your problem temporarily, you can Google different combinations of search terms to research the Leaflet components in play to see what you'll have to do differently than what you already did when someone clicks a button.

before you figure out how to listen for someone clicking on text, you can work on passing what you think will be available (and useful) via a global variable to a trigger you're comfortable with (like just calling your own method manually)

after the individual problems are solved, it'll be time to hook everything up together.  and if you get stuck along the way, you'll have a much more specific (hopefully searchable) question.

Hope all that makes sense.

the tl;dr is:

all problems are more solvable when they are as small as possible.

internet searches for help with small, discrete questions yield dramatically more relevant results than requests for assistance achieving a final outcome.

stick with it!  it gets easier with practice.