Добавить точки из json в mapbox в django не работает - PullRequest
0 голосов
/ 08 мая 2020

Я хотел бы поместить sh данные из файла json в mapbox в Django. Для этого я скопировал json в views.py и установил данные по умолчанию. html как контекст.

views.py

def default_map(request):
    mapbox_access_token = 'I put my token here';

    context = {
        'vessels': Vessels
    }
    return render(request, 'default.html', 
                  { 'mapbox_access_token': mapbox_access_token }, context
                    )


#Copy pasting JSON files

Vessels = [
 {
   "vessel": "A La Marine",
   "date": "20/Apr 13:18",
   "lon": 7.88499997456869,
   "lat": 53.9,
   "speed": 13.8999996185303,
   "course": "0",
   "type": "NoonReport"
 },
 {
   "vessel": "Barcelona Express",
   "date": "22/Apr 06:04",
   "lon": 11.8683216666667,
   "lat": 41.5915366666667,
   "speed": 18,
   "course": "139.7",
   "type": "CM"
 },

По умолчанию. html i пробовал разные вещи: 1) Установка маркера для l oop & 2) Ставим все маркеры после l oop

по умолчанию. html

<body>

    <h1>{{vessels.lon}}</h1>

   <div id='map' class='map' width="100%" style='height:800px'></div>
   <script>
    mapboxgl.accessToken = '{{mapbox_access_token}}'
    <!-- {{mapbox_access_token}}  -->
    var map = new mapboxgl.Map({
     container: 'map',
     style: 'mapbox://styles/mapbox/streets-v10'

    });


    var geojson = {
    type: 'FeatureCollection',
    features: [
    {% for vessel in vessels %}
      {
      type: 'Feature',
      geometry: {
        type: 'Point',
        coordinates: [{{vessel.lon}}, {{vessel.lat}}]
      },
      properties: {
        title: '{{ vessel.vessel }}',
        description: '{{ vessel.type }}'
      }
      var marker = new mapboxgl.Marker()
        .setLngLat(coordinates)
        .addTo(map); 
      },
    {% endfor %}
    ]
    };
//Test Marker
 var marker = new mapboxgl.Marker()
      .setLngLat([52,3])
      .addTo(map); 

    var mapVessels = L.mapbox.map('map')
      .setView([37.8, -96], 4)
      .addLayer(L.mapbox.styleLayer('mapbox://styles/mapbox/streets-v10'));
    var myLayer = L.mapbox.featureLayer().setGeoJSON(geojson).addTo(mapVessels);

Когда я запускаю свой сервер и проверяю это, карта показывает, но маркеры не отображаются. Когда я пробую заголовок со словом, он работает. Когда я делаю заголовок на {{Vessel.vessel}} (для проверки передачи данных между default. html и views.py), заголовка больше нет.

Почему между этими двумя не передаются данные? На данный момент я думаю, что проблема в обратном рендере, но я не могу понять этого.

Спасибо за ваше время!

...