未捕获参考错误：mapboxgl未定义

我动态加载Mapbox-GL JS这样：未捕获参考错误：mapboxgl未定义

 var script = domConstruct.create("script"); 
     script.type = "text/javascript"; 
     script.charset = "utf-8"; 
     script.onload = instantiateMap(); 
     script.src = "https://api.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js"; 
     script.async = false; 
     document.getElementsByTagName("head")[0].appendChild(script);

然后在某个时候，我访问它作为“instantiateMap”功能如下：

 mapboxgl.accessToken = 'pk.eyJ1IjoibW11a2ltIiwiYSI6ImNqNnduNHB2bDE3MHAycXRiOHR3aG0wMTYifQ.ConO2Bqm3yxPukZk6L9cjA'; 
     var map = new mapboxgl.Map({ 
     container: mapParent, 
     style: 'mapbox://styles/mapbox/streets-v9' 
     });

只要我控制到达线路（mapboxgl.accessToken ...）这让我在Chrome控制台以下错误：

Uncaught ReferenceError: mapboxgl is not defined 
    at Object._instantiateMap (VM2337 Sample.js:282) 
_instantiateMap @ VM2337 Sample.js:282

这个特殊的代码片段工作在下列情况下，罚款： - 包括Mapbox-GL.js动态也是一个独立的HTML文件正常工作。 - 将静态库包含在HTML文件中。

我知道，库加载很好，因为我看到它在源下的左侧面板中，但我不知道，为什么在访问mapboxgl对象，这个错误出现。

而且我已经尝试包括以类似的方式其他库（jQuery的，mapbox.js），他们工作得很好。

任何帮助将不胜感激！

来源

2017-09-13 user3455358

我觉得“然后在某个时候”是你的问题。你需要确保脚本在你做任何事之前运行。 –

UPDATE：原因是在道场加载器加载之前，我试图加载脚本，并因为这装载机是现在负责加载脚本前进，它承认Mapbox-GL是不是AMD模块，因此它不会加载它正确。另外，我正在使用Dojo'require'来动态加载脚本。 – user3455358

在没有看到源代码，我无法测试或修复错误。

我的猜测是，该脚本也不是因为剧本的大小或代码的顺序的实例之前加载。

我会亲自使用回叫功能是为了确保只有实例化时发生文件被完全下载（未测试）

JavaScript.load("https://api.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js", function() { 
     mapboxgl.accessToken = 'pk.eyJ1IjoibW11a2ltIiwiYSI6ImNqNnduNHB2bDE3MHAycXRiOHR3aG0wMTYifQ.ConO2Bqm3yxPukZk6L9cjA'; 
     var map = new mapboxgl.Map({ 
     container: mapParent, 
     style: 'mapbox://styles/mapbox/streets-v9' 
     }); 
    }); 

    var JavaScript = { 
     load: function(src, callback) { 
     var script = document.createElement('script'), 
      loaded; 
     script.setAttribute('src', src); 
     if (callback) { 
      script.onreadystatechange = script.onload = function() { 
      if (!loaded) { 
       callback(); 
      } 
      loaded = true; 
      }; 
     } 
     document.getElementsByTagName('head')[0].appendChild(script); 
     } 
    };

来源

2017-09-14 09:28:59 RedCrusador

未捕获参考错误：mapboxgl未定义

回答

相关问题