Вставить виджет карты ESRI в расширенный HTML-файл шаблона djando - PullRequest
Новая
       27

Вставить виджет карты ESRI в расширенный HTML-файл шаблона djando

0 голосов
/ 10 июля 2019

Я пытаюсь встроить виджет карты ESRI в шаблон HTML, который расширен из другого основного файла HTML. Мастер называется layout.html и использует JQuery и Bootstrap с блоком для контента.

В файле layout.html есть раздел скрипта с определенным $ (document) .ready (fn () {..}). Только расширенная страница

Я не могу получить виджет ESRI для карты, отображаемой где-либо на странице.

Я попытался поместить скрипт в начало расширенного файла, затем в тело расширенного файла, а затем в конец блока скриптов в файле layout.html, но безрезультатно. 

<script src="https://js.arcgis.com/4.12/"></script>

Я получаю ошибку: 

dojo.js:24 Error: multipleDefine
    at r (dojo.js:5)
    at Ia (dojo.js:21)
    at dojo.js:22
    at f (dojo.js:4)
    at Sa (dojo.js:22)
    at b (dojo.js:21)
    at HTMLScriptElement.<anonymous> (dojo.js:23)

При перемещении указанных скриптов в нижний колонтитул я получаю сообщение об ошибке с указанием эта маска $ (). не определена, если у меня есть jquery.mask.js.

Файл layout.html содержит следующие включения в конце файла: 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/additional-methods.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.form/4.2.2/jquery.form.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.15/jquery.mask.min.js"></script>
    <script type="text/javascript" src="{% static 'home/js/bootstrap.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'home/js/custom/register.js' %}"></script>
    <script type="text/javascript" src='https://www.google.com/recaptcha/api.js'></script>
    <script type="text/javascript" src="{% static 'home/js/slick.js' %}"></script>
    <script type="text/javascript" src="{% static 'home/js/jquery.mCustomScrollbar.min.js' %}"></script>

Расширенная страница ... maps.html. 

% extends "home/layout.html" %}
{% load static %}
{% block content %}
<script src="https://js.arcgis.com/4.12/"></script>
<div id="viewDiv"></div>
<script>

      var featureLayer;
      var view; 
      var mymap; 

      function doMe() { 


      console.log("Hello.....")
      require([
        "esri/Map",
        "esri/views/MapView",
        "esri/layers/FeatureLayer"
      ], function(Map, MapView, FeatureLayer) {
        mymap = new Map({
          basemap: "hybrid"
        });

        view = new MapView({
          container: "viewDiv",
          map: mymap,

          extent: {
            // autocasts as new Extent()
            xmin: -9177811,
            ymin: 4247000,
            xmax: -9176791,
            ymax: 4247784,
            spatialReference: 102100
          }
        });

        /********************
         * Add feature layer
         ********************/

        // Carbon storage of trees in Warren Wilson College.
        featureLayer = new FeatureLayer({
          url:
            "https://services.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/Landscape_Trees/FeatureServer/0"
        });

        map.add(featureLayer);
        });
      }
    </script>
{% endblock %}

Вызов функции doMe () в консоли приводит к созданию множества виджетов!

Может кто-нибудь, пожалуйста, помогите мне настроить это.

...