Web Mapping with the IUENNA Project

Overview

This web mapping project demonstrates how to create Web Mapping Applications (WMAs) effectively using QGIS, the qgis2web plugin, and Artificial Intelligence (AI) tools, such as OpenAI's ChatGPT.

WMAs are versatile tools for visualizing spatial data, making them invaluable in fields like archaeology. They enhance the accessibility and management of archaeological datasets by providing intuitive, interactive maps. With features like layers and markers, WMAs allow researchers and the public to explore, analyze, and interact with large collections of archaeological data.

For the IUENNA project, WMAs serve as gateways to navigate archaeological records from the Jauntal region. They enable users to gain an overview of the dataset or perform targeted searches for specific resources or groups of objects. By complementing the ARCHE repository, these applications add customizable, interactive layers tailored to specific tasks, simplifying daily workflows and improving usability.

This approach democratizes access to cultural heritage by transitioning from analog resources, often restricted to single-user access at physical locations, to globally accessible, structured digital platforms enriched with metadata. This not only enhances usability but also reduces mechanical stress on fragile physical artifacts, ensuring their preservation for future generations.

A crucial component in building WMAs is the use of open-source JavaScript libraries, such as OpenLayers and Leaflet. These libraries enable the addition of interactive map layers, markers, geometries, and other features, making them essential tools for web mapping development.

General Steps to Create a WMA

1. Download and install QGIS on your computer to start working with geospatial data.
2. Prepare your data in QGIS by adding vector data (e.g., Shapefiles) or raster data (e.g., satellite imagery or DEMs). Ensure that your data is properly projected and organized for web mapping purposes.
3. Export your data from QGIS as GeoJSON, a widely used format for web mapping, to provide the necessary data for your web mapping application (WMA) or Generative AI (GenAI) workflows.
4. Install the qgis2web plugin through the QGIS Plugin Manager. This plugin is essential for exporting your QGIS project to a web-based format.
5. Export your project as a web map using the qgis2web plugin. You can choose between rendering your map with Leaflet or OpenLayers, depending on your needs and familiarity with these libraries.
6. Upload the exported files (HTML, CSS, JavaScript, or GeoJSON) to a hosting platform, such as a GitHub repository, institutional server, or personal website, ensuring accessibility and reliability.
7. Activate GitHub Pages (or another hosting service) for your repository to make your web mapping application (WMA) available online for users to access.
8. Enhance your WMA by customizing the code. For example, you can add additional features, refine the styling, or optimize the user interface. Here, GenAI tools like OpenAI's ChatGPT can assist in modifying your WMA or working with the exported GeoJSON data to implement advanced functionality efficiently.
9. Alternatively, you can leverage GenAI tools to directly generate your WMA or even create the entire accompanying website, saving significant development time while ensuring customization to your specific needs.

Back to Top

Examples Using GenAI and qgis2web

Below are two interactive Web Mapping Applications (WMAs) created using cutting-edge tools: GenAI and the qgis2web plugin. These applications provide access to IUENNA's comprehensive dataset, demonstrating how digital tools enhance the exploration and management of archaeological data:

Back to Top

Contents and tools provided on this webpage, including one WMA, have been generated and enhanced using GenAI tools. These tools assist in creating high-quality content efficiently. However, the webpage or WMA itself do not utilize AI technologies for its functionality or operation.

Key Points Regarding Our Use of GenAI:

• Content Generation: GenAI tools have been used to assist in drafting, optimizing, or enhancing certain text elements displayed on this website.
• Human Oversight: All AI-generated content is reviewed and validated by our team to ensure accuracy, relevance, and adherence to ethical standards.
• Transparency: We are committed to openly disclosing the use of AI in our content creation process.

For inquiries or concerns about our use of GenAI, feel free to contact us at dominik.hagmann@univie.ac.at.

Example Code

The following HTML code shows a minimalist web mapping integration using Leaflet:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Example Map</title>
    <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
    <script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
</head>
<body>
    <div id="map" style="width: 100%; height: 500px;"></div>
    <script>
        var map = L.map('map').setView([46.5647, 14.8222], 13);
        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
    </script>
</body>
</html>
            

Back to Top

Live WMA

Below is an embedded example of a live web mapping application powered by Leaflet:

