Bonus Video: Intro to Leaflet

Thanks for the tutorial! It definitely piqued my interest!

Thanks! It is to the point and most of the explanations are great. However, * I expected more based on the topic and did not get all what I expected personally, I would love to have more interactive map with additional functionalities not just static map at the end of the course.

• the course can be improved by:
• Explaining the concepts in detail, as it was not detail enough particularly when it comes to the views
• Add more on the mapping aspect, I think most people will take this course if you focus and strengthen the GIS part. There are lots of course on Django and what is missing is the link with GIS which you did elegantly but lacks depth.

Thanks and happy to come back and check when you have more courses on this.

Thanks for your feedback and suggestions. While it was a conscious decision to keep the course short (which abbreviated the GIS and Leaflet parts), maybe this is an opportunity for a multi-part series?

Thanks for your response. I agree, to keep course shorter and to the point it right. Please add new courses as series.

Thanks for your response. I agree, to keep course shorter and to the point it great. Please add new courses as series.

I second the multi-series. I work with GIS systems and would love to have an alternative resource for making interactive maps for public-facing data.

If we expanded the series, what platforms would you like covered? Do you think open source, like a QGIS, OpenStreetMap, Google Maps / Leaflet? Or Mapbox? Esri? The RP courses tend to be shorter and to the point, so it might be individual articles and videos arranged as a collection.

This tutorial was awesome . I’m developing a platform for an IoT project about remote monitoring. It would be great incorporating google maps or Mapbox, as well as how to display alerts or something when a parameter is being sent from a remote device. I’ll wait for any resource.

Thank you!!!

Kevin M, thanks for the feedback! Your project sounds really interesting. Do you plan to use Postgres for the data?

I’m evaluating different options. The main idea is to develop my own platform as well as my own servers. I’m actually considering to connect the devices (raspberry, etc) to a Postgres database. So, all connected devices must be displayed in the platform (a map where all locations are shown). However, when a button is pressed the raspberry (or any other microcontroller) should send a parameter (1 or 0) and the map must show an alert with all info of the place where that alert is being sent.

The easiest way is to simply use an IoT cloud and configure a simple map in a Dashboard for that cloud. But I’m actually trying is to set up everything from scratch. So, I’m trying to connect a device to Postgres and store the parameter and load that data in the platform. Yes, all devices will be around the city and must be monitor form a central place.

Any resources you could share would be wonderful.

(I’m good at doing Data Science and sensors/devices programming with Python. But trying to get better at building web platforms for Internet of Thing Projects)

I predominately work with ESRI and the ArcGIS appsuite, so I would be curious to see some of the geoprocessing functions from a different set of eyes. Or how to make webapps with my already defined maps from ArcGIS Online. Now that would be a fantastic tutorial (for me…)

Similar to bultita, I could have used a little more detail. Overall this course was good and I learned a lot. Thank you!

I think it is better to keep using the open source software you have used plus add mapbox if possible. Django - plotly dash integration would also be a great addition as there is no such course out there but it can help to link django with dash - dashboard and it has a GIS capabilities.

This is so awesome!!!!!!!!!!!!!!!!!!

Thank you so much for this tutorial. I attempted to deploy this project as part of my portfolio project. My issue is connecting the project to a hosted Database. I could not find an excellent place to host the DB with considerations to PostGIS. I would love a recommendation as to where to host the data so that I could get this up and running, and again thank you.

Hi @eclaudio, this is not to endorse any product over another, but I have not had any issues hosting PostGreSQL/PostGIS on AWS. I don’t think it makes a difference where, as long as when you go to install the PostGIS extensions using the PostGres admin tool, just point to the remote resource address (vs a local db resource name). You mention “portfolio”, so if you are a student, AWS offers a free tier with some added features for education customers. Even without those education extras, the free tier should allow you to install the PostGIS extensions without incurring any costs. There might be a trial time or usage, but it should be fine to try out your code in the short term. Hope that helps.

Hello Jackie, Wow…I’m really impressed. Being fairly new with Python, Django, Postgres and total newbie in GIS, this really helped to understand how the pieces fit together a lot better. I was impressed that the final map was indeed interactive. I clicked/held mouse down in the middle and panned the map left and right. Zooming in did give lots more detail. Certainly appreciate the detail on using Django and how you loaded the data. You really packed a lot of information into a single course!

I’m now wondering if there is a way to show mouse hover text over the marker points that give more detail on the locations found. That way, the address doesn’t take up valuable screen space especially for smaller form factor browser devices. Perhaps for a Part 2, you could show that “Geo coding” concept where a user keys in their own city/state -or- zipcode and using a centerpoint maybe…find nearest locations....using Python 3.7?

Appreciate ya! Dave

