nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Leaflet gebruikt een variabele voor addTo(map)

BillChappell

OK, ik heb een eenvoudige kanker webkaart in Leaflet en ik zit vast met een probleem.<\/P>

1. Ik heb een HTML selectievakje dat, wanneer aangeklikt, een laag inschakelt. (Laagwisselaar is geen optie) dit roept in feite een functie aan en geeft de naam van de kankerlaag door. Bijvoorbeeld updateLayerVis("lung")<\/P>

<\/P>

2. Ik heb verschillende soorten kanker gedefinieerd op naam. Bijvoorbeeld var throat = new L.GeoJSON(data .....<\/P>

<\/P>

3. Dus de hierboven genoemde functie geeft de waarde 'lung' door aan 'a' hieronder. Het lijkt een domme string te zijn genaamd 'lung', terwijl addTo op zoek is naar een laag. Is het mogelijk om deze string te gebruiken om de juiste laag aan de kaart toe te voegen?<\/P>

<\/P>

function updateLayerVis(a){<\/P>

console.log(a); \/\/ lung<\/P>

a.value.addTo(map); \/\/ geeft een foutmelding "a.addTo is not a function"<\/P>

a.addTo(map); \/\/ geeft een foutmelding "a.addTo is not a function"<\/P>

lung.addTo(map); \/\/ werkt maar met 15 selectievakjes zou ik een grote switch-functie nodig hebben.<\/P>

};<\/P>

Vind meer berichten getagd met

Esri Leaflet

Accepted answers

FC_Basson

Instead of creating a variable with the name of each data layer, rather create a list of layers with the layer name as an index e.g.

<SPAN class="keyword token">var</SPAN> maplayers <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN>
maplayers<SPAN class="punctuation token">[</SPAN><SPAN class="string token">"lung"</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">L<SPAN class="punctuation token">.</SPAN>GeoJSON</SPAN><SPAN class="punctuation token">(</SPAN>data<SPAN class="punctuation token">.</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="punctuation token">.</SPAN>
maplayers<SPAN class="punctuation token">[</SPAN><SPAN class="string token">"throat"</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">L<SPAN class="punctuation token">.</SPAN>GeoJSON</SPAN><SPAN class="punctuation token">(</SPAN>data<SPAN class="punctuation token">.</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Then when clicking on the checkbox you can use the string value to activate the indexed layer.

<SPAN class="keyword token">function</SPAN> <SPAN class="token function">updateLayerVis</SPAN><SPAN class="punctuation token">(</SPAN>a<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
&nbsp;&nbsp; <SPAN class="keyword token">var</SPAN> lyr <SPAN class="operator token">=</SPAN> maplayers<SPAN class="punctuation token">[</SPAN>a<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp; lyr<SPAN class="punctuation token">.</SPAN><SPAN class="token function">addTo</SPAN><SPAN class="punctuation token">(</SPAN>map<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

All comments

FC_Basson

Yes, applying the addTo function directly to the indexed layer item should also work. It's just nice to have the item available as a short variable if you need to refer to it further down in the function again.

BillChappell

I was going toward this route when I saw your answer. It was cleaner then mine so I tried it. I also tried mapLayers.addTo(map); and this worked.

FC_Basson

Instead of creating a variable with the name of each data layer, rather create a list of layers with the layer name as an index e.g.

<SPAN class="keyword token">var</SPAN> maplayers <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN>
maplayers<SPAN class="punctuation token">[</SPAN><SPAN class="string token">"lung"</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">L<SPAN class="punctuation token">.</SPAN>GeoJSON</SPAN><SPAN class="punctuation token">(</SPAN>data<SPAN class="punctuation token">.</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="punctuation token">.</SPAN>
maplayers<SPAN class="punctuation token">[</SPAN><SPAN class="string token">"throat"</SPAN><SPAN class="punctuation token">]</SPAN> <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">L<SPAN class="punctuation token">.</SPAN>GeoJSON</SPAN><SPAN class="punctuation token">(</SPAN>data<SPAN class="punctuation token">.</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Then when clicking on the checkbox you can use the string value to activate the indexed layer.

<SPAN class="keyword token">function</SPAN> <SPAN class="token function">updateLayerVis</SPAN><SPAN class="punctuation token">(</SPAN>a<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
&nbsp;&nbsp; <SPAN class="keyword token">var</SPAN> lyr <SPAN class="operator token">=</SPAN> maplayers<SPAN class="punctuation token">[</SPAN>a<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp; lyr<SPAN class="punctuation token">.</SPAN><SPAN class="token function">addTo</SPAN><SPAN class="punctuation token">(</SPAN>map<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>‍‍‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

JohnGravois

check out this stack overflow thread.

http://stackoverflow.com/questions/5613834/convert-string-to-variable-name-in-javascript

Doe mee aan het gesprek

Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.

Snelle Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.