Back to Top

Using GenAI Tools

GenAI tools like ChatGPT by OpenAI, Claude by Anthropic, and Gemini by Google DeepMind are transformative technologies that are revolutionizing how digital content and web applications are created. These tools leverage cutting-edge machine learning to assist in generating content, refining existing work, and even producing code tailored to specific needs.

ChatGPT is widely recognized for its versatility in coding and text generation. It is frequently used to troubleshoot issues, write boilerplate code, and refine technical documentation. Claude excels in creating detailed, structured documents and complex reports, making it a favorite for academic and professional workflows. On the other hand, Gemini is specifically designed for multimodal tasks, seamlessly integrating text, images, and data into cohesive outputs, which is particularly useful for visually engaging web pages and interactive applications.

GenAI tools enhance productivity in many ways. They automate repetitive tasks such as generating code snippets or modifying project structures, enabling developers to focus on more complex and creative challenges. For beginners, these tools lower the entry barrier by offering step-by-step guidance, simplifying technical concepts, and generating initial templates. By providing accurate suggestions and following best practices, GenAI significantly reduces the time spent debugging and troubleshooting. Additionally, it offers tailored outputs to meet the specific requirements of projects, whether it's a unique design, advanced functionality, or optimized workflows. This versatility allows GenAI to support a broad range of applications, from content creation and data visualization to UI/UX design and geospatial analysis.

In the context of web mapping, GenAI plays a pivotal role. For instance, developers can export GeoJSON data from QGIS and use tools like ChatGPT to implement and customize web mapping applications more effectively. ChatGPT can generate JavaScript code to integrate GeoJSON data into frameworks like Leaflet or OpenLayers, saving hours of manual scripting. Similarly, AI tools can suggest improvements to user interfaces, such as adding search filters, tooltips, or interactivity, ensuring a seamless experience for users.

GenAI is not just a tool for efficiency but also an enabler of digital innovation. By democratizing access to advanced technologies, it allows users with minimal technical knowledge to create and share impactful projects. This combination of accessibility and versatility makes GenAI indispensable in modern workflows.

For further exploration, you can visit resources such as ChatGPT by OpenAI, Claude by Anthropic, and Gemini by Google DeepMind.

Back to Top

Benefits and Drawbacks

Creating and enhancing web mapping applications (WMAs) using tools like QGIS, qgis2web, and GenAI offers numerous benefits. One of the key advantages is cost efficiency. With free and open-source tools such as QGIS and Leaflet, users can avoid expensive licensing fees. Hosting platforms like GitHub Pages provide a reliable and cost-effective way to share applications online.

Another significant benefit is the ease of use. QGIS, combined with the qgis2web plugin, provides an intuitive interface that allows users to create interactive maps without advanced technical knowledge. GenAI further simplifies the process by automating complex tasks, offering guidance, and providing ready-to-use templates for web development.

Flexibility is another strength of this approach. Web mapping projects can start simple and scale up as needed, integrating additional features like layers, interactive markers, or filters. Once the workflow is established, it can be easily reproduced for other datasets, enhancing productivity and consistency.

One of the most transformative aspects of this workflow is its ability to democratize access to cultural and spatial data. By hosting WMAs online, researchers can make valuable datasets globally accessible, removing traditional barriers such as physical storage or limited access to analog resources. This shift also reduces mechanical strain on physical objects, preserving fragile archaeological materials.

However, there are also drawbacks to consider. Although tools like QGIS are user-friendly, a basic understanding of GIS concepts is still required, which can be a barrier for beginners. Additionally, while GenAI tools can generate and modify code, they are not foolproof. Users must carefully validate outputs to ensure functionality and accuracy.

Performance limitations can also arise when working with large datasets. Web browsers may struggle with rendering extensive GeoJSON files or complex map layers, especially on low-resource devices. Furthermore, hosting on free platforms like GitHub Pages may impose restrictions on file sizes or configurations.

Finally, data privacy and security should not be overlooked. Exporting and hosting sensitive data online requires careful consideration of data protection policies, especially when using external platforms or GenAI tools.

Despite these challenges, the benefits of using WMAs, QGIS, and GenAI far outweigh the drawbacks, making this approach a powerful and innovative solution for modern digital projects.

Back to Top