Zoomer sur un pays lorsque vous cliquez sur le nom du pays dans un panneau latéral

Question

Dans mon application de preuve de concept (voir le lien ci-dessous), lorsque vous cliquez sur le bouton, la carte d'Haïti est mise en surbrillance et le nom du pays est affiché dans le panneau latéral. Vous zoomerez un peu plus lorsque vous cliquez sur la carte du pays et le nom d'une ville est affiché dans le panneau latéral.<\/P> <\/P> ICGC WEB PORTAL<\/A><\/P> <\/P> Je voudrais faire quelque chose de similaire en cliquant sur le nom du pays dans le panneau latéral. C'est-à-dire zoomer un peu plus sur Haïti. Toute suggestion sur la meilleure façon de réaliser cela serait appréciée.<\/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.