react-redux-mapbox-gl icon indicating copy to clipboard operation
react-redux-mapbox-gl copied to clipboard

addSource Style Not Loading

Open swissums opened this issue 7 years ago • 0 comments

When I use mapboxgl API addSource this.map.addSource('api', { type: 'geojson', data: './map.geojson' }); I get a Style is not done loading Error. I have also tried with data from a localhost url.

Here is my whole component code:

class HomeMap extends React.Component {
  getMap = (map) =>{
  	this.map = map;
  };

  componentWillMount(){
		this.mapOptions = {
			style : 'mapbox://styles/mapbox/streets-v9',
      center: [13.377, 52.499],
      zoom: 9.8,
      dragPan : true
		};
		this.mapStyle = {
      position : 'fixed',
			width : '100%',
			height : '100%',
		};
  }

  componentDidMount(){
    this.map.addSource('baumapi', {
      type: 'geojson',
      data: './map.geojson'
    });
    this.map.addLayer({
      'id': 'baumapi',
      'type': 'circle',
      'source': 'baumapi',
      'layout': {
          'visibility': 'visible'
      },
      'paint': {
          'circle-radius': 8,
          'circle-color': 'rgba(55,148,179,1)'
      }
    });
  }

  render(){
    var mapAccessToken = 'token';
		return (
			<Mapbox
				mapboxgl={mapboxgl}
				accessToken={mapAccessToken}
				getMap={this.getMap}
				style={this.mapStyle}
				options={this.mapOptions}
			>
			</Mapbox>
		);
	}
}

Here is the error tree:

Uncaught Error: Style is not done loading
    at t._checkLoaded (:3001/static/js/bundle.js:24294)
    at t.addSource (:3001/static/js/bundle.js:24294)
    at e.addSource (:3001/static/js/bundle.js:24376)
    at HomeMap.componentDidMount (:3001/static/js/bundle.js:20409)
    at :3001/static/js/bundle.js:27911
    at measureLifeCyclePerf (:3001/static/js/bundle.js:27722)
    at :3001/static/js/bundle.js:27910
    at CallbackQueue.notifyAll (:3001/static/js/bundle.js:12355)
    at ReactReconcileTransaction.close (:3001/static/js/bundle.js:32951)
    at ReactReconcileTransaction.closeAll (:3001/static/js/bundle.js:7667)
    at ReactReconcileTransaction.perform (:3001/static/js/bundle.js:7614)
    at batchedMountComponentIntoNode (:3001/static/js/bundle.js:13300)
    at ReactDefaultBatchingStrategyTransaction.perform (:3001/static/js/bundle.js:7601)
    at Object.batchedUpdates (:3001/static/js/bundle.js:31733)
    at Object.batchedUpdates (:3001/static/js/bundle.js:2226)
    at Object._renderNewRootComponent (:3001/static/js/bundle.js:13493)
    at Object._renderSubtreeIntoContainer (:3001/static/js/bundle.js:13575)
    at Object.render (:3001/static/js/bundle.js:13596)
    at Object.<anonymous> (:3001/static/js/bundle.js:18475)
    at __webpack_require__ (:3001/static/js/bundle.js:660)
    at fn (:3001/static/js/bundle.js:86)
    at Object.<anonymous> (:3001/static/js/bundle.js:48827)
    at __webpack_require__ (:3001/static/js/bundle.js:660)
    at validateFormat (:3001/static/js/bundle.js:709)
    at :3001/static/js/bundle.js:712

swissums avatar Jul 02 '17 20:07 swissums