Zoom auf ein Land, wenn Sie auf den Namen des Landes in einem Seitenpanel klicken

Question

In meiner Proof-of-Concept-App (siehe Link unten) wird beim Klicken auf die Schaltfläche die Karte von Haiti hervorgehoben und der Name des Landes im Seitenpanel angezeigt. Sie zoomen etwas weiter hinein, wenn Sie auf die Karte des Landes klicken, und der Name einer Stadt wird im Seitenpanel angezeigt.<\/P> <\/P> ICGC WEB PORTAL<\/A><\/P> <\/P> Ich möchte etwas Ähnliches tun, wenn ich auf den Namen des Landes im Seitenpanel klicke. Das heißt, etwas weiter nach Haiti hineinzoomen. Vorschläge, wie man das am besten umsetzt, wären sehr willkommen.<\/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.