Hello Jackie, Thank you so much for putting this tutorial together; i enjoyed every bit of it and learned some new stuff.. I’m always new to the POSTGIS feature on postgres and you made it look so easy and fun to follow and implement. With the current situation here in Italy, I’m thinking of making a location web-based Covid-19 application that tells us in real time how many free spaces there are in the different departments of all Italian Covid-19 hospitals and within the same same project an app where it is possible to load the availability of housing to accommodate healthcare personnel who must move quickly from a certain region to a certain hospital to help people who are sick. I would appreciate if you could kindly up the series with more details on the already used tools. Thank you once again. Philip

Great Tutorial Jackie. Another series would be even better to have more interactive maps and features than a static map at the end exhausting GIS applicability with Django/PostgreSQl

Thank you.

I am playing around with the code and trying to set markers for each shop and include a popup with the shop’s name. This is the code I’m working with and it’s not working:

    {% for shop in shops %}
    var mark = L.marker([{{ shop.location.y }}, {{ shop.location.x  }}], {
    }).addTo(map)
    .bindPopup(shop.name);
    {% endfor %}

Any suggestions?

Is that Javascript you are using in between the python template tags? If so you should have it in a script tag in your html file.

@Stazy You need to put shop.name inside handlebars {{ ... }}, like you’ve done with shop.location.y so it is treated as a django template variable. And inside quotes "" to make it a string.

{% for shop in shops %}
var mark = L.marker([{{ shop.location.y }}, {{ shop.location.x  }}], {
}).addTo(map)
.bindPopup("{{ shop.name }}");
{% endfor %}

it would be awesome to expand this series with OpenStreetMap and Leaflet. Optional Mapbox, since there is a good free tier. I would love to see how a user could interact (with the map in the sense): * user can click on the map to store its position (i.e. for getting a delivery) * user can select a shop when clicking on a marker * shops can have a “delivery coverage” and users only select shops that delivers to his current location * delivery person gets route to follow (walking or by car)

This was a great tutorial. I really enjoyed the connection of the many different parts in this application: Postgres, Django, GeoDjango, Leafletjs. Plus the data source of overpass-turbo.eu was interesting and a great learning experience for me. I echo the comments of others to encourage more tutorials along this line. Thank you.

I ran into many problems setting up the virtual environment. I did a bunch of googleing to learn what a virtual environment is and how to change PATH variables, but then I discovered Anaconda. I was able to set up the virtual environment and complete the project using Anaconda. I think it was much easier while actually being more dynamic. I like QGIS, but they’ve changed their program downloads since you made this series, so you have to download the older QGIS editions for this process to work the way you have set up in the videos.

I really enjoied the series and learned a lot thank you!

ps one big issue with the venv that I ran into early on was using the command

“python venv myvenv”

and not

“python3 venv myvenv”

this is because in the video you display the former accross the screen, but then when you type in the video you use the latter. This took a long time for me to catch.

Thank you, that did what it said on the tin in terms of establishing the fundamentals of creating a Location based app with Django. I certainly enjoyed the style, detail and pace of the course. I feel confident that I can move forward from here in an informed manner.

My #1 takeaway - being introduced to overpass-turbo.eu What a great resource for grabbing geospatial data for my future projects!

Very pleased with myself for getting to the end and then the bonus of seeing an interactive map on the page :) Loved the way you explained the workings in some of the areas. Really helpful. Was hoping to see a bit more interaction with user input at the end but I guess that would make the course long - so maybe a part 2 for this would be nice.

Other thing I was wondering about is how you’d manage larger city files? I’m in Singapore so thought I’d download that but it warned me that it might be too big so I cancelled it. But how would you deal with that?

I had a couple of issues getting all the necessary components installed, especially the drivers - (for Windows). I even deleted everything and started again only to get the same error - then read comments from other students and found the answer. Best way to learn!

It would be nice to update this course with the latest versions available so the installation screens match and perhaps mention the different commands for different OS (where different).

Great project.

Thank you Jackie for this concious course. I echo with bultita’s third point. There are hundreds of tutorials in udemy or youtube for Django. But, it is difficult to find a good coures Django with GIS.

I think it would be very helpful to extend few more lectures on the models, how someone can enter longitutde, latitude data from Django admin, perhaps writing scripts to upload CSV/Json files with different sets of data.

Thank you for the great tutorial! I encountered just one issue on the final Leaflet portion:

        {% for shop in shops %}
            var circle = L.circle([{{ shop.location.y }}, {{ shop.location.x }}], {
                color: 'red',
                fillColor: '#f03',
                fillOpacity: 0.5,
                radius: 5
            }).addTo(map);
        {% endfor %}

My editor is expecting a js expression before the first ‘%’. Any suggestions? I’ve nested this within the same script tags as the map.

Hi @JoeFred is the code still working and is it just your editor complaining, or do you run into an error?

If it’s just an editor alert, then you can ignore it. It can be hard for an editor syntax highlighter (or linter) to figure out such nested languages. In this case it’ll have to understand HTML that contains Django templating language that contains JavaScript code, so that might just be too much for whatever plugin is trying to tackle it : )

If it’s not working as expected, can you describe in more detail what doesn’t work and what you see instead of the expected result?