Displaying HTML widget in the map generated by QGIS2web plugin

Question

I would like to render on my map the HTML widget prepared in the QGIS. The widget looks like below.

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.

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

html qgis qgis2web

'; /*..... popupText += '

'; } but it didn't work

MKR · Answer

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. 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/

Displaying HTML widget in the map generated by QGIS2web plugin

One Answer

Add your own answers!

Ask a Question