Search code examples
javascriptangulardeck.gl

Unable to create Deck.gl layers and overlay


I installed deck.gl through npm and I'm unable to create layers. At first I was trying to create a google overlay, later I tried it with mapbox overelay. It keeps throwing same error I'm attaching error image and code snippet. I'm using it with angular and I'm trying to create an overlay in my ngOnInit of component. Thanks! [![error image][1]][1]

import {ScatterplotLayer} from '@deck.gl/layers';
import {MapboxLayer} from '@deck.gl/mapbox';

//below in my ngOnInit
  ngOnInit() {
    this.initializeManagers();
    this.addListenerForAddressInput();

    const myDeckLayer = new MapboxLayer({
      id: 'my-scatterplot',
      type: ScatterplotLayer,
      data: [
        {position: [-74.5, 40], size: 100}
      ],
      getPosition: d => d.position,
      getRadius: d => d.size,
      getColor: [255, 0, 0]
    });
  }


  [1]: https://i.sstatic.net/ASRuw.png

Solution

  • Ok so the issue was with npm modules of deck.gl it was using loaders.gl so I installed it but it didn't work so I manually imported script in my index.html and it worked.

      <script src="https://unpkg.com/[email protected]/dist.min.js"></script>
      <script src="https://unpkg.com/@deck.gl/[email protected]/dist.min.js"></script>