Comments (11)
mattmakai
commented on September 14, 2024
hmm, I'm not sure what the problem is without further info. the map that shows up on this page for the tutorial https://www.fullstackpython.com/blog/maps-django-web-applications-projects-mapbox.html is roughly the same as what you should have in a Django application as well
from fullstackpython.com.
dstevenscal
commented on September 14, 2024
Unfortunately no error message is being displayed by django.
I've put the code from default.html and urls.py below - maybe I missed something?
I've changed my actual token to 'mymapboxtoken'
<!DOCTYPE html>
<html>
<head>
<title>Hey Interactive maps for Django web apps</title>
<script src='https://api.mapbox.com/mapbox-gl-js/v0.44.2/mapbox-gl.js'></script>
<link href='https://api.mapbox.com/mapbox-gl-js/v0.44.2/mapbox-gl.css' rel='stylesheet' />
</head>
<body>
<h1>Map time and stuff3</h1>
<div id='map' width="100%" style='height:400px'></div>
<script>
mapboxgl.accessToken = {{ 'mymapboxtoken' }};
var map = new mapboxgl.Map({
container: 'HTMLElement',
style: 'mapbox://styles/mapbox/satellite-streets-v10a',
center: [-77.03, 38.91],
zoom: 9,
bearing: 180
});
</script>
</body>
</html>
from views.py
from django.shortcuts import render
# Create your views here.
def default_map(request):
# TODO: move this token to Django settings from an environment variable
# found in the Mapbox account settings and getting started instructions
# see https://www.mapbox.com/account/ under the "Access tokens" section
mapbox_access_token = 'mymapboxtoken'
return render(request, 'default.html',
{ 'mapbox_access_token': mapbox_access_token })
from fullstackpython.com.
mattmakai
commented on September 14, 2024
you shouldn't have quotes around your mapbox token like that: mapboxgl.accessToken = {{ 'mymapboxtoken' }};
should be mapboxgl.accessToken = '{{ mymapboxtoken }}';
from fullstackpython.com.
mattmakai
commented on September 14, 2024
also your container should not be 'HTMLElement', it's 'map' because that's what your div is id'd
from fullstackpython.com.
dstevenscal
commented on September 14, 2024
When I take away the quotes from the token I get message 'pk' is not defined - the first 3 characters are pk.
from fullstackpython.com.
mattmakai
commented on September 14, 2024
sounds like you're not properly passing in the variable. can you start with the example given in the blog post then modify from there? that's why you're having trouble. don't customize before you get the basic scenario working
from fullstackpython.com.
dstevenscal
commented on September 14, 2024
I did, I get the same results. The only difference is I can see is I’m on Windows 10, I think the example uses Linux?
… On Apr 7, 2019, at 7:52 AM, Matt Makai ***@***.***> wrote:
sounds like you're not properly passing in the variable. can you start with the example given in the blog post then modify from there? that's why you're having trouble. don't customize before you get the basic scenario working
—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub, or mute the thread.
from fullstackpython.com.
mattmakai
commented on September 14, 2024
Operating system won’t make a difference here for this example. I had it
work on macOS, Linux and Windows. Are you sure there are no errors in the
web browser console?
On Sun, Apr 7, 2019 at 17:50 dstevenscal ***@***.***> wrote:
I did, I get the same results. The only difference is I can see is I’m on
Windows 10, I think the example uses Linux?
> On Apr 7, 2019, at 7:52 AM, Matt Makai ***@***.***> wrote:
>
> sounds like you're not properly passing in the variable. can you start
with the example given in the blog post then modify from there? that's why
you're having trouble. don't customize before you get the basic scenario
working
>
> —
> You are receiving this because you authored the thread.
> Reply to this email directly, view it on GitHub, or mute the thread.
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
<#208 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AASoglKVVZlPIrbQI5XLe78Igspz4FGIks5vehPRgaJpZM4cghZG>
.
--
Sent from my TI-83 Graphing Calculator
from fullstackpython.com.
dstevenscal
commented on September 14, 2024
I stepped away from my computer for a bit, I’ll re-run just to confirm shortly. Thanks
… On Apr 7, 2019, at 9:18 AM, Matt Makai ***@***.***> wrote:
Operating system won’t make a difference here for this example. I had it
work on macOS, Linux and Windows. Are you sure there are no errors in the
web browser console?
On Sun, Apr 7, 2019 at 17:50 dstevenscal ***@***.***> wrote:
> I did, I get the same results. The only difference is I can see is I’m on
> Windows 10, I think the example uses Linux?
>
> > On Apr 7, 2019, at 7:52 AM, Matt Makai ***@***.***> wrote:
> >
> > sounds like you're not properly passing in the variable. can you start
> with the example given in the blog post then modify from there? that's why
> you're having trouble. don't customize before you get the basic scenario
> working
> >
> > —
> > You are receiving this because you authored the thread.
> > Reply to this email directly, view it on GitHub, or mute the thread.
>
> —
> You are receiving this because you commented.
> Reply to this email directly, view it on GitHub
> <#208 (comment)>,
> or mute the thread
> <https://github.com/notifications/unsubscribe-auth/AASoglKVVZlPIrbQI5XLe78Igspz4FGIks5vehPRgaJpZM4cghZG>
> .
>
--
Sent from my TI-83 Graphing Calculator
—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub, or mute the thread.
from fullstackpython.com.
dstevenscal
commented on September 14, 2024
I started from scratch, recreating the project again, and I'm getting the same blank page.
Here's what my console says:
Not getting any error message.
I tried to create a deliberate error by changing default.html from:
<title>Interactive maps for Django web apps</title> <script src='https://api.mapbox.com/mapbox-gl-js/v0.44.2/mapbox-gl.js'></script>Map time!
<script> mapboxgl.accessToken = {{ 'mymaptoken' }}; var map = new mapboxgl.Map({ container: 'map', style: 'mapbox://styles/mapbox/streets-v10' }); </script>
Which I changed to:
<title>Interactive maps for Django web apps</title> <script src='https://nosuchapi.mapbox.com/mapbox-gl-js/v0.44.2/mapbox-gl.js'></script>Map time! diff
<script> mapboxgl.accessToken = {{ 'mytoken' }}; var map = new mapboxgl.Map({ container: 'map', style: 'nosuchmapbox://styles/mapbox/streets-v10' }); </script>
Map time! diff shows up, but no error message. It seems like nothing is actually reaching mapbox. The script isn't getting run at all.
from fullstackpython.com.
mattmakai
commented on September 14, 2024
Chrome dev tools console output debugging is your best bet here. You should write to Mapbox support, perhaps they can easily identify what's going on.
from fullstackpython.com.
Related Issues (20)
- StarterBot Certificate issues HOT 2
- logger issue
- Flask app logger not working when running within gunicorn
- Async
- Dial number then extra keys HOT 1
- slackclient changes have made this tutorial obsolete HOT 1
- Section on Natural Language Processing HOT 3
- Learning pandas by Exploring COVID19 using panda version 1.0.1
- How to insert the marker in Mapbox using Django
- Blog RSS feed
- Guidelines for Experienced Developers
- Link for Generators on Python page?
- Inaccurate Description of Microsoft/Oracle in Enterprise Python
- Queues.io is archived
- AttributeError: module 'plugins.pelican-toc' has no attribute 'register'
- Django-user-visit
- Speechmatics - try it out?
- Broken link on Flask main page
- Content update suggestion
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fullstackpython.com.