I am trying to integrate deck.gl with ArcGIS in my React application by following the example provided in the deck.gl documentation (https://deck.gl/docs/api-reference/arcgis/deck-renderer). However, I am encountering an error when the layer is being rendered.
Uncaught (in promise)
Error: Error during linking: Vertex shader is not compiled.
at WEBGLRenderPipeline._reportLinkStatus (@deck__gl_arcgis.js?v=271bc730:4903:15)
at WEBGLRenderPipeline._linkShaders (@deck__gl_arcgis.js?v=271bc730:4879:12)
at new WEBGLRenderPipeline (@deck__gl_arcgis.js?v=271bc730:4733:10)
at _WebGLDevice.createRenderPipeline (@deck__gl_arcgis.js?v=271bc730:6086:12)
at _PipelineFactory.createRenderPipeline (chunk-66KWV6NY.js?v=271bc730:24291:36)
at _Model._updatePipeline (chunk-66KWV6NY.js?v=271bc730:24916:44)
at new _Model (chunk-66KWV6NY.js?v=271bc730:24560:26)
at _ScatterplotLayer._getModel (chunk-H3ARGZG2.js?v=271bc730:2306:12)
at _ScatterplotLayer.updateState (chunk-H3ARGZG2.js?v=271bc730:2280:31)
at _ScatterplotLayer._update (chunk-66KWV6NY.js?v=271bc730:40454:14)
Any help in resolving this issue would be greatly appreciated.
Flavors
[ ] Script tag
[X] React
[ ] Python/Jupyter notebook
[ ] MapboxOverlay
[ ] GoogleMapsOverlay
[ ] CartoLayer
[X] ArcGIS
Expected Behavior
Layer should be rendered properly on the map
Steps to Reproduce
Here is the code snippet from my React component:
import * as React from 'react';
import { Box } from '@mui/material';
import { DeckRenderer } from '@deck.gl/arcgis';
import { ScatterplotLayer } from '@deck.gl/layers';
import ArcGISMap from '@arcgis/core/Map';
import SceneView from '@arcgis/core/views/SceneView';
import * as externalRenderers from '@arcgis/core/views/3d/externalRenderers';
import { useEffect } from 'react';
function MyBaseMap() {
const mapRef = React.useRef<any>(null);
useEffect(() => {
const sceneView = new SceneView({
container: mapRef.current,
map: new ArcGISMap({
basemap: 'dark-gray-vector'
}),
camera: {
position: { x: -74, y: 40.65, z: 5000 },
heading: 180,
tilt: 30
},
viewingMode: 'global'
});
const renderer = new DeckRenderer(sceneView, {
layers: [
new ScatterplotLayer({
data: [{ position: [0.119, 52.205] }],
getPosition: (d) => d.position,
getColor: [255, 0, 0],
radiusMinPixels: 20
})
]
});
externalRenderers.add(sceneView, renderer);
}, []);
return <Box component="div" ref={mapRef} sx={{ height: '100%', width: '100%' }}></Box>;
}
export default React.memo(MyBaseMap);
Description
I am trying to integrate deck.gl with ArcGIS in my React application by following the example provided in the deck.gl documentation (https://deck.gl/docs/api-reference/arcgis/deck-renderer). However, I am encountering an error when the layer is being rendered.
Uncaught (in promise) Error: Error during linking: Vertex shader is not compiled.
Any help in resolving this issue would be greatly appreciated.
Flavors
Expected Behavior
Layer should be rendered properly on the map
Steps to Reproduce
Here is the code snippet from my React component:
Environment
Logs