2

I am kind of a beginner. I have exported my webmap using QGIS2Web and while playing with it, I was able to change the settings of the items already present on the map (for example position, language, zoom levels, etc.) Although, I would like to add some functions to it.

I want to add the Leaflet.Dialog plugin (https://github.com/NBTSolutions/Leaflet.Dialog), but I'm failing somewhere. In my export folder, I added both the .css and .js to the project and imported it with a link and script tag.

I then added this to the index.html :

var dialog = L.control.dialog(options)
          .setContent("<p>Hello! Welcome to your nice new dialog box!</p>")
          .addTo(map);

Why does this code not show anything?

Here is the code to link the plugin :

<link rel="stylesheet" href="css/Leaflet.Dialog.css">
<script src="js/Leaflet.Dialog.js"></script>
  • Really tricky to figure this out. No errors in the browser console? – Tom Chadwin Mar 14 at 21:45
  • In the browser console, I get the error Uncaught ReferenceError: options is not defined. I edited the post to show you how I linked it. I'm guessing the error is there since it doesn't seem the recognize the command. – Marmo Mar 15 at 14:04
2

In the example code you have copied, option is a placeholder for any options listed here:

https://github.com/NBTSolutions/Leaflet.Dialog#options

You put the options as key:value pairs, comma-separated, in braces {}. For example:

var dialog = L.control.dialog({size: [200, 150], position: bottomright})
          .setContent("<p>Hello! Welcome to your nice new dialog box!</p>")
          .addTo(map);

Alternatively, you can just leave out the options completely to get the defaults, as the demo page linked from the plugin repo does:

var dialog = L.control.dialog()
          .setContent(contents)
          .addTo(map);

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.