MapBox जीएल js - Uncaught TypeError: संपत्ति अशक्त की 'classList' पढ़ा नहीं जा सकता

वोट
1

मैं MapBox जीएल जे एस के साथ एक नक्शा बनाने रहा हूँ। मैं अपने index.html पृष्ठ पर एक नक्शा बनाया और कहा कि ठीक काम करता है लेकिन अब मैं एक अलग पृष्ठ पर एक और नक्शा बनाने के लिए कोशिश कर रहा हूँ और जब div जहां मानचित्र जाना चाहिए संदर्भित, मैं एक त्रुटि हो रही है:

ध्यान में न आया लेखन त्रुटि: संपत्ति अशक्त की 'classList' नहीं पढ़ सकता।

मुझे यकीन है कि के बाद से मैं अपने html में तत्व बनाया है और मेरी जावास्क्रिप्ट जावास्क्रिप्ट कि सफलतापूर्वक index.html पृष्ठ पर पहले मानचित्र बनाता है (लेकिन एक अलग div पर) के समान है क्यों यह हो रहा है नहीं कर रहा हूँ। मैं Node.js में यह कर रहा हूं और एक main.min.js फ़ाइल है, जो मैं दोनों index.html और दूसरा html पृष्ठ पर संदर्भ में webpack के साथ बंडल।

use strict
//here is the MapBox GL JS code at the point the error references in the console
 //_setupContainer: function() {
   //     var container = this._container;
     //   container.classList.add('mapboxgl-map');

// here is my mapbox new map creation 

const ACCESSTOKEN = < my access token >;
mapboxgl.accessToken = ACCESSTOKEN;
const map2 = new mapboxgl.Map({
  container: 'map2', 
  style: 'mapbox://styles/mapbox/dark-v9',
  center: [0,0], 
  zoom: 8.5, 
  pitch: 45, 
  bearing: 27,
  hash: false
});
<!DOCTYPE html>
<html>
 <head>
   <meta charset=UTF-8>
   <title>Mapbox example</title>
   <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />		
   <link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.18.0/mapbox-gl.css' rel='stylesheet' />
   <link rel='stylesheet' href='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-geocoder/v1.1.0/mapbox-gl-geocoder.css' type='text/css' />		
   <link rel=stylesheet type=text/css href=css/styles.css>
 </head>
  <body>
    <div id=container>
      <div id=map2></div>	
    </div>
<script src=https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.5/leaflet.js>    </script>
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.18.0/mapbox-gl.js'></script>
<script src='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-geocoder/v1.1.0/mapbox-gl-geocoder.js'></script>
<script type=text/javascript src=./js/main.min.js></script>
  </body>
</html>
      

24/05/2016 को 18:21
का स्रोत उपयोगकर्ता
अन्य भाषाओं में...                            


1 जवाब

वोट
2

यह त्रुटि इंगित करता है कि div कंटेनर कि लपेट चाहिए MapBox-जीएल कैनवास याद आ रही है।

यहाँ एक उदाहरण है कि समस्या को पुनरुत्पादित करता है: https://jsfiddle.net/kmandov/y933wwys/ (आप वेब कंसोल में त्रुटि देख सकते हैं)

var map = new mapboxgl.Map({
  container: 'map2', // <- missing div!
  style: 'mapbox://styles/mapbox/light-v8',
  center: [12.338, 45.4385],
  zoom: 1
});

आप देख सकते हैं कि आईडी के साथ एक div map2याद आ रही है। आप की जगह तो map2साथ map(मौजूदा div की आईडी), नक्शे की उम्मीद के रूप में प्रदर्शित किया जा रहा है।

आपके मामले में, इस बात की पुष्टि है कि div MAP2 समय में मौजूद है, तो आप नक्शे init। हो सकता है कि जिस तरह से आप एप्लिकेशन बंडल के साथ कुछ है।

26/05/2016 को 07:29
का स्रोत उपयोगकर्ता

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more