iag-geo / bootleaf

An open-source version of IAG's Bootleaf fork
https://demo.bootleaf.xyz
MIT License
88 stars 65 forks source link

Function Undefined #21

Open xavirayo opened 5 years ago

xavirayo commented 5 years ago

Hi! I have added a latlong graticulate to my map and would like to have the ability to turn it on/off. I think it is a very simple but can't find what I'm doing wrong. I have added the graticulate in the custom file and then created a function to remove it.

' var graticulate = L.latlngGraticule({
showLabel: true, fontcolor:"#FFFFFF", color: "#222", zoomInterval: [ {start: 2, end: 3, interval: 30}, {start: 4, end: 4, interval: 10}, {start: 5, end: 7, interval: 5}, {start: 8, end: 10, interval: 1}

    ] }).addTo(bootleaf.map);      

function latlon(){ bootleaf.map.removeLayer(graticulate); }
'

Then I added a checkbox in the Tools list with the event onchange calling the function latlon(). <input type="checkbox" name="graticulate" value="1" onchange="latlon()"></li> I'm always receiving the message that the function is not defined but I don't know where or how I should call the function.

Thank you very much!

slead commented 5 years ago

Assuming that you're using https://github.com/cloudybay/leaflet.latlng-graticule have you also added the JavaScript into the index.html?

See the demo at https://cloudybay.github.io/leaflet.latlng-graticule/example/ and note the reference to its JavaScript:

<script src="../leaflet.latlng-graticule.js"></script>

xavirayo commented 5 years ago

Thanks for your answer. Yes, that's the plgin that I'm using. And I manage to add the graticulate without problems. My problems are with the button I want to add to let the user remove the graticulate when they want. I have this code in the custom.js inside the aftermaploads function ' var graticulate = L.latlngGraticule({ showLabel: true, fontcolor:"#FFFFFF", color: "#222", zoomInterval: [ {start: 2, end: 3, interval: 30}, {start: 4, end: 4, interval: 10}, {start: 5, end: 7, interval: 5}, {start: 8, end: 10, interval: 1}

] }).addTo(bootleaf.map);      

function latlon(){ bootleaf.map.removeLayer(graticulate); } '

Then I have added a checkbox in the list of tools in the menu: <input type="checkbox" name="graticulate" value="1" onchange="latlon()"></li>

There is where I got the message that the function is not defined.

Thanks!