1

I would like to render on my map the HTML widget prepared in the QGIS. The widget looks like below. enter image description here Unfortunately, the issue is not simple, because in the popup generated by QGIS 2 web all the elements come from separate files: qgis2web.css qgis2web.js, separate layer file and geojson file.

enter image description here

The standard popup provided by QGIS2web plugin looks very simple. I would like to have the header in different color and table like in my QGIS HTML widget. Is it possible?

UPDATE:

In the qgis2web.js file I tried to embed this whole HTML code inside the following section:

           if (doPopup) {
                popupText += '<li><table>';
       /*.....
           popupText += '</table>';
            }

but it didn't work

1 Answer 1

1

The QGIS2web doesn't support to display other widgets than "Fields". The HTML widget is in the "Other widgets" group. Notwithstanding in inconvenience, the HTML widget is something, which we can develop on your own both in qgis2web.css and qgis2web.js files. We just need to replicate the CSS code, which we used for our HTML widget development. We don't need to copy the <script>document.write(expression.evaluate("\"Column name\""));</script> section, because this is already included in our pop-up window generated by this plugin. Since we defined our HTML widget appearance in the <style></style> tag, we need to place it underneath the code included in our qgis2web.css code and next assign this CSS code to our table in the JavaScript code i.e.
popupText += '<li><table id="customers">';

If we do so, our pop-up window should change the appearance and look pretty much similar to our table defined in the QGIS HTML widget.

enter image description here

Moreover we can customize our pop-up window by different solutions too, changing the font color, image size and so on. The details how to do it have been provided in the link below:

http://www.mkrgeo-blog.com/qgis2web-openlayers-pop-up-customization/

